/*
Theme Name: neguse
Description: 
Author: aono
Author 
Template: 
Version: 
Text Domain: 
*/




html {
  
  font-size: 1vw;
  lihe-height:1.5;
 
}


body {
 font-family: sans-serif;
 line-height: 1.5; 
  color: #fff;
  
  background: #000;
  padding-top: 182px;
}

a {
  color: inherit;
  text-decoration: none;
  outline: none;
}

a:focus, *:focus {
  outline: none;
}

img {
  border: none;
  vertical-align: top;
  max-width: 100%;
  height: auto;
}

.content a {color:  #3f8279;}
.acd-content a {color:  #3f8279;}

.wrap {width: 95%; margin: 0 auto;}


.sp {display: none;}

ul {margin: 0; padding: 0; margin-top: 20px; }
li {list-style: none; border-bottom: 1px dotted #666; 
 	font-weight: bold; padding-bottom :10px; margin-bottom: 5px; line-height: 2;}

li a {transition: all 0.3s ease;}
li a:hover {padding-left: 2em;}



i {color:  #3f8279; margin-right: 3px;}
button {background: #3f8279; color:#fff; 
border: none;
font-weight: bold;
    padding: 5px; border-radius: 2px; }

button:hover{
    cursor: pointer;

    }


.cbutton {text-align: center;}
.cbutton a { display:inline-block;　 font-weight: bold; background: none; font-size:3vw; border:2px solid #e9bb1f; margin-top:20px;  padding:20px 20px; color: #e9bb1f;}
.cbutton a:hover {  background: #e9bb1f;  color: #fff;}　


.title {font-family: 'Archivo', sans-serif; font-size: 25px; line-height: 0; margin-bottom: 50px;}

.active {background: #57abc3;}

.boxout {
margin-top: 50px;

margin-bottom: 50px;
}

.box {  line-height:2; padding: 50px 10vw;}

.gray {background: #f5f5f5;}

.boxout2 {
margin-top: 50px;
display: flex; justify-content: space-between; align-items:stretch;}

.box2 {position:relative;  width: 48%;}

.btn { font-weight: bold; float: right;}

.cat {background: #3f8279; font-weight: bold; color:#fff; 
	padding:1px 5px;margin-right: 5px;
border-radius: 3px;
font-size:12px;
}

.banner { margin-top:20px; }
.banner img { filter:drop-shadow(5px 5px 5px #4e4e4e); margin-bottom:20px;


}

.kakudai {transition: transform .6s ease; /* ゆっくり変化させる */}

.kakudai:hover  {
  transform: scale(1.05); /* 拡大 */
}


.new {background: #dc143c; color: #fff; padding:0 2px; border-radius: 2px;}


.music {display: flex; gap: 10px; flex-wrap: wrap; justify-content: center;}
.mitem { width :48%; text-align: center; font-weight: bold; }
.caption {margin-top:10px;}
.mitem img {width: 100%; border:1px solid #f6f6f6;}
.music_item {width: 25%; text-align: center;}

.hide {display: none;}

.video {display: flex; gap: 10px; flex-wrap: wrap; justify-content: center;}
.video img {margin-bottom: 10px;}
.videoitem {width:30%; 
text-align: center; font-size: 14px; font-weight: bold;
}




.youtube {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
}
 
.youtube iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}



.acd-check{
    display: none;
}

.acd-label :hover{
    cursor: pointer;

    }
.acd-label{
    cursor: pointer;
    display: block;
    
    position: relative;
}
.acd-label:after{
   color: #3f8279;
    box-sizing: border-box;
    content: '\f067';
    display: block;
    font-family: "Font Awesome 5 Free";
    height: 52px;
   
    position: absolute;
    right: 0;
    top: 0px;
}
.acd-content{
   font-weight: normal;
    display: none;
    height: 0;
    opacity: 0;
    padding: 0 10px;
    transition: .5s;
    


}
.acd-check:checked + .acd-label:after{
    content: '\f068';
}
.acd-check:checked + .acd-label + .acd-content{
    height: auto;
    opacity: 1;
    padding: 10px;
    display: block;
}



.pagetop {
  position: fixed;
  z-index: 101;
}


  .pagetop {
    right: 60px;
    bottom: 30px;

}


.pagetop a {
  display: block;
  
  font-weight: 700;
  color: #fff;
  text-align: center;
}

.pagetop a {
    font-size: 15px;
    line-height: 50px;
    width: 50px;
    background: #3f8279; 
    border-radius: 5px;
}



.header {
    background:  #000;
   position: fixed;
    height: 200px;
   
    z-index: 100;

  left: 0;
  top: 0;
  width: 100%;
}



.header-logo {
  position: absolute;
  left: 50%;
   top: 55px;
    width: 246px;
    margin-left: -123px;
}



.footer {
  margin-top: 100px;
   padding: 0 0 30px;
}


  
.footer__sns {
  font-size: 0;
  line-height: 0;
  text-align: center;
  margin-bottom: 45px;
}

.footer__sns a {
  display: inline-block;
  font-size: 2.0rem;
  line-height: 1.0;
  margin: 0 15px;
}

.footer__copy {
  
  font-weight: 700;
  font-size: 1.2rem;
  line-height: 1.5rem;
  margin-bottom: 10px;
  text-align: center;
}

.footer__note {
  font-size: 1.0rem;
  line-height: 1.5rem;
  text-align: center;
  font-weight: 500;
  opacity: 0.4;
}





.pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 40px 0;
    position: relative;
    font-size: 12px;
}

.pagination span, .pagination a {
    display: block;
    width: auto;
    margin: 4px;
    padding: 8px;
    border: 1px solid #3f8279;
    background-color: #000;
    border-radius: 3px;
    text-decoration: none;
    text-align: center;
    line-height: 12px;
}

/* ページ番号 */
.pagination .pager{
    width: 32px;
}

/* ホバー時 & 現在のページ */
.pagination a:hover,
.pagination .current  {
    color: #fff;
    border-color: #3f8279;
    background-color: #3f8279;
}

/* 前へ */
.pagination a.prev {
    margin-right: 12px;
}
/* 次へ */
.pagination a.next {
    margin-left: 12px;
}
/* 最初へ */
.pagination a.first {}
/* 最後へ */
.pagination a.last {}

/* Page x / y */
.pagination span.page_num {
    display: none;
}


.profout {text-align: center; }
.prof {display :flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 50px;}
.pitem {width: 45%; text-align: left;}



.fadeUpTrigger{
    opacity: 0;
}

.fadeUp {
animation-name:fadeUpAnime;
animation-duration:1s;
animation-fill-mode:forwards;
opacity: 0;
}
@keyframes fadeUpAnime{
  from {
    opacity: 0;
  transform: translateY(100px);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}









@media screen and (max-width:599px) {

html {font-size:3.5vw;}
.wrap {width: 100%;}

.sp {display: block;}


.pc {display: none;}

.mitem {width: 48%; }

.video {display: block;}
.videoitem  {width:100%; } 
 

.pagetop {
    right: 30px;
    bottom: 76px;
  }

.pagetop a {
    font-size: 12px;
    line-height: 40px;
    width: 40px;
   
  }



.header {
  
    height: 170px;
   
   
}


.header-logo {
    top: 50px;
    width: 140px;
    margin-left: -70px;
  }

 .footer {
    padding: 0 0 25px;
  }


.boxout {
margin-top: 50px;
display: block; }

.box {width: 100%; margin-bottom: 50px; padding: 50px 5px;}

.boxout2 {
margin-top: 50px;
display: block; }

.box2 {width: 100%; margin-bottom: 50px;}


.cbutton a { font-size:5vw; }

}