@charset "UTF-8";
/**************************************************************/
/* マガジン一覧（アーカイブ） */
/**************************************************************/
/*パンくず*/
.mg-breadcrumb-list {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    font-size:14px;
    color: #555;
    margin-bottom: 50px;
    border-bottom: solid 1px #ccc;
}

.mg-breadcrumb-list li {
    margin-right:10px;
}

.mg-breadcrumb-list li:last-child {
    margin-right:0;
}

.mg-breadcrumb-list a:hover{
    opacity: .5;
    transition: 0.2s;
}

.mg-breadcrumb-list button {
    margin-top: -1px;
}

.mg-breadcrumb-list button:hover{
    opacity: .5;
}

.bc-home-icon {
    background:url("../../assets/img/icon_home.svg") no-repeat center center;
    background-size: contain;
    width: 20px;
    height: 20px;
    display: inline-block;
}

@media screen and (max-width: 599px) {
    .mg-breadcrumb-list {
        font-size:12px;
        margin-bottom: 30px;
    }

    .mg-breadcrumb-list li {
        margin-right:5px;
    }

    .bc-home-icon {
        width: 16px;
        height: 16px;
    }
}


/**************************************************************/
/* 検索フォーム */
/**************************************************************/
.magazine-menu-btn {
    font-size:16px;
}

.magazine-menu-btn .widget_search{
    margin-bottom:40px;
}

.magazine-menu-btn .widget_margin_top {
    margin-top:25px;
}

.magazine-menu-btn .widget_search form {
    border: 1px solid #888;
    border-radius: 4px;
    background: #fff;
    height: 50px;
    box-sizing: border-box;
}

#searchform #s,
#searchform #f {
    border: none;
    background: none;
    padding: 0 10px;
    margin: 0;
    width: calc(100% - 50px);
    height: 50px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

#searchform .submit_button {
    position: relative;
    width: 50px;
    height: 50px;
    float: right;
    top: -1px;
}

#searchsubmit {
    text-indent: -9999px; 
    width: 40px; 
    height: 40px; 
    background:url("../../assets/img/icon_search.svg") no-repeat center center;
    background-size: 60%;
    border: none;
    opacity: .6;
    cursor: pointer;
}

#searchsubmit:hover {
    opacity: .3;
}

input[type="text"],
#archives-dropdown-2:focus {
    outline: none;
}

@media screen and (max-width: 599px) {
    .magazine-menu-btn {
        font-size:14px;
    }

    .magazine-menu-btn .widget_search{
        margin-bottom:20px;
    }

    .magazine-menu-btn .widget_search form {
        height: 40px;
    }

    #searchform #s,
    #searchform #f {
        padding: 0 10px;
        width: calc(100% - 50px);
        height: 40px;
    }

    #searchsubmit {
        width: 40px; 
        height: 40px; 
        background-size: 60%;
    }
}

/**************************************************************/
/* 月選択アーカイブ */
/**************************************************************/
.magazine-menu-btn .widget_archive{
    margin-bottom:40px;
    display:block; 
}

.magazine-menu-btn .widgettitle {
    display:none; 
}

.screen-reader-text{
    height: 50px;
    border: 1px solid #888;
    border-radius: 4px;
    background: #fff;
}

.widget_archive {
  position: relative; /* 子要素の配置基準に設定 */
  display: inline-block; /* 幅をコンテンツに合わせる */
}

/* 下向き矢印アイコンの追加 */
.widget_archive::after {
    position: absolute;
    right: 15px;
    top:15px;
    width: 20px;
    height: 20px;
    /*background-color: #535353;
    clip-path: polygon(0 0, 100% 0, 50% 100%);*/
    content: '';
    pointer-events: none;
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNS4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IuODrOOCpOODpOODvF8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiDQoJIHk9IjBweCIgd2lkdGg9IjIwcHgiIGhlaWdodD0iMjBweCIgdmlld0JveD0iMCAwIDIwIDIwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAyMCAyMCIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+DQo8cG9seWxpbmUgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjODA4MDgwIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHBvaW50cz0iNy40OCwxNy4zNTEgMTQuNTUyLDEwLjI3OSA3LjQ4LDMuMjA4ICIvPg0KPC9zdmc+DQo=");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    transform: rotate(90deg);
}

.widget_archive select {
    appearance: none;
    padding: 0 10px;
    margin: 0;
    width: 100%;
    height: 50px;
    border: 1px solid #888;
    border-radius: 3px;
    background: #fff;
    color: #333333;
    font-size: 1em;
    cursor: pointer;
}

