/*bace section*/
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}:where([hidden]:not([hidden='until-found'])){display:none!important}:where(html){-webkit-text-size-adjust:none;color-scheme:dark light}@media (prefers-reduced-motion:no-preference){:where(html:focus-within){scroll-behavior:smooth}}:where(body){line-height:1.5;font-family:system-ui,sans-serif;-webkit-font-smoothing:antialiased}:where(input,button,textarea,select){font:inherit;color:inherit}:where(textarea){resize:vertical;resize:block}:where(button,label,select,summary,[role='button'],[role='option']){cursor:pointer}:where(:disabled){cursor:not-allowed}:where(label:has(>input:disabled),label:has(+input:disabled)){cursor:not-allowed}:where(button){border-style:solid}:where(a){color:inherit;text-underline-offset:.2ex}:where(ul,ol){list-style:none}:where(img,svg,video,canvas,audio,iframe,embed,object){display:block}:where(img,picture,svg){max-inline-size:100%;block-size:auto}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(h1,h2,h3){line-height:calc(1em + 0.5rem)}:where(hr){border:none;border-block-start:1px solid;color:inherit;block-size:0;overflow:visible}:where(:focus-visible){outline:3px solid Highlight;outline-offset:2px;scroll-margin-block:10vh}:where(.visually-hidden:not(:focus-within,:active)){clip-path:inset(50%)!important;height:1px!important;width:1px!important;overflow:hidden!important;position:absolute!important;white-space:nowrap!important;border:0!important}

.break-pc{
display: block;
}
.break-sp{
display: none;
}
@media screen and (max-width: 788px) {
.break-pc{
display: none;
}
.break-sp{
display: block;
}
}
table{
border-collapse: collapse;
}
td{
padding: 5px 10px;
border: 1px solid #AAAAAA;
min-width: 110px;
font-size: 14px;
}

body{
font-family: "Noto Sans JP", sans-serif;
font-weight: 400;
line-height: 1.6;
margin: 0;
padding: 0;
font-size: 16px;
}
body::before {
content: "";
z-index: -10;
display: block;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100vh;
background-image: url("../img/img_background.png");
background-size: cover;
background-position: center center;
}
header{
background-color: rgba(0,0,0,0.15);
padding: 100px 0;
}
header p{
max-width:1180px;
margin: 0 auto;
font-size: 120px;
line-height: 1.0;
font-weight: 700;
color: #FFFFFF;
padding: 100px 0;
opacity:0.75;
}

footer{
padding: 50px 0;
background-color: #000000;
color: #FFFFFF;
font-size: 14px;
font-weight: 400;
text-align: center;
}

section{
padding: 100px 0;
color: #000000;
}
section h2{
max-width:1180px;
margin: 0 auto;
font-size: 36px;
font-weight: 100;
text-align: center;
}
section h2 span{
display: block;
font-size: 14px;
font-weight: 600;
padding: 10px 0 0 0;
}
section h2 span::before{
content: "-";
padding: 0 10px 0 0;
}
section h2 span::after{
content: "-";
padding: 0 0 0 10px;
}
#block-laed{
background-color: #FFFFFF;
}
#block-mind{
color: #FFFFFF;
position: relative;
clip-path: inset(0);
}
#block-mind::before {
content: "";
z-index: -50;
display: block;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url("../img/img_background2.png");
background-size: cover;
background-position: center center;
}
#block-works{
background-color: #FFFFFF;
}
#block-company{
background-color: rgba(0,0,0,0.50);
color: #FFFFFF;
}
#block-note{
background-color: #FFFFFF;
padding: 0 0 100px 0;
}
#block-about{
background-color: #FFFFFF;
}

#block-laed h1{
max-width:1180px;
margin: 0 auto;
font-size: 20px;
font-weight: 500;
line-height: 2.0;
text-align: center;
z-index: 100;
}
#block-laed ul{
max-width: 460px;
margin: 0 auto;
padding: 50px 0 0 0;
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
}
#block-laed ul li:nth-child(odd){
border: 1px dashed #000000;
border-radius: 60px;
height: 120px;
width: 120px;
text-align:center;
line-height: 120px;
font-size: 16px;
font-weight: 500;
}
#block-laed ul li:nth-child(even){
height: 120px;
width: 30px;
font-size: 32px;
font-weight: 100;
text-align:center;
line-height: 120px;
}

