@charset "utf-8";
.section_search{
    padding: 32px 40px 44px;
    background-color: #eee;
    margin-bottom: 64px;
}
.freeword_container{
    padding: 0 40px;
    margin-bottom: 52px;
}
.freeword_heading{
    font-size: 1.43em;
    font-weight: 700;
    letter-spacing:0.05em;
    margin-right: 15px;
}
.freeword_heading_en{
    font-size: 0.93em;
    letter-spacing:0.05em;
    color: #999;
}
.freeword_input_container{
    display: flex;
    margin-top: 16px;
}
.link_btn_gray.freeword_btn{
    padding: 16px 24px 16px 40px;
    margin-left: 16px;
}
.freeword_btn::before{
    content: url(/images/search/btn_search.png);
    position: absolute;
    left: 15px;
    top: 50%;
    margin-top: -10px;
}
.freeword_btn:hover::before{
    content: url(/images/search/btn_search_dark.png);
}
body.color-dark .freeword_btn::before{
    content: url(/images/search/btn_search_dark.png);
}

body.color-dark .freeword_btn:hover::before{
    content: url(/images/search/btn_search.png);
}
.accordion_h3{
    background-color: #425262;
    text-align: center;
}
.accordion_trigger{
    width: 100%;
    height: 100%;
    padding: 20px;
    box-sizing: border-box;
    color: #fff;
    position: relative;
}
.accordion_trigger::after {
    content: url(/images/common/btn_arrow_dark.png);
    pointer-events: none;
    position: absolute;
    right: 25px;
    top: 50%;
    margin-top: -10px;
}
.accordion_trigger[aria-expanded="true"]::ardion_panelfter {
    transform:rotate(-90deg); 
}
.accordion_trigger[aria-expanded="false"]::after {
    transform:rotate(90deg); 
}
.accordion_panel[aria-hidden="true"] {
    display: none;
}
.accordion_panel{
    background-color: #fff;
}
.detailed_search_fieldset_container{
    padding: 40px;
    border-bottom: solid 1px #b9c1c8;
}
.detailed_search_fieldset{
    display: flex;
    align-items: center;
    border: none;
}
.detailed_search_fieldset:not(:last-child){
    margin-bottom: 36px;
}
.detailed_search_fieldset > legend+div{
    width: calc(100% - 8.125em);
}
.accordion_heading{
    font-size: 1.56em;
    font-weight: 700;
    letter-spacing: 0.05em;
}
.accordion_heading_en{
    letter-spacing: 0.06em;
    margin-left: 10px;
}

.detailed_search_heading{
    font-size: 1.22em;
    font-weight: 700;
    letter-spacing: 0.05em;
    display: block;
}
.detailed_search_heading_en{
    font-size: 0.81em;
    letter-spacing: 0.025em;
    color: #ccc;
}

.production_year_container{
    display: flex;
    align-items: center;
}
.production_year_container > input[type="text"]{
    width: 9.22em;
}
.production_year_container > select{
    width: 9.22em;
    text-align: center;
}

.production_year_container > span{
    margin: 0 10px;
} 
.detailed_search_fieldset > legend{
    display: contents;
}
.detailed_search_heading_container{
    width: 8.125em;
    margin: 0;
}
.detailed_search_btn_container{
    padding: 32px 40px;
    display: flex;
    justify-content: center;
}
.link_btn,
.link_btn_gray{
    min-width: 234px;
    height: 68px;
    padding: 14px 15px 12px;
    margin:0;
}
.detailed_search_btn_container .link_btn_gray{
    margin-right: 34px;
    border-color: #425262;
}

.link_btn .link_btn_ja,
.link_btn_gray .link_btn_ja{
    display: block;
    font-size: 1.22em;
    font-weight: 700;
    letter-spacing: 0.05em;
    line-height: 1;
    margin-bottom: 10px;
}
.link_btn .link_btn_en,
.link_btn_gray .link_btn_en{
    display: block;
    letter-spacing: 0.05em;
    line-height: 1;
}
.link_btn .link_btn_en{
    color: #425262;
}
.link_btn_gray .link_btn_en{
    color: #fff;
}
.link_btn:hover .link_btn_en{
    color: #fff;
}
.link_btn_gray:hover .link_btn_en{
    color: #425262;
}
body.color-dark .link_btn .link_btn_en{
    color: #fff;
}
body.color-dark .link_btn_gray .link_btn_en{
    color: #425262;
}
body.color-dark .link_btn:hover .link_btn_en{
    color: #425262;
}
body.color-dark .link_btn_gray:hover .link_btn_en{
    color: #fff;
}

body.color-dark .section_search{
    background-color: #444;
    border: solid 1px #fff;
}
body.color-dark .accordion_panel{
    background-color: #000;
    border: solid 1px #fff;
}