/* JavaScriptで追加するクラス名 */
.widget_archive.open::after {
    transform: rotate(-90deg);
}

@media screen and (max-width: 599px) {
    .magazine-menu-btn .widget_archive{
        margin-bottom:20px;
    }

    .screen-reader-text{
        height: 40px;
    }

    .widget_archive::after {
        top:10px;
    }

    .widget_archive select {
        height: 40px;
    }

}

/**************************************************************/
/* カテゴリー */
/**************************************************************/
.magazine-menu-btn .magazine-customname {
    width:100%;
    border-left:solid 6px #bfbfbf;
    padding-left:8px;
    padding-bottom:-2px;
    font-size:20px;
    font-weight:bold;
    margin:60px 0  10px 0;
}

.magazine-menu-btn .widget_nav_menu .menu {
    padding-left:10px;
}

.magazine-menu-btn .widget_nav_menu .menu li {
    width:100%;
    padding: 5px 0;
    list-style: none !important;
    /*
    background:#ddd;
    display: inline-block;
    */
}

.magazine-menu-btn .widget_nav_menu .menu li .sub-menu li {
    padding:5px 0 5px 20px;
}

.magazine-menu-btn .widget_nav_menu ul li .sub-menu li:first-child {
    padding-top:10px;
}

.magazine-menu-btn .widget_nav_menu ul li .sub-menu li:last-child {
    padding-bottom:0;
}

.magazine-menu-btn .widget_nav_menu a {
    text-decoration: underline #fff 0px;
    text-underline-offset: 4px;
    transition: 0.3s;
}

.magazine-menu-btn .widget_nav_menu a:hover {
    text-decoration: underline #555 0px;
}

@media screen and (max-width: 599px) {
    .magazine-menu-btn .magazine-customname {
        font-size:18px;
        margin:30px 0  10px 0;
    }
}

/**************************************************************/
/* ページネーション */
/**************************************************************/
.magazine-pagination {
    width:100%;
    margin:40px auto -40px auto;
    font-size:14px;
}

.nav-links,
.pagination-container {
    display: flex;
    justify-content: center; /* 水平方向の中央揃え */
    align-items: center; /* 垂直方向の中央揃え（高さが異なる場合） */
    flex-wrap: wrap; /* 画面幅が狭いときに折り返す */
    padding: 10px 0; /* 上下の余白 */
}

.page-numbers {
    display: inline-block;
    width:40px;
    height:40px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 4px; /* ボタン同士の間隔 */
    background: #fff; /* 背景色 */
    border: 1px solid #d8d8d8; /* 枠線 */
    color: #333; /* 文字色 */
    text-decoration: none; /* 下線を削除 */
    border-radius: 4px; /* 角を少し丸くする */
    transition: background-color 0.2s ease, border-color 0.2s ease;
}

/* ホバーとアクティブ時のスタイル */
.page-numbers:hover,
.page-numbers.current,
.page-numbers:active {
    background: #aae731; /* 青色の背景 */
    border-color: #aae731; /* 青色の枠線 */
    color: #fff; /* 文字色を白に */
}

/* 現在のページ番号のスタイル（ホバー時と同じ） */
.page-numbers.current {
    cursor: default;
}

/* 矢印アイコンのスタイル調整 */
.icon-prev,
.icon-next {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* … */
.dots{
    background-color: #fff;
    border: 0px solid #fff;
    color: #333;
}

.dots:hover{
    background: #fff;
    border-color: #fff;
    color: #333;
}

@media screen and (max-width: 799px) {
    .magazine-pagination{
        margin:20px auto 0px auto;
        font-size:14px;
    }

    .nav-links,
    .pagination-container {
        padding: 10px 0;
    }

    .page-numbers {
        width:40px;
        height:40px;
        margin: 4px; /* ボタン同士の間隔 */
    }
}

@media screen and (max-width: 599px) {
    .magazine-pagination{
        margin:20px auto 0px auto;
        font-size:12px;
    }

    .nav-links,
    .pagination-container {
        padding: 6px 0;
    }

    .page-numbers {
        width:35px;
        height:35px;
        margin: 3px; /* ボタン同士の間隔 */
    }
}

.pagination-pcnone{
    display: none;
}

.pagination-spnone{
    display: none;
}

@media screen and (min-width: 800px) {
    .pagination-pcnone{
        display: none;
    }

    .pagination-spnone{
        display: block;
    }
}

@media screen and (max-width: 799px) {
    .pagination-pcnone{
        display: block;
    }

    .pagination-spnone{
        display: none;
    }
}