@charset "euc-jp";
/*--------- CSS MENU ---------*/
/*------------------------------
/*  01.  page - title
/*  02.  page - item list
--------------------------------
------------------------------*/

/*  01.  page - title
------------------------------*/
/*  pc  */
@media screen and (min-width: 980px) {
/*  page  *//*  title  */
#item-list_title {position: relative; float: left; width: 100%; height: auto; background-color: #EEE;}
#item-list_title .wrap {position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0,0,0,0.2); z-index: 2;}
#item-list_title .image {position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-size: cover; background-position: center; z-index: 1;}
#item-list_title .title {position: relative; width: 800px; height: auto; margin: 80px auto; box-sizing: border-box; z-index: 3;}
#item-list_title .title h2 {line-height: 40px; font-size: 20px; font-weight: normal; text-align: center; letter-spacing: 2px; color: #777;}
#item-list_title .title h2 span {font-size: 14px;}
#item-list_title .title p {line-height: 20px; margin-top: 40px; font-size: 12px; font-weight: normal; text-align: center; letter-spacing: 2px; color: #FFF;}
}

/*  sp  */
@media screen and (max-width: 979px) {
/*  page  *//*  title  */
#item-list_title {position: relative; float: left; width: 100%; height: auto; background-color: #EEE;}
#item-list_title .wrap {position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0,0,0,0.2); z-index: 2;}
#item-list_title .image {position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-size: cover; background-position: center; z-index: 1;}
#item-list_title .title {position: relative; width: 100%; height: auto; padding: 40px 20px 40px 20px; box-sizing: border-box; z-index: 3;}
#item-list_title .title h2 {line-height: 30px; font-size: 16px; font-weight: normal; text-align: center; letter-spacing: 4px; color: #777;}
#item-list_title .title h2 span {font-size: 12px;}
#item-list_title .title p {line-height: 20px; margin-top: 20px; font-size: 10px; font-weight: normal; text-align: center; letter-spacing: 1px; color: #FFF;}
}

/*  02.  page - item list
------------------------------*/
/*  pc  */
@media screen and (min-width: 980px) {
/*  page  *//*  item list  */
#page_item-list .item-list_num {float: left; width: 100%; height: auto; border-top: 1px solid #DDD; border-bottom: 1px solid #DDD;}
#page_item-list .item-list_num {display: flex; flex-wrap: nowrap;}
#page_item-list .item-list_num .block {width: 50%;}
#page_item-list .item-list_num .block p.en {height: 60px; line-height: 20px; padding: 20px; font-size: 12px; font-weight: normal; letter-spacing: 2px; color: #777; box-sizing: border-box;}
#page_item-list .item-list_num .block p.en span {margin-left: 5px; margin-right: 5px; font-size: 16px;}     
#page_item-list .item-list_num .block ul {float: right; width: auto; height: auto;}
#page_item-list .item-list_num .block ul {display: flex; flex-wrap: nowrap;}
#page_item-list .item-list_num .block ul li {line-height: 20px; font-size: 14px; font-weight: normal; letter-spacing: 2px; border-right: 1px solid #DDD;}
#page_item-list .item-list_num .block ul li:first-of-type {border-left: 1px solid #DDD;}
#page_item-list .item-list_num .block ul li a {position: relative; padding: 20px 60px 20px 40px; color: #000; background-color: #EEE;}
#page_item-list .item-list_num .block ul li a::after {position: absolute; content: ""; width: 20px; height: 20px; top: 50%; left: 50%; margin-left: 30px; background-image: url("https://hilalay.jp/image/icon_down.png"); background-size: 10px; background-position: center; background-repeat: no-repeat; transform: translate(-50%,-50%);}
#page_item-list .item-list_num .block ul li p {position: relative; padding: 20px 60px 20px 40px; color: #000; background-color: #FFF;}
#page_item-list .item-list_num .block ul li p::after {position: absolute; content: ""; width: 20px; height: 20px; top: 50%; left: 50%; margin-left: 30px; background-image: url("https://hilalay.jp/image/icon_down.png"); background-size: 10px; background-position: center; background-repeat: no-repeat; transform: translate(-50%,-50%);}

/*  page  *//*  item list  *//*  body  */
#page_item-list .item-list_body {float: left; width: 100%; height: auto; padding: 40px; box-sizing: border-box;}

/*  page  *//*  item list  *//*  body  *//*  pagination */
#page_item-list #pagination {float: left; width: 100%; height: auto; margin-top: 20px; margin-bottom: 20px;}
#page_item-list #pagination ul {float: left; width: 100%; height: auto;}
#page_item-list #pagination ul {display: flex; flex-wrap: nowrap; justify-content: center;}
#page_item-list #pagination ul li {width: 30px; height: 30px; margin-left: 10px; margin-right: 10px; border: 1px solid #DDD; border-radius: 50%; overflow: hidden;}
#page_item-list #pagination ul li p {line-height: 30px; font-size: 12px; font-weight: bold; text-align: center; color: #AAA; background-color: #EEE;}
#page_item-list #pagination ul li a {line-height: 30px; font-size: 12px; font-weight: bold; text-align: center; color: #FFF; background-color: #777;}
#page_item-list #pagination ul li a.prev {width: 30px; height: 30px; background-color: #777; background-image: url("https://hilalay.jp/image/icon_prev-white.png"); background-size: 12px; background-position: center; background-repeat: no-repeat; }
#page_item-list #pagination ul li a.next {width: 30px; height: 30px; background-color: #777; background-image: url("https://hilalay.jp/image/icon_next-white.png"); background-size: 12px; background-position: center; background-repeat: no-repeat; }
}

