td{background:#fff;}


/*filter-menu*/
ul.filter-menu{list-style:none; max-width:calc(1350px + 2em); margin:0 auto 3em auto; padding:0; display:flex; justify-content:center; align-items:center; border-top:1px solid #ccc; border-bottom:1px solid #ddd;}
ul.filter-menu li{width:25%; margin:0; padding:0;}
ul.filter-menu li+li{border-left:1px solid #ccc;}
ul.filter-menu div{display:block; padding:0; text-align:center; line-height:1.4; font-weight:500; font-size:clamp(1.2rem, 2vw, 1.3rem); color:#111; background:rgba(255,255,255,.5);}
ul.filter-menu div span{display:inline-flex; justify-content:center; align-items:center; height:5.5em;}
body.otsu ul.filter-menu{display:none;}
@media (max-width: 768px) {
ul.filter-menu{flex-wrap:wrap;}
ul.filter-menu li{width:50%; letter-spacing:0; display:block; margin:0;}
/*ul.filter-menu li:first-child{width:100%;}*/
ul.filter-menu li:nth-child(1), ul.filter-menu li:nth-child(2){border-bottom:1px solid #ccc;}
ul.filter-menu li:nth-child(3){border-left:0;}
ul.filter-menu div span{height:4em;}
}
@media (any-hover: hover) {
ul.filter-menu div{transition:.3s; cursor:pointer;}
ul.filter-menu div:hover{background:#edeeee;}
}


/*Interviews*/
ul.skylist + div.more{display:none !important;}
body#index.sky {background-image:url(img/bg.jpg); background-size:90%; background-position:right top 80px; background-repeat:no-repeat;}
body#index.sky section.interview .logo{width:40%; height:auto; max-width:350px; display:block; position:absolute; right:80px; top:120px; filter: brightness(0) invert(1);}
ul.skylist{list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:1%;}
ul.skylist li{width:calc(97%/4); margin:0 0 2.5em 0;}
ul.skylist a{color:inherit;}
ul.skylist .item{position:relative;}
ul.skylist .item > span{position:absolute; left:1em; top:1em; z-index:+1; line-height:1; font-size:clamp(1rem, 1.8vw, 1.2rem); font-weight:500; padding:.5em .8em .7em .8em; background:#db4248; color:#fff;}
ul.skylist li.new .item:before{content:"NEW"; position:absolute; right:1em; top:1em; z-index:+1; line-height:1; display:inline-block; font-size:clamp(1rem, 1.8vw, 1.2rem); font-weight:500; padding:.5em .8em .7em .8em; background:#c6ff2e;}
ul.skylist .item .img{background:#f8f8f8; overflow:hidden; aspect-ratio:3 / 2; margin-bottom:1.3em; width:100%; cursor:pointer;}
ul.skylist .item .img img{width: 100%; transition-duration: 0.5s;}
ul.skylist .item .date {font-size:11px; letter-spacing:0; line-height:1; color:#999;}
ul.skylist .item .date span{display:inline-block; border-left:1px solid rgba(100,100,100,.2); padding-left:1em; margin-left:1em;}
ul.skylist .item .text h3{font-size:clamp(1.2rem, 1.8vw, 1.4rem); letter-spacing:0.5px; line-height:1.6; margin:1em 0 0 0; font-weight:600;}
@media (max-width: 1000px) {
ul.skylist{gap:2%;}
ul.skylist li{width:calc(96%/3);}
}
@media (max-width: 800px) {
body#index.sky {background-size:140%; background-position:right top;}
body#index.sky section.interview .logo{width:70%; max-width:250px; margin:0 auto 2em auto; position:inherit; filter:inherit;}
ul.skylist{gap:3%;}
ul.skylist li{width:calc(97%/2);}
}
@media (max-width: 600px) {
section.interview .inner{padding-top:1em;}
ul.skylist .item > span{left:0; top:0;}
ul.skylist li.new .item:before{right:0; top:0;}
}
@media (any-hover: hover) {
ul.skylist a:hover .item .img img{transform: scale(1.05);　transition-duration: 0.5s;}
}

/*pagination*/
body.home .pagination{display:none;}
.pagination{text-align:center;}
.pagination a{padding:.2em .6em .3em .6em; text-decoration: none; color:#444;}
.pagination a.page-link{border:1px solid #444;}
.pagination a.active{background:#444; color:#fff;}
@media (any-hover: hover) {
.pagination a:hover{background:#444; color:#fff;}
}





/*page*/
body.sky.page section > .inner{max-width:calc(900px + 2em); padding:0 1em;}
section.title{background:#f8f8f6; padding:3em 1em; margin-bottom:4em;}
section.title img{display:none; margin:0 auto; width:40%; max-width:200px; height:auto;}
h1{line-height:1.5; margin:0; font-size:clamp(2.2rem, 3vw, 2.8rem); letter-spacing:.1em;}
h1 small{display:block; font-size:clamp(1.4rem, 1.6vw, 1.6rem); font-style:italic; margin:.5em 0;}
h1 small:first-child{margin-top:0;}
h1 small strong{font-size:150%;}
h1:has(+p){margin-bottom:1em;}
h1:has(+p):after{content:""; display:block; width:2em; height:1px; background:#333; margin:1em 0;}
section.title p{color:#777; font-weight:500; line-height:1.5;}
@media (max-width: 600px) {
section.title p{font-size:95%;}
}



section.contents > .inner{padding:0 1em 5em 1em !important;}
/*section.contents h2{font-style:normal; font-size:clamp(2.5rem, 3vw, 3.2rem); line-height:1.5; margin:2em 0;}*/
section.contents h2{font-size:clamp(1.9rem, 2.5vw, 2.2rem); letter-spacing:.1em; border-bottom:1px solid; padding:0 0 1em 0; margin:3em 0 1em 0; font-style:normal;}
section.contents h2 small{color:inherit; font-size:clamp(1.5rem, 2.5vw, 1.9rem); font-weight:600; display:block; margin:.5em 0 0 0;}
section.contents h3{font-size:clamp(1.5rem, 2vw, 1.7rem); line-height:1.5; margin:2em 0 1.5em 0;}

section.contents h3.sub{font-size:clamp(1.8rem, 2vw, 2.4rem); line-height:1.3;}
section.contents h3.sub small{font-weight:500; font-size:70%; display:block; margin:.5em 0 0 0;} 

section.contents img{margin:0 auto; display:block;}
section.contents p+img{margin:3em auto 0 auto;}
section.contents img+p.cap{margin:.5em 0 3em 0; font-size:90%; text-align:center; line-height:1.3;}

section.contents label.catch{font-weight:bold; border:2px solid; display:table; margin:3em auto; padding:.3em 1em; font-size:clamp(1.5rem,2vw, 2rem); line-height:1.4;}

hr{border:0; display:block; width:3em; height:1px; background:#333; margin:4em auto;}

p.fuki{color:#666; font-style:italic; margin:2em 0;}
p:has(i){}
p > i{color:#666; font-weight:normal; display:block;}

div.fuki{padding:1.5em; background:#f5f5f5; line-height:1.3; margin:1em 0;}
div.fuki p{margin:0; color:#555;}
div.fuki p+p{margin-top:1em; border-top:1px solid #ccc; padding-top:1em;}




section.profile{margin-bottom:5em;}
section.profile:before{content:""; display:block; width:3em; height:1px; background:#333; margin:0 auto 5em auto;}
section.profile .inner{display:flex; gap:5%; margin:1.5em auto;}
section.profile .img{width:150px; text-align:center;}
section.profile .text{width:calc(100% - 150px);}
section.profile .text h3{margin:0 0 .7em 0; line-height:1;}
.profile .post{font-size:1.2rem; color:#666; line-height:1.2;}
.profile .career{margin:1em 0; line-height:1.4; font-size:95%;}
.profile .web {line-height:2.4;}
.profile .web a{border:1px solid; border-radius:1.5em; padding:.5em 1.5em; display:inline-block; font-size:90%; line-height:1;}
@media (max-width: 600px) {
section.profile .inner{display:block; margin:5em auto;}
section.profile .img{width:100%;}
section.profile .text{width:100%;}
section.profile .text h3, .profile .post, .profile .web{text-align:center;}
}
a.sns{border:1px solid; border-radius:1.5em; padding:.5em 1.5em; display:inline-block; font-size:90%; line-height:1;}




.fix_comment{background:#f8f8f6;}
.fix_comment .inner{max-width:calc(900px + 2em); padding:3em 1em !important;}
.fix_comment .inner p{font-weight:500;}

.btnarea{margin-top:3em;}





/*movbox*/
.movbox{max-width:480px; margin:2em auto;}
.movbox a{position:relative;display:flex; justify-content:center; align-items: center; border-bottom:0 !important; padding:0; margin:0;}
.movbox a span{ position:absolute;}
.movbox a span:before{content:url(../img/arw_mov.png);opacity:1;}