:root{
--section-padding: min(13vw, 100px);
}
.wp-block-group .pagebox{
max-width: 1350px;
}
footer {
margin-top: 0;
border: none;
}
.top-h1-block{
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
.top-h1-block + *{
margin-top: 0;
}
.section-common{
padding-bottom: var(--section-padding) !important;
margin: 0;
}
.section-common:not(.top0){
padding-top: var(--section-padding) !important;
}
.top-fv{
padding: 2em 0;
--child-width:min(70vw, 580px);
min-height: 880px;
display: flex;
align-items: center;
}
.fv-textbox{
position: relative;
z-index: 2;
padding-right:min(5vw, 2em);
padding-left:min(5vw, 2em);
margin-top: 0;
width: 100%;
}
.fv-textwrap{
border-top: 1px solid var(--metal-mid);
border-bottom: 1px solid var(--metal-mid);
background: rgba(0, 0, 0, 0.2);
backdrop-filter: blur(5px);
-webkit-backdrop-filter: blur(5px);
padding: 1.4em;
width: var(--child-width);
margin-left: 0 !important;
}
.fv-textwrap .sub{ color: #eb625a;
position: relative;
padding-left: 2.4rem;
}
.fv-textwrap .sub::before{
content: "";
display: block;
position: absolute;
left: 0;
top: 50%;
transform: translate(0, -50%); background: #eb625a;
width: 1.65rem;
height: 1px;
}
.fv-textwrap .title{
font-size: min(5.2vw, 240%);
font-weight: 600;
line-height: 1.4;
margin-top: .6rem;
color: #fff;
}
.fv-textwrap .title strong{
font-size: 150%;
}
.fv-textwrap .comment{
color: #fff;
font-size: var(--text-lv4);
}
.fv-textwrap .wp-block-buttons{
margin-top: 2.5rem;
}
.fv-textwrap .wp-block-button{
max-width: 270px;
}
.fv-data{
margin-top: 1.2em;
margin-left: 0 !important;
align-items: unset;
width: var(--child-width);
padding-right: 11em;
}
.fv-image,
.fv-image figure,
.fv-image figure img{
width: 100%;
height: 100%;
}
.fv-image{
position: absolute;
left: 0;
top: 0;
margin: 0;
}
.fv-image figure img{
object-fit: cover;
}
.fv-image figure video{
object-fit: cover;
height: 100%;
}
@media (max-width:990px){
.top-fv{
min-height: unset;
flex-direction: column;
padding-top: 0;
--child-width:100%;
}
.fv-image{
position: static;
}
.fv-textwrap{
padding: 0;
background: none;
border: none;
}
.fv-textwrap :is(.title, .comment){
color: #000;
}
.fv-textwrap .title{
font-size: min(6.7vw, 240%);
}
.fv-textwrap .wp-block-buttons{
justify-content: center;
}
.fv-data{
margin-top: 3em;
padding: 0;
}
.insudtries-box :is(.txt1, .txt2, .txt3){
text-align: center;
}
}
.section-challenges{
padding-bottom: var(--section-padding) !important;
background-color: var(--bg-Base);
}
.challenges-block1{
padding-top: var(--section-padding) !important;
background-image: url(//kksanshin.co.jp/wp-content/themes/twentytwentyfive-child/img/ribbon1.svg);
background-repeat: no-repeat;
background-position:  center bottom;
background-size: 100% auto;
padding-bottom: 3em;
margin-bottom: 1em;
}
.challenges-text1{
font-size: var(--heading-lv1);
display: flex;
flex-direction: column;
align-items: center;
}
.challenges-text1 .txt1{
font-size: 40%;
font-family: var(--gothic);
color: var(--text-meta);
}
.challenges-text1 .txt2{
text-align: center;
font-weight: bold;
font-family: var(--mincho);
line-height: 1.4;
margin-top: 1rem;
margin-bottom: 1rem;
}
.challenges-text1 .txt3{
font-size: 55%;
font-weight: 700;
color: var(--text-meta);
}
@media (max-width:1100px){
.challenges-block1{
background-size: 140% auto;
}
}
@media (max-width:700px){
.challenges-block1{
background: none;
}
}
.film-content-section{
background-image: url(//kksanshin.co.jp/wp-content/themes/twentytwentyfive-child/img/ribbon2.svg);
background-repeat: no-repeat;
background-position:  center bottom 14%;
background-size: 100% auto;
}
.film-content-wrap{
gap: 3em min(4vw, 4em);
}
.film-textblock{
width: 28em;
}
.is-layout-constrained .film-table{
width: 100%;
}
.film-table :is(th, td){
padding-right: 15px;
padding-left: 15px;
}
.film-table thead th{
padding-top: 20px;
padding-bottom: 20px;
}
.film-table thead th:first-child{
background: #f4f4f5;
}
.film-table thead th:last-child{
background-color: #e8ebed;
}
.film-table .titlebox{
display: flex;
gap: .4rem .6rem;
flex-wrap: wrap;
color: var(--text-secondary);
line-height: 1.2;
}
.film-table .titlebox p:first-child{
font-family: var(--gothic);
font-weight: 400;
display: flex;
column-gap: .6rem;
align-items: center;
}
.film-table .titlebox p:first-child::after{
content: "";
display: block;
width: .6em;
height: 1px;
background: var(--text-secondary);
}
.film-table tbody td:first-child{
background: #fff;
}
.film-table tbody td:last-child{
background: #EFF3F5;
}
.film-table tbody td p{
position: relative;
padding: .7rem 2rem .7rem 1.7rem;
border-bottom: 1px solid rgba(0,0,0,.09);
font-size: var(--text-lv3);
}
.film-table tbody td:last-child p{
font-weight: 700;
}
.film-table tbody td p::before{
content: "";
position: absolute;
left: .3rem;
top: 1.3em;
display: block;
width: .4em;
height: .4em;
border-radius: 100vw;
background: #333;
}
.film-table tbody td:first-child p::after{
content: "";
opacity: .6;
content: "";
position: absolute;
font-size: 72%;
right: 0;
top: calc(50% - 1.2em / 2);
display: flex;
align-items: center;
width: 1.2em;
height: 1.2em;
background-color: #000;
-webkit-mask: url(//kksanshin.co.jp/wp-content/themes/twentytwentyfive-child/img/arrow-right-solid-full.svg);
mask: url(//kksanshin.co.jp/wp-content/themes/twentytwentyfive-child/img/arrow-right-solid-full.svg);
-webkit-mask-size: contain;
mask-size: contain;
}
.film-table tbody tr:last-child td p{
border-bottom: none;
}
@media (max-width:1200px){
.film-content-section{
background-size: 128% auto;
background-position: center bottom 20%;
}
}
@media (max-width:840px){
.film-content-section{
background-size: 140% auto;
}
}
@media (max-width:680px){
.film-content-section{
background-size: 160% auto;
background-position: center bottom 68vw;
}
}
@media (max-width:500px){
.film-table .titlebox{
flex-direction: column;
}
.film-table td{
padding-right: 8px;
padding-left: 8px;
}
.film-table tbody td p{
padding: .5rem 1rem .5rem 1.2rem;
font-size: 90%;
}
.film-table tbody td p::before{
width: .2em;
height: .2em;
}
.film-table tbody td:first-child p::after{
font-size: 72%;
}
}
.film-imageblock{
flex: 1;
display: flex;
flex-direction: column-reverse;
}
.film-imageblock .block{
width: 50%;
margin-right: 0 !important;
margin-left: 0 !important;
border: 1px solid var(--before-color);
position: relative;
z-index: 3;
}
.film-imageblock .text-wrap{
background: var(--before-color);
padding: .7em;
line-height: 1.2;
}
.film-imageblock .text1{
color: #fff;
border: 1px solid #ddd;
font-family: var(--gothic);
width: 5em;
text-align: center;
font-size: var(--text-lv3);
padding: .15em 0;
}
.film-imageblock .text2{
color: #fff;
flex: 1;
font-weight: 600;
}
.film-imageblock .block:last-child{
width: 80%;
margin-top: 0;
margin-left: auto !important;
margin-bottom: -2em;
border-color: var(--after-border);
z-index: 2;
}
.film-imageblock .block:last-child .text-wrap{
background: var(--text-on-deep);
}
.film-imageblock .block:last-child .text-wrap .text1{
color: var(--text-primary);
border-color: var(--metal-light);
background: var(--metal-light);
}
.film-imageblock .block:last-child .text-wrap .text2{
color: var(--text-primary);
font-size: var(--heading-lv3);
}
.film-imageblock .block .image{
margin: 0;
}
.film-imageblock .block .image img{
object-fit: cover;
width: 100%;
height: 100%;
aspect-ratio: 16/9;
}
@media (max-width:1200px){
.film-content-wrap{
flex-direction: column;
}
.film-textblock{
width: 100%;
}
.film-imageblock{
width: 100%;
max-width: 800px;
margin-right: auto;
margin-left: auto;
}
.film-imageblock .block{
width: 340px;
}
.film-imageblock .block:last-child{
width: 540px;
}
.film-content-wrap .wp-block-button{
text-align: center;
}
}
@media (max-width:680px){
.film-imageblock{
flex-direction: column;
}
.film-imageblock .block{
width: 80%;
min-width: 230px;
}
.film-imageblock .block:last-child{
margin-bottom: 0;
margin-top: 1.5em;
width: 100%;
}
}
.section-peasons,
.section-support{
position: relative;
margin: 0;
}
.section-support{
padding-top: var(--section-padding);
padding-bottom: var(--section-padding);
}
.section-peasons::before,
.section-support::before{
content: "";
display: block;
position: absolute;
left: 0;
bottom: 0;
width: calc(100% - 2em);
background: var(--bg-Base);
}
.section-peasons::before{
height: 50%;
}
.section-support::before{
height: 100%;
}
.section-peasons-inner{
align-items: flex-start;
justify-content: space-between;
position: relative;
z-index: 2;
gap: 3em;
}
.section-peasons-block1{
flex: 1;
}
.section-peasons-block2{
width: 71%;
}
.peasons-list-wrap{
align-items: flex-start;
counter-reset: number 0;
gap: 3em 2em;
width: 71%;
}
.peasons-list-wrap > .wp-block-group{
width: calc((100% - 2em * 2) / 3);
}
.peasons-list-title{
display: block;
width: 100%;
position: relative;
font-weight: 600;
padding-left: 3.2em;
font-family: var(--mincho);
font-size: var(--heading-lv3);
border-bottom: 1px solid var(--text-on-deep);
padding-bottom: 1em;
}
.peasons-list-title::before{
position: absolute;
left: 0;
top: 0;
counter-increment: number 1;
content: counter(number, decimal-leading-zero);
font-family: var(--gothic);
font-size: 245%;
font-weight: 300;
line-height: 1;
}
@media (max-width:1480px){
.section-peasons::before,
.section-support::before{
width: 100%;
}
.section-peasons::before{
height: calc(100% - 13vw);
}
}
@media (max-width:990px){
.section-peasons{
background: var(--bg-Base);
}
.section-peasons::before{
height: 100%;
top: calc(var(--section-padding) * -1);
}
.section-peasons-inner{
flex-direction: column;
}
.section-peasons-block1{
width: 100%;
}
.section-peasons-block1 .wp-block-button{
text-align: center;
}
.peasons-list-wrap{
width: 100%;
}
}
@media (max-width:820px){
.peasons-list-wrap{
flex-direction: column;
}
.peasons-list-wrap > .wp-block-group{
width: 100%;
display: grid;
grid-template-areas:
"image title"
"image comment";
grid-template-columns:170px 1fr;
grid-template-rows:auto 1fr;
column-gap: 1.5em;
}
.peasons-list-image{
grid-area: image;
}
.peasons-list-title{
grid-area: title;
}
.peasons-list-comment{
grid-area: comment;
}
}
@media (max-width:520px){
.peasons-list-wrap > .wp-block-group{
grid-template-areas:
"title title"
"image comment";
row-gap: 1em;
grid-template-columns:30% 1fr;
}
.peasons-list-comment{
margin-top: 0;
}
}
.section-support-inner{
gap: 2rem;
padding: min(5.2vw, 35px);
border: 1px solid var(--text-meta);
}
.section-support-block1{
flex: 1;
}
.section-support-block2{
width: 72.5%;
}
.support-list{
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: .5em;
}
.support-list-block{
border: 2px solid var(--after-border);
background: #fff;
padding: 1rem;
margin: 0;
}
.support-list .icon{
margin:0 auto;
width: 100%;
max-width: 40px;
}
.support-list .tit{
font-family: var(--gothic);
font-weight: 600;
font-size: var(--text-sm);
color: var(--text-secondary);
text-align: center;
line-height: 1.2;
margin: 1em 0;
}
@media (max-width:1200px){
.section-support-inner{
flex-direction: column;
}
.section-support-block1,
.section-support-block2{
width: 100%;
}
}
@media (max-width:880px){
.support-list{
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (max-width:600px){
.support-list{
gap: .5em;
grid-template-columns: repeat(1, minmax(0, 1fr));
}
.support-list-block{
width: 100%;
}
}
.section-insudtries-textbox{
gap: 2em 4em;
}
.section-insudtries-textbox-block1{
gap: 3em;
}
.section-insudtries-textbox-block1 .inner{
border-right: 1px solid var(--text-meta);
padding: 1em 3em 1em 0;
}
.section-insudtries-textbox-block2{
flex: 1;
}
@media (max-width:940px){
.section-insudtries-textbox{
flex-direction: column;
}
.section-insudtries-textbox-block1{
border-left: 1px solid var(--text-meta);
padding-left: 3em;
}
.section-insudtries-textbox-block2 .wp-block-buttons{
width: 100%;
}
.section-insudtries-textbox-block2 .wp-block-button{
text-align: center;
}
}
@media (max-width:530px){
.section-insudtries-textbox-block1{
padding-left: min(7vw, 3em);
gap: min(7vw, 3em);
}
.section-insudtries-textbox-block1 .inner{
padding-right: min(7vw, 3em);
}
}
.section-insudtries-list{
gap: 1em;
flex-wrap: wrap;
align-items: unset; }
.section-insudtries-list a:has(.block){
flex: 1;
text-decoration: none;
}
.section-insudtries-list .block{
flex: 1;
background: #fff;
box-shadow: 0 5px 12px rgba(0,0,0,.13);
gap: 0;
}
.section-insudtries-list a:has(.block) .block{
height: 100%;
}
.section-insudtries-list img{
object-fit: cover;
width: 100%;
height: 100%;
aspect-ratio: 4/3;
}
.section-insudtries-list .textbox{
width: 100%;
padding: .8em 1em;
gap: 0;
}
.section-insudtries-list .textbox p + p{
margin-top: 0;
}
.section-insudtries-list .text2{
font-family: var(--gothic);
color: var(--text-meta);
font-size: var(--text-sm);
}
@media (max-width:990px){
.section-insudtries-list a:has(.block),
.section-insudtries-list .block{
flex: unset;
width: calc((100% - 1em) / 2);
}
.section-insudtries-list a:has(.block) .block{
width: 100%;
}
}
@media (max-width:530px){
.section-insudtries-list a:has(.block),
.section-insudtries-list .block{
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
}
.section-insudtries-list .imagebox{
width: 34%;
}
.section-insudtries-list .textbox{
flex: 1;
width: auto;
}
}
.section-machine{
padding-top: var(--section-padding);
padding-bottom: var(--section-padding);
background-color: var(--bg-Base);
}
.lineup-listwrap{
display: flex;
flex-wrap: wrap;
gap: 3em 2em;
}
.lineup-listwrap .block{
width: calc((100% - 2em * 2) / 3);
margin: 0;
}
.lineup-listwrap img{
object-fit: cover;
width: 100%;
height: 100%;
aspect-ratio: 14/9;
}
.lineup-listwrap .textblock{
margin-top: 1rem;
}
.lineup-listwrap .sub-title{
font-family: var(--gothic);
color: var(--text-meta);
margin-bottom: .5rem;
}
.lineup-listwrap .title{
margin: 0;
border-bottom: 1px solid #ccc;
padding-bottom: 1rem;
font-size: var(--heading-lv4);
font-weight: 600;
}
.lineup-listwrap .wp-block-buttons{
margin-top: 1rem;
}
.lineup-listwrap .wp-block-button .wp-block-button__link{
display: flex;
align-items: center;
column-gap: 1.5em;
background: unset;
color: var(--text-primary);
border: none;
text-align: left;
padding: 0;
font-weight: 500;
}
.lineup-listwrap .wp-block-button .wp-block-button__link::after{
position: static;
}
@media (max-width:820px){
.lineup-listwrap .block{
width: calc((100% - 2em) / 2);
}
}
@media (max-width:440px){
.lineup-listwrap .block{
width: 100%;
}
}
.sample-test-warp{
align-items: flex-start;
column-rule: 1px solid var(--metal-mid);
gap: 3em 3.5em;
border-top: 1px solid var(--metal-mid);
border-bottom: 1px solid var(--metal-mid);
counter-reset: number 0;
padding: 3em 1.5em;
}
.sample-test-warp .block{
margin: 0;
flex: 1;
}
.sample-test-warp .block::before{
counter-increment: number 1;
content: counter(number, decimal-leading-zero);
font-family: var(--gothic);
color: var(--brand-red);
font-weight: 600;
font-size: var(--heading-lv3);
}
.sample-test-warp .title{
font-size: var(--heading-lv3);
font-weight: 600;
}
.sample-test-warp .comment{
margin-top:.6rem;
}
@media (max-width:990px){
.sample-test-warp{
flex-wrap: wrap;
padding: 1.7em;
}
.sample-test-warp .block{
position: relative;
flex: unset;
width: calc((100% - 3.5em) / 2);
padding-right: 1.2em;
padding-left: 1.2em;
}
.sample-test-warp .block::after{
content: "";
display: block;
position: absolute;
left: 0;
top: -1.5em;
background: var(--metal-mid);
height: 1px;
width: 100%;
}
.sample-test-warp .block:last-child{
border-bottom: unset;
margin-bottom: 0;
padding-bottom: 0;
}
.sample-test-warp .block:nth-child(1)::after,
.sample-test-warp .block:nth-child(2)::after{
display: none;
}
}
@media (max-width:670px){
.sample-test-warp{
padding-right: 0;
padding-left: 0;
}
.sample-test-warp .block{
width: 100%;
}
.sample-test-warp .block:nth-child(2)::after{
display: block;
}
}
.sample-test-btn{
align-items: flex-start;
gap: 4em;
}
.sample-test-btn .block{
flex: 1;
}
.sample-test-btn .text1{
color: var(--brand-red);
position: relative;
font-family: var(--gothic);
text-align: center;
}
.sample-test-btn .text2{
text-align: center;
margin-top: .2em;
font-size: var(--text-lv3);
font-weight: 600;
}
@media (max-width:990px){
.sample-test-btn{
flex-direction: column;
}
.sample-test-btn .block{
width: 100%;
}
}
.section-news{
padding-top: var(--section-padding);
padding-bottom: var(--section-padding);
background: #f2f3f5;
}
.news-inner{
justify-content: space-between;
align-items: flex-start;
gap: 2em 5em;
}
.news-inner .newstitle{
width: 24em;
}
.news-inner .newslist{
width: 100%;
}
.news-inner .newslist li{
position: relative;
border-bottom: 1px solid var(--metal-mid);
margin-top: 0;
}
.news-inner .newslist li:first-child{
border-top: 1px solid var(--metal-mid);
}
.news-inner .newslist a{
display: block;
text-decoration: none;
padding: 1.8em 1em;
padding-left:calc(6em + 1em + 1.5em);
transition: background .3s;
}
.news-inner .newslist a:hover{
background: rgba(0,0,0,.03);
}
.news-inner .newslist time{
position: absolute;
left: 1em;
top: 1.8em;
width: 6em;
font-size: 100%;
font-family: var(--gothic);
font-weight: 500;
pointer-events: none;
}
@media (max-width:990px){
.news-inner{
flex-direction: column;
position: relative;
padding-bottom: 110px;
}
.news-inner .newstitle{
width: 100%;
position: unset;
}
.news-inner .newstitle .heading.style1{
margin-bottom: 0;
}
.news-inner .newslist li:first-child{
border-top: 1px solid var(--metal-mid);
}
.news-inner .wp-block-buttons{
position: absolute;
bottom: 0;
left: 0;
width: 100%;
padding-right: min(5.3vw, 25px);
padding-left: min(5.3vw, 25px);
}
.news-inner .wp-block-button{
text-align: center;
}
}
@media (max-width:700px){
.news-inner .newslist a{
padding-left: 1em;
padding-bottom: 1.8rem;
padding-top: calc(1.8rem + 1em + .8rem);
}
.news-inner .newslist .wp-block-post-date{
top: 1.8rem;
}
}
.insudtries-box .txt1{
font-family: var(--gothic);
color: var(--text-meta);
line-height: 1;
}
.insudtries-box .txt2{
color: var(--brand-red);
font-size: min(7vw, 260%);
font-weight: 400;
line-height: 1;
margin-top: 1rem;
}
.insudtries-box .txt3{
font-weight: 600;
line-height: 1.4;
margin-top: 1rem;
}
@media (min-width:1302px){
.maker-list-text{
grid-template-columns: repeat(4, minmax(0, 1fr));
}
}