
.navbar {
  width: 100%;
  height : 110px;
  background-color: #BDBDBD;
  overflow: auto;
 display: flex;
 align-items: center;
 justify-content: center;
}



.navbar a {
  float: left;
  padding: 12px;
  color: #424242;
  text-decoration: none;
  font-size: 17px;
  font-weight: bolder;
}

.navbar a:hover {
  color: #0174DF;
}

.footer {
  width: 100%;
  background-color: #EAEAEA;
  overflow: auto;
 display: flex;
  color: #424242;
 align-items: center;
 justify-content: center;
}


.bigbox {  
width:933px;          
margin:0px auto 0px auto;    
text-align:left;
}

.name {
  width:933px;      
  overflow: auto;
 display: flex;
  color: #424242;
 align-items: center;
 justify-content: left;
}

.contain {
  width: 100%;
  overflow: auto;
 display: flex;
 align-items: center;
 justify-content: center;
  color: #424242;
}

.container {
  display: inline-block; padding: 10px; text-align: center;
  color: #424242;
}

.logoBic {
  width: 100%;
  overflow: auto;
 display: flex;
 align-items: center;
 justify-content: center;
}

.contact {
  width: 100%;
  overflow: auto;
 display: flex;
 align-items: center;
 justify-content: center;
 text-align : left; 
color: #424242;
}

.artist{  
  width: 100%;
margin:0px auto 0px auto;    
text-align:left;
  color: #424242;
}

.table {
  width: 100%;
  overflow: auto;
 display: flex;
 align-items: left;
 justify-content: left;
}

.page {
  width: 100%;
  overflow: auto;
 display: flex;
 align-items: center;
 justify-content: center;
}
#page1 {background-color: #EAEAEA;}

.page a {
  float: left;
  padding: 10px;
  text-decoration: none;
  color: #5D5D5D;
  font-size: 15px;
  font-weight: bolder;
}

.page a:hover {
  color: #151515;
}


* {margin:0;padding:0;box-sizing:border-box;}
ul, li {list-style:none;}


.slidebox {max-width:900px;margin:0 auto;}
.slidebox .slidelist {white-space:nowrap;font-size:0;overflow:hidden;}
.slidebox .slidelist .slideitem {position:relative;display:inline-block;vertical-align:middle;width:100%;transition:all 1s;}
.slidebox .slidelist .slideitem > a {display:block;width:auto;position:relative;}
.slidebox .slidelist .slideitem > a img {max-width:100%;}
.slidebox .slidelist .slideitem > a label {position:absolute;top:50%;transform:translateY(-50%);padding:20px;border-radius:50%;cursor:pointer;}
.slidebox .slidelist .slideitem > a label.prev {left:30px; background:url('./image/left.png') center center / 100% no-repeat;}
.slidebox .slidelist .slideitem > a label.next {right:30px; background:url('./image/right.png') center center / 100% no-repeat;}


[name="slide"] {display:none;}
#slide01:checked ~ .slidelist .slideitem {transform:translateX(0);animation:slide01 15s infinite;}
#slide02:checked ~ .slidelist .slideitem {transform:translateX(-100%);animation:slide02 15s infinite;}
#slide03:checked ~ .slidelist .slideitem {transform:translateX(-200%);animation:slide03 15s infinite;}
#slide04:checked ~ .slidelist .slideitem {transform:translateX(-300%);animation:slide03 15s infinite;}


@keyframes slide01 {
	0% {left:0%;}
	33% {left:0%;}
	34% {left:-100%}
	66% {left:-100%;}
	67% {left:-200%;}
	99% {left:-200%;}
	100% {left:0%;}
}

@keyframes slide02 {
	0% {left:0%;}
	33% {left:0%;}
	34% {left:-100%;}
	66% {left:-100%;}
	67% {left:100%;}
	99% {left:100%;}
	100% {left:0%;}
}

@keyframes slide03 {
	0% {left:0%;}
	33% {left:0%;}
	34% {left:200%;}
	66% {left:200%;}
	67% {left:100%;}
	99% {left:100%;}
	100% {left:0%;}
}

@keyframes slide04 {
	0% {left:0%;}
	33% {left:0%;}
	34% {left:200%;}
	66% {left:200%;}
	67% {left:100%;}
	99% {left:100%;}
	100% {left:0%;}
}


.slide-pagelist {text-align:center;padding:20px;}
.slide-pagelist > li {display:inline-block;vertical-align:middle;}
.slide-pagelist > li > label {display:block;padding:8px 10px;border-radius:10px;background:#ccc;margin:10px 10px;cursor:pointer;}
.section input[id="slide01"]:checked ~ .slidewrap .slide-pagelist > li:nth-child(1) > label {background:#999;}
.section input[id="slide02"]:checked ~ .slidewrap .slide-pagelist > li:nth-child(2) > label {background:#999;}
.section input[id="slide03"]:checked ~ .slidewrap .slide-pagelist > li:nth-child(3) > label {background:#999;}
.section input[id="slide04"]:checked ~ .slidewrap .slide-pagelist > li:nth-child(4) > label {background:#999;}



