@charset "UTF-8";

@media only screen and (min-width:1281px){
	body{--MaxContentWidth: 120em;}
}


/* home */
#home_cover{position:relative;}
#home_cover>.inner{width:min(var(--MaxContentWidth),100%);padding:var(--spacing);margin-inline:auto;box-sizing:border-box;}

#home_slider{touch-action:pan-y;border-radius:1em;overflow:hidden;position:relative;}
#home_slider .list{display:flex;}
#home_slider .slide{flex:none;position:relative;display:block;width:100%;max-width:960px;aspect-ratio:20/9;border-radius:1em;color:inherit;background:var(--background-color-L3,#fff);overflow:hidden;transition:filter 300ms,opacity 300ms;}
#home_slider .slide img{display:block;width:100%;height:100%;aspect-ratio:inherit;object-fit:cover;border-radius:inherit;transition:transform 300ms;}
#home_slider .slide .headline{display:grid;grid-template-columns:1fr auto;align-items:center;gap:var(--spacing);position:absolute;inset-inline:0;inset-block-end:0;z-index:1;padding:calc(var(--spacing) / 1.5) var(--spacing);background:linear-gradient(180deg,hsl(0 0% clamp(0%,calc((var(--lightness) - var(--threshold)) * 100% * infinity),100%)/25%),hsl(0 0% clamp(0%,calc((var(--lightness) - var(--threshold)) * 100% * infinity),100%)/50%));color:var(--color);transition:transform 300ms 300ms,opacity 300ms 300ms;}
#home_slider .slide .headline::before{content:attr(icon);display:block;font-size:2em;order:9;}
#home_slider .slide .headline span{display:block;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;font-size:var(--SiteFS-XL);font-weight:var(--CPT-FW-EB);text-shadow:hsl(0 0% clamp(0%,calc((var(--lightness) - var(--threshold)) * 100% * infinity),100%)/50%) 1px 1px 0;}
#home_slider .slide:hover img{transform:scale(102.4%)}
#home_slider .slide:not(.active){opacity:.25;filter:grayscale(1);pointer-events:none;}
#home_slider .slide:not(.active) .headline{opacity:0;transform:translateY(1em);}

#home_slider .list:has(.slide:only-child)~.nav{display:none;}
#home_slider .nav{position:absolute;inset-block:0;z-index:1;width:calc((100% - 960px) / 2 - 2em);display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transition:opacity 300ms;}
#home_slider .nav::before{content:attr(icon);display:block;font-size:3em;width:1em;height:1em;line-height:1;overflow:hidden;color:#fff;}
#home_slider .nav:hover{opacity:1;}
#home_slider .prev{inset-inline-start:0}
#home_slider .next{inset-inline-end:0}

#home_slider_bg{position:absolute;inset:0;z-index:-1;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,rgba(0 0 0 / 100%),rgba(0 0 0 / 0));mask-image:linear-gradient(180deg,rgba(0 0 0 / 100%),rgba(0 0 0 / 0));}
#home_slider_bg .list{width:100%;height:100%;}
#home_slider_bg .bg{position:absolute;inset:0;z-index:1;background-color:var(--background-color);background-image:linear-gradient(135deg,hsl(var(--offset-h1) var(--offset-s1) var(--offset-l1)),hsl(var(--offset-h2) var(--offset-s2) var(--offset-l2)));background-size:cover;transition:opacity 1000ms;}
#home_slider_bg .bg:not(.show){z-index:0;opacity:0;transition-delay:1000ms;}
@media only screen and (max-width:1280px){}
@media only screen and (max-width:1000px){
	#home_cover{--spacing:1.5em;}
	#home_slider .nav{display:none;}
}
@media only screen and (max-width:800px){}
@media only screen and (max-width:480px){
	#home_cover{--spacing:1em;}
	#home_slider{max-width:35em;margin-inline:auto;}
	#home_slider .slide{aspect-ratio:16/9;}
	#home_slider .slide .headline span{font-size:1em;}
}


#home_category{}
#home_category>.inner{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(var(--colunm-size,38em),100%),1fr));gap:var(--spacing) calc(var(--spacing) * 1.5);width:min(var(--MaxContentWidth),100%);margin-inline:auto;padding-inline:var(--spacing);box-sizing:border-box;}
#home_category .group{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(20em,100%),1fr));align-items:start;gap:1em var(--spacing);}
#home_category .title{grid-column:1/-1;display:grid;grid:"icon title more"/auto 1fr auto;align-items:center;gap:1em;padding-block-end:1em;margin-block-end:.75em;box-shadow:var(--body-text-color-a5,rgba(0 0 0/5%)) 0 1px 0;}
#home_category .title::before{grid-area:icon;content:attr(icon);display:block;font-size:2em;}
#home_category .title[icon=""]::before{content:'star_border';}
#home_category .title h3{grid-area:title;font-size:var(--SiteFS-L);font-weight:var(--CPT-FW-EB);text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#home_category .title .more{grid-area:more;--CPT-US:2.5em;--font-weight:var(--CPT-FW);}
#home_category .title .more:not(:hover){--color:var(--body-text-color-a50,rgba(0 0 0/50%));}
#home_category .title .more:hover{--color:var(--SiteTHM);}
#home_category .article{display:grid;grid:"img headline" auto "img time" 1fr/2fr 3fr;align-items:start;gap:.75em 1.5em;color:inherit;transition:color 300ms;}
#home_category .article:hover{color:var(--SiteTHM);}
#home_category .article:hover .img>img{transform:scale(105%);}
#home_category .img{grid-area:img;aspect-ratio:var(--aspect-ratio,3/2);border-radius:.5em;overflow:hidden;background:var(--body-text-color-a5,#fff);box-shadow:var(--body-text-color-a5,rgba(0 0 0 / 5%)) 0 0 0 1px;}
#home_category .img>img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 300ms;}
#home_category .headline{grid-area:headline;}
#home_category .headline>span{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;max-height:3em;text-overflow:ellipsis;overflow:hidden;hyphens:auto;font-weight:var(--CPT-FW-B);font-size:var(--headline-fs,1em);}
#home_category .time{grid-area:time;font-size:var(--SiteFS-S);color:var(--body-text-color-a50,rgba(0 0 0/50%));}
@media only screen and (max-width:1280px){}
@media only screen and (max-width:1000px){
	#home_category{--colunm-size:30em;}
}
@media only screen and (max-width:800px){}
@media only screen and (min-width:481px){
	#home_category .article:first-of-type{grid-row:2/5;grid:"img" "headline" "time";--aspect-ratio:5/3;--headline-fs:var(--SiteFS-L);}
	#home_category .group:nth-child(2n+1) .article:first-of-type{grid-column:1/2;}
	#home_category .group:nth-child(2n) .article:first-of-type{grid-column:-1/-2;}
}
@media only screen and (max-width:480px){}


