@charset "utf-8";

/*-- 

content_event

====================================================== --*/

#content_event{
z-index:1;
}
#content_event .headline03{
margin-bottom:64px;
}
#content_event .lst_event{
width:1080px;
margin:0 auto;
animation:fadeIn 2s ease 0s 1 normal;
}
@keyframes fadeIn{
0%{opacity:0}
100%{opacity:1}
}
#content_event .lst_event > li{
width:350px;
margin:0 5px 10px;
}
#content_event .lst_event > li > a{
display:block;
position:relative;
overflow:hidden;
}
#content_event .lst_event > li > a figure img{
width:100%;
height:auto;
}
#content_event .lst_event > li > a .txt{
color:#fff;
position:absolute;
top:-100%;
left:0;
width:100%;
height:100%;
background:rgba(195,13,35,0.8);
padding:40px;
display:flex;
align-items:flex-start;
justify-content:flex-end;
flex-direction:column;
opacity:0;
transition:opacity .3s ease-in-out,top .3s ease-in-out;
}
#content_event .lst_event > li > a .txt .title{
text-align:justify;
word-break:break-all;
line-height:1.4;
font-size:20px;
margin-bottom:10px;
}
#content_event .lst_event > li > a .txt .date{
display:flex;
align-items:center;
justify-content:flex-start;
flex-wrap:wrap;
font-family:'Oswald','Noto Sans JP',sans-serif;
font-weight:500;
font-size:12px;
line-height:1.2;
}
#content_event .lst_event > li > a .txt .cat{
display:block;
background:#292625;
padding:5px 10px;
margin-right:16px;
}
#content_event .lst_event > li > a .txt time{
margin:4px 0;
}
#content_event .lst_event > li > a:hover{
opacity:1;
}
#content_event .lst_event > li > a:hover .txt{
top:0;
opacity:1;
}

/* sp */
@media screen and (max-width:750px){

#content_event .headline03{
margin-bottom:64px;
margin-bottom:8.5333vw;
}
#content_event .lst_event{
width:494px;
width:65.8666vw;
margin:0 auto;
animation:none;
}
#content_event .lst_event > li{
width:100%;
margin:0 auto 80px;
margin: 0 auto 10.6666vw;
}
#content_event .lst_event > li:last-child{
margin-bottom:0;
}
#content_event .lst_event > li > a .txt{
color:#292625;
position:relative;
top:inherit;
left:inherit;
width:auto;
height:auto;
background:#fff;
opacity:1;
transition:none;
padding:40px;
padding:5.3333vw;
}
#content_event .lst_event > li > a .txt .title{
font-size:28px;
font-size:3.7333vw;
margin-bottom:20px;
margin-bottom:2.6666vw;
}
#content_event .lst_event > li > a .txt .date{
font-size:24px;
font-size:3.2vw;
}
#content_event .lst_event > li > a .txt .cat{
color:#fff;
padding:10px 20px;
padding:1.3333vw 2.6666vw;
margin-right:32px;
margin-right:4.2666vw;
}
#content_event .lst_event > li > a .txt time{
margin:24px 0;
margin:3.2vw 0;
}
#content_event .lst_event > li > a:hover,
#content_event .lst_event > li > a:hover .txt{
top:inherit;
text-decoration:none;
}

}



/*-- 

content_event_detail

====================================================== --*/

#common_body #content_event_detail .inner{
padding-top:160px;
}

/*-- box_detail --*/

#content_event_detail .box_detail{
position:relative;
display:flex;
align-items:flex-start;
justify-content:center;
}
#content_event_detail .box_detail::before{
background:#c30d23;
display:block;
content:"";
position:absolute;
top:-80px;
right:0;
width:calc(50% - 240px);
height:214px;
z-index:0;
}
#content_event_detail .box_event_detail{
background:#fff;
width:1000px;
margin:0 0 64px;
padding:100px;
z-index:1;
}

/* txt */

#content_event_detail .txt .title{
text-align:justify;
word-break:break-all;
line-height:1.4;
font-size:44px;
margin:0 0 20px;
}
#content_event_detail .txt .title::first-letter{
color:#c30d23;
}
#content_event_detail .txt .date{
display:flex;
align-items:center;
justify-content:flex-start;
flex-wrap:wrap;
font-family:'Oswald','Noto Sans JP',sans-serif;
font-weight:500;
font-size:12px;
line-height:1.2;
margin-bottom:64px;
}
#content_event_detail .txt .cat{
display:block;
color:#fff;
background:#292625;
padding:5px 10px;
margin-right:16px;
}
#content_event_detail .txt time{
margin:4px 0;
}

/* lst_post_nav */

#content_event_detail .lst_post_nav{
display:flex;
align-items:flex-start;
justify-content:space-between;
margin:64px 0 0;
}
#content_event_detail .lst_post_nav li:last-child{
margin-right:0;
}
#content_event_detail .lst_post_nav li.only{
margin-right:auto;
}
#content_event_detail .lst_post_nav li.post_next.only{
margin-right:0;
margin-left:auto;
}
#content_event_detail .lst_post_nav li a{
border:1px solid #c5c5c5;
position:relative;
background:#fff;
display:flex;
align-items:center;
justify-content:center;
font-family:'Oswald','Noto Sans JP',sans-serif;
font-weight:500;
letter-spacing:.05em;
width:100px;
height:30px;
font-size:12px;
line-height:1.2;
transition:background .3s ease-in-out;
cursor:pointer;
}
#content_event_detail .lst_post_nav li a::after{
position:absolute;
bottom:0;
right:0;
content:'';
width:0;
height:0;
border-bottom:2px solid #c30d23;
transition:width .3s ease-in-out;
}
#content_event_detail .lst_post_nav li.active a::after,
#content_event_detail .lst_post_nav li:hover a::after{
width:100%;
}
#content_event_detail .lst_post_nav li a:hover{
text-decoration:none;
opacity:1;
background:#fbfbfb;
}

/* sp */
@media screen and (max-width:750px){

#common_body #content_event_detail .inner{
padding:128px 64px;
padding:17.06666vw 8.5333vw;
}

/*-- box_detail --*/

#content_event_detail .box_detail{
overflow:auto;
display:block;
}
#content_event_detail .box_detail::before{
content:none;
top:inherit;
left:inherit;
}
#content_event_detail .box_event_detail{
width:100%;
margin:0;
margin-bottom:64px;
margin-bottom:8.5333vw;
padding:64px;
padding:8.5333vw;
}

/* txt */

#content_event_detail .txt .title{
font-size:5.6vw;
font-size:;
margin:0 0 20px;
margin:0 0 2.6666vw;
}
#content_event_detail .txt .date{
font-size:24px;
font-size:3.2vw;
margin-bottom:64px;
margin-bottom:8.5333vw;
}
#content_event_detail .txt .cat{
color:#fff;
padding:10px 20px;
padding:1.3333vw 2.6666vw;
margin-right:32px;
margin-right:4.2666vw;
}
#content_event_detail .txt time{
margin:24px 0;
margin:3.2vw 0;
}

/* lst_post_nav */

#content_event_detail .lst_post_nav{
justify-content:space-between;
margin:64px 0 0;
margin:8.5333vw 0 0;
}
#content_event_detail .lst_post_nav li a{
letter-spacing:0;
width:186px;
width:24.8vw;
height:60px;
height:8vw;
font-size:21px;
font-size:2.8vw;
}
#content_event_detail .lst_post_nav li a::after{
border-bottom:3px solid #c30d23;
border-bottom:0.4vw solid #c30d23;
transition:none;
}
#content_event_detail .lst_post_nav li a:hover{
background:#fff;
}

}