:root{



  --mainColor:rgba(0, 0, 0, 0);



  --mainFontColor:rgba(254,254,254,.85);



  --mainBorder:1.5px solid var(--mainFontColor);



}

#sns .melody{
  background-image: url(./img/melody.png);
  background-size: cover;
}





#news .btnBox{

  margin-bottom:30px;

  display: flex;

  justify-content: center;

  align-items: center;

}


/*
#news img{

  width: 50px;

  height: 50px;

} */

.picarea{
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}
.picitem{
  display: block;
  margin: 1.5%;
  width: 30%;

}

#picture article a {
  width: 100%;
  margin: 0;
  min-width: 280px;
}
.btn{

  margin: auto;

  border: 2px solid #FFF;

  border-radius: 50px;
  
  width: 20%;
  
  /* text-align: center; */
  
  padding: 10px;
}

#news .btnBox a{

  text-align: center;

  font-size: 24px;

  border: 3px solid #fff;

  border-radius: 30px;

  color:#fff;

  width: 30%;

  padding: 20px;

  margin: 0 8px;

}



#news .btnBox a:hover{

  background-color: cadetblue;

  transition: .5s ease-in-out, left 1s ease-in-out;

}





#mainBg{



	background-image: url(img/bg.jpg);



}



.mainCover{



	background-color:rgba(34,24,20,0.5);



}







#home{



	background: url(img/home.jpg) no-repeat center left;



	background-size: cover;



}



.homeCover{



    background-color:rgba(64,33,15,0.5);



}

.abouText a{

border: 2px solid #FFF;

border-radius: 50px;

width: 20%;

text-align: center;

padding: 10px;

}



@media (max-width:768px) {

  #news .btnBox a{

    width: 50%;

  }

}



@media (max-width:375px) {

  #news .btnBox a{

    width: 100%;

  }

}