@charset "UTF-8";

/* ----------------------------------
 EVENTLIST - PC
---------------------------------- */
[data-browse-mode="P"] h1.block-event-page--header { width: 100%; margin: 60px 0 35px; display: flex; justify-content: center; align-items: center;}
[data-browse-mode="P"] h1.block-event-page--header::before { content: ''; width: 36px; height: 36px; margin: 0 15px 0 0; background: url("../../img/usr/common/icon_feature.png") left center no-repeat; -webkit-background-size: 36px 36px; background-size: 36px 36px; display: inline-block;}
[data-browse-mode="P"] .block-event-page--accessory { display: flex; flex-wrap: wrap;}
[data-browse-mode="P"] .block-event-page--accessory .event-frame { width: calc((100% - 80px) / 3); margin: 0 40px 40px 0; font-size: 16px;}
[data-browse-mode="P"] .block-event-page--accessory .event-frame a { text-decoration: none;}
[data-browse-mode="P"] .block-event-page--accessory .event-frame:nth-child(3n) { margin: 0 0 40px 0;}
[data-browse-mode="P"] .block-event-page--accessory .event-frame .block-top-event--image { margin: 0 0 10px 0;}
[data-browse-mode="P"] .block-event-page--accessory .event-frame .block-top-event--image img { transition: 0.3s ease-out;}
[data-browse-mode="P"] .block-event-page--accessory .event-frame .block-top-event--image a:hover { opacity: 1;}
[data-browse-mode="P"] .block-event-page--accessory .event-frame .block-top-event--image a:hover img { transform: translateY(-8px); box-shadow: 0px 5px 5px -5px rgba(0,0,0,0.6);}

/* ----------------------------------
 EVENTLIST - SP
---------------------------------- */
[data-browse-mode="S"] .block-event-page--header { padding: 46px 0 0 0; margin: 30px 0 20px; background: url("../../img/usr/common/icon_feature.png") center top no-repeat; -webkit-background-size: 36px 36px; background-size: 36px 36px; text-align: center;}
[data-browse-mode="S"] .block-event-page--accessory { margin: 0 15px;}
[data-browse-mode="S"] .block-event-page--accessory .event-frame { padding: 0; margin: 0 0 20px 0; text-align: left; font-size: 14px;}
[data-browse-mode="S"] .block-event-page--accessory .event-frame .block-top-event--image { padding: 0; margin: 0 0 10px 0;}
[data-browse-mode="S"] .block-event-page--accessory .event-frame .block-top-event--image img { vertical-align: top;}