/*  sp  */
@media screen and (max-width: 979px) {
/*  page  *//*  item list  */
#page_item-list .item-list_num {float: left; width: 100%; height: auto; border-top: 1px solid #DDD; border-bottom: 1px solid #DDD;}
#page_item-list .item-list_num {display: flex; flex-wrap: wrap;}
#page_item-list .item-list_num .block {width: 100%;}
#page_item-list .item-list_num .block:first-of-type {border-bottom: 1px solid #DDD;}
#page_item-list .item-list_num .block p.en {height: 40px; line-height: 20px; padding: 10px; font-size: 12px; font-weight: normal; text-align: center; letter-spacing: 2px; color: #777; box-sizing: border-box;}
#page_item-list .item-list_num .block p.en span {margin-left: 5px; margin-right: 5px; font-size: 14px;}     
#page_item-list .item-list_num .block ul {float: left; width: 100%; height: auto;}
#page_item-list .item-list_num .block ul {display: flex; flex-wrap: nowrap;}
#page_item-list .item-list_num .block ul li {width: 50%; line-height: 20px; font-size: 12px; font-weight: normal; letter-spacing: 2px; border-right: 1px solid #DDD;}
#page_item-list .item-list_num .block ul li:first-of-type {border-left: 1px solid #DDD;}
#page_item-list .item-list_num .block ul li a {position: relative; padding: 10px 40px 10px 10px; text-align: center; color: #000; background-color: #EEE;}
#page_item-list .item-list_num .block ul li a::after {position: absolute; content: ""; width: 20px; height: 20px; top: 50%; left: 50%; margin-left: 30px; background-image: url("https://hilalay.jp/image/icon_down.png"); background-size: 10px; background-position: center; background-repeat: no-repeat; transform: translate(-50%,-50%);}
#page_item-list .item-list_num .block ul li p {position: relative; padding: 10px 40px 10px 10px; text-align: center; color: #000; background-color: #FFF;}
#page_item-list .item-list_num .block ul li p::after {position: absolute; content: ""; width: 20px; height: 20px; top: 50%; left: 50%; margin-left: 30px; background-image: url("https://hilalay.jp/image/icon_down.png"); background-size: 10px; background-position: center; background-repeat: no-repeat; transform: translate(-50%,-50%);}

/*  page  *//*  item list  *//*  body  */
#page_item-list .item-list_body {float: left; width: 100%; height: auto; padding: 20px; box-sizing: border-box;}

/*  page  *//*  item list  *//*  body  *//*  pagination */
#page_item-list #pagination {float: left; width: 100%; height: auto; margin-top: 20px; margin-bottom: 20px;}
#page_item-list #pagination ul {float: left; width: 100%; height: auto;}
#page_item-list #pagination ul {display: flex; flex-wrap: nowrap; justify-content: center;}
#page_item-list #pagination ul li {width: 24px; height: 24px; margin-left: 3px; margin-right: 3px; border: 1px solid #DDD; border-radius: 20px; overflow: hidden;}
#page_item-list #pagination ul li p {line-height: 24px; font-size: 12px; font-weight: bold; text-align: center; color: #AAA; background-color: #EEE;}
#page_item-list #pagination ul li a {line-height: 24px; font-size: 12px; font-weight: bold; text-align: center; color: #FFF; background-color: #777;}
#page_item-list #pagination ul li a.prev {width: 24px; height: 24px; background-color: #777; background-image: url("https://hilalay.jp/image/icon_prev-white.png"); background-size: 12px; background-position: center; background-repeat: no-repeat; }
#page_item-list #pagination ul li a.next {width: 24px; height: 24px; background-color: #777; background-image: url("https://hilalay.jp/image/icon_next-white.png"); background-size: 12px; background-position: center; background-repeat: no-repeat; }
}

/*  03.  page - empty
------------------------------*/
/*  pc  */
@media screen and (min-width: 980px) {
/*  page  *//*  empty  */
.item-list_body .empty {float: left; width: 100%; height: auto; margin-top: 120px; margin-bottom: 120px;}
.item-list_body .empty p.en {line-height: 40px; font-size: 30px; font-weight: bold; text-align: center; letter-spacing: 2px; color: #FFC1F8;}
.item-list_body .empty p.jp {line-height: 30px; font-size: 16px; font-weight: normal; text-align: center; letter-spacing: 2px; color: #777;}
}

/*  sp  */
@media screen and (max-width: 979px) {
/*  page  *//*  empty  */
.item-list_body .empty {float: left; width: 100%; height: auto; margin-top: 80px; margin-bottom: 80px;}
.item-list_body .empty p.en {line-height: 30px; font-size: 20px; font-weight: bold; text-align: center; letter-spacing: 1px; color: #FFC1F8;}
.item-list_body .empty p.jp {line-height: 20px; font-size: 12px; font-weight: normal; text-align: center; letter-spacing: 2px; color: #777;}
}