/*リセットCSS*/
*,*::before,*::after{box-sizing:border-box}
html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}
body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}
ul[role='list'],ol[role='list']{list-style:none}
body{min-height:100vh;line-height:1.5}h1,h2,h3,h4,button,input,
label{line-height:1.1}h1,h2,h3,h4{text-wrap:balance}
a:not([class]){text-decoration-skip-ink:auto;color:currentColor}
img,picture{max-width:100%;display:block}input,button,textarea,select{font:inherit}
textarea:not([rows]){min-height:10em}:target{scroll-margin-block:5ex}

/*hero*/
.hero{
    height:100dvh;
  }
  
  .main-art{
    height: 100dvh;
    background-image:url(img/hero.jpg);
    background-size: cover;
    background-position: center;
  
  }

/*container*/
.container{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.text{
  display: flex;
  flex-direction: column;
  text-align: center;
  text-indent: 1rem;
  max-width: 35em;
}

/*btn*/
.btn{
  background-color: #c8ac52;
  color: #eeefd3;
  border-radius: 40px;
  padding: 10px;
}

/*各ファイル*/
.file{
  font-size: large;
  font-weight: 400;
}

/*noteのCSS*/
.noteimg{
  display: flex;
  justify-content: center;
  align-items: center;
}

.noteimg img{
  width: 200px;
  height: auto;
}

.noteimg-m img{
  width: 400px;
  height: auto;
}

.setsumei{
  display: grid;
  grid-template-columns: repeat(1,1fr);
  gap: 20px;
  align-items: center;
  text-align: center
}

.cap{
  max-width: 21em;
  display: flex;
  text-align: left;
  justify-content: center;

}

@media(min-width:768px){
  .setsumei{
    display: grid;
    grid-template-columns: repeat(2,1fr);
  
  }
  
}