#block-mind div{
position: absolute;
z-index: -20;
left: 0;
top:0;
width: 50%;
height: 100%;
background-color: rgba(0,0,0,0.50);
}
#block-mind ul{
max-width: 1180px;
margin: 0 auto;
padding: 50px 0 0 0;
display: -webkit-flex;
display: flex;
flex-wrap: wrap;
-webkit-justify-content: space-between;
justify-content: space-between;
}
#block-mind ul li{
max-width: 360px;
padding: 30px; 
background-color: rgba(255,255,255,0.90);
color: #000000;
}
#block-mind ul li h3{
font-size: 20px;
font-weight: 500;
padding: 0 0 10px 0; 
}

#block-works ul{
max-width: 1180px;
margin: 0 auto;
padding: 0 0 0 0;
display: -webkit-flex;
display: flex;
flex-wrap: wrap;
-webkit-justify-content: space-between;
justify-content: space-between;
}
#block-works ul::after {
display: block;
content:"";
width: 360px;
}
#block-works ul li {
display: block;
max-width: 360px;
margin: 50px 0 0 0;
background-color: rgba(255,255,255,0.90);
color: #000000;
text-decoration: none;
pointer-events: none;
}
#block-works ul li img{
width: 100%;
}
#block-works ul li h3{
font-size: 18px;
font-weight: 600;
padding: 10px 0 0 0; 
}
#block-works ul li h3 span{
display: block;
font-size: 14px;
font-weight: 300;
padding: 5px 0 0 0; 
}

#block-company ul{
max-width: 1180px;
margin: 0 auto;
padding: 50px 0 0 0;
display: -webkit-flex;
display: flex;
flex-wrap: wrap;
-webkit-justify-content: space-between;
justify-content: space-between;
}
#block-company ul li{
max-width: 570px;
}
#block-company ul li h3{
font-size: 24px;
font-weight: 400;
padding: 0 0 20px 0; 
}
#block-company ul li p{
font-size: 16px;
padding: 0 0 16px 0;
}

#block-note ul{
max-width: 1180px;
margin: 0 auto;
padding: 0 0 0 0;
display: -webkit-flex;
display: flex;
flex-wrap: wrap;
-webkit-justify-content: space-between;
justify-content: space-between;
}
#block-note ul li {
display: block;
width: 570px;
margin: 0;
color: #000000;
text-decoration: none;
}
#block-note ul li iframe{
border: 0;
width: 570px;
height: 250px;
display: block;
padding: 0px;
margin: 0;
visibility: visible;
}
#block-note ul::after {
display: block;
content:"";
width: 570px;
}

#block-about ul{
max-width: 1180px;
margin: 0 auto;
padding: 50px 0 0 0;
display: -webkit-flex;
display: flex;
flex-wrap: wrap;
-webkit-justify-content: space-between;
justify-content: space-between;
}
#block-about ul li{
max-width: 570px;
}
#block-about ul li h3{
font-size: 24px;
font-weight: 100;
padding: 0 0 20px 0; 
}
#block-about ul li h3 span{
font-weight: 400;
padding: 0 0 0 20px; 
}
#block-about ul li p{
font-size: 16px;
padding: 0 0 16px 0;
}

@media screen and (max-width: 1180px) {
section{
padding: 50px 0;
}
#block-mind ul,#block-works ul,#block-about ul,#block-company ul,#block-note ul{
-webkit-justify-content: center;
justify-content: center;
}
header p{
font-size: 12vw;
margin: 0 20px;
padding: 50px 0;
}
#block-mind ul li{
max-width: 570px;
margin: 0 20px;
}
#block-mind ul li:nth-child(2),#block-company ul li:nth-child(2){
margin: 20px;
}
#block-works ul::after {
display: none;
}
#block-works ul li{
max-width: 570px;
margin: 20px 20px 40px 20px;
}
#block-company ul li:nth-child(1){
margin: 0 20px;
}
#block-about ul li:nth-child(2){
margin: 40px 20px 20px 20px;
}
#block-note ul li {
margin: 0 20px;
}
}

@media screen and (max-width: 590px) {
body::before {
background-size: cover;
width: 100vh;
}
header{
padding: 0 0;
}
#block-laed h1{
font-size: 18px;
line-height: 1.6;
margin: 0 20px;
text-align: left;
}
#block-laed ul{
padding: 25px 20px 0 20px;
}
#block-laed ul li:nth-child(odd){
border: 1px dashed #000000;
border-radius: 60px;
height: 90px;
width: 90px;
text-align:center;
line-height: 90px;
font-size: 16px;
font-weight: 500;
}
#block-laed ul li:nth-child(even){
height: 90px;
width: 30px;
font-size: 24px;
font-weight: 100;
text-align:center;
line-height: 90px;
}
#block-about ul li h3 span{
display: block;
padding: 0 0 0 0; 
}
#block-note ul li iframe{
width: 100%;
}
}