@media (max-width: 768px) {
    .section_search{
        padding: 32px 2% 15px;
    }
    .freeword_container{
        padding: 0;
        margin-bottom: 30px;
    }
    .freeword_input_container{
        display: block;
    }
    .freeword_input_container .freeword_btn{
        margin: 10px auto 0;
    }
    .accordion_heading{
        display: block;
    }
    .detailed_search_fieldset_container{
       padding: 2% 10px; 
    }
    .detailed_search_fieldset{
        display: block;
    }
    .detailed_search_heading_container,
    .detailed_search_fieldset > legend + div{
        width: 100%;
    }
    .production_year_container > input[type="text"],
    .production_year_container > select{
        width: 7em;
        width: max(7em, 30vw);
    }
    .production_year_container > span{
        margin: 0 5px;
    }
    .detailed_search_btn_container{
        display: block;
    }
    .detailed_search_btn_container .link_btn{
        margin: 0 auto;
    }
    .detailed_search_btn_container .link_btn_gray{
        margin: 0 auto 10px;
    }
}

/*ページネーション*/
.section_pagination{
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 30px;
}
.pagination_h2{
    font-size: 1.56em;
    font-weight: 700;
    letter-spacing: 0.05em;
}
.pagination_container{
    display: flex;
    align-items: center;
    margin-left: auto;
    flex-wrap: wrap;
}
.pagination_caption{
    font-size: 1.12em;
    letter-spacing: 0.05em;
    margin-right: 18px;
}
.pagination_list{
    margin-left: auto;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}
.pagination_list li:not(:last-child){
    margin-right: 4px;
}
.pagination_list li a{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    width: 40px;
    height: 40px;
    box-sizing: border-box;
    border: solid 1px #ccc;
    border-radius: 3px;
    font-weight: 700;
}
.pagination_list li a.prev,
.pagination_list li a.next{
    width: 8em;
    padding: 3px 12px;
    position: relative;
    letter-spacing: 0.05em;
    line-height: 1;
    min-height: 40px;
    height: auto;
    box-sizing: border-box;
}
.pagination_list li a.prev .arrow_ja,
.pagination_list li a.next .arrow_ja{
    display: inline-block;
}
.pagination_list li a.prev::after,
.pagination_list li a.next::after{
    position: absolute;
    content: url(/images/common/btn_arrow.png);
    top:50%;
    margin-top: -10px;
}
.pagination_list li a.prev{
    justify-content:flex-end;
}
.pagination_list li a.prev::after{
    transform:rotate(180deg); 
    left: 6px;
    margin-top: -15px;
}
.pagination_list li a.next{
    justify-content:flex-start;
}
.pagination_list li a.next::after{
    right: 6px;
}
.pagination_list li a[aria-current="page"]{
    background-color: #425262;
    color: #fff;
}
.pagination_list li .omit{
    font-size: 12px;
    letter-spacing: -6px;
    margin-right: 5px;
    height: 40px;
    display: flex;
    align-items: center;
}
.pagination_list li a:hover{
    background-color: #425262;
    color: #fff;
}
.pagination_list li a.prev:hover::after,
.pagination_list li a.next:hover::after{
    content: url(/images/common/btn_arrow_dark.png);
}
body.color-dark .pagination_list li a.prev::after,
body.color-dark .pagination_list li a.next::after{
    content: url(/images/common/btn_arrow_dark.png);
}
body.color-dark .pagination_list li a:hover{
    background-color: #fff;
    color: #000;
}
body.color-dark .pagination_list li a.prev:hover::after,
body.color-dark .pagination_list li a.next:hover::after{
    content: url(/images/common/btn_arrow.png);
}
@media (max-width: 768px) {
    .pagination_h2{
        margin-bottom: 10px;
    }
    .pagination_list li{
        margin-bottom: 5px;
    }
}

/*一覧*/
.collection_list{
    display: flex;
    flex-wrap: wrap;
}
.collection_item{
    width: 22.675%;
    margin-bottom: 44px;
}
.collection_item:not(:nth-child(4n)){
    margin-right: 3.1%;
}
.collection_list_link{
    display: block;
}
.collection_list_img{
    width: 100%;
    overflow: hidden;
    margin-bottom: 16px;
}
.collection_list_img img{
    transition: 300ms;
    width: 100%;
    height: auto;
}
.collection_item a:hover .collection_list_img img{
    transform:scale(1.1);
}
.collection_list_dl dt{
    font-size: 1.22em;
    font-weight: 700;
    letter-spacing: 0.05em;
    color: #425262;
    margin-bottom: 2px;
}
.collection_list_dl dd{
    font-weight: 700;
    letter-spacing: 0.05em;
    margin-bottom: 15px;
}
.collection_list_dl_en{
    font-size: 0.81em;
    font-weight: 700;
    letter-spacing: 0.05em;
    color: #333;
    display: flex;
    flex-direction:column-reverse;
}
.collection_list_dl_en dd{
    margin-bottom: 5px;
}
.collection_list_dl dt,
.collection_list_dl dd,
.collection_list_dl_en dt,
.collection_list_dl_en dd{
    /* line-height: 1; */
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

body.color-dark .collection_list_dl dt ,
body.color-dark .collection_list_dl_en{
    color: #fff;
}
@media (max-width: 768px) {
    .collection_list{
        justify-content: space-between;
    }
    .collection_item{
        width: 48%;
        margin-bottom: 44px;
    }
    .collection_item:not(:nth-child(4n)){
        margin-right: 0%;
    }
}