.accordion {
	min-width: 300px;
	margin: 0 auto;
	padding: 10px;
}
.accordion .ac-content {
	margin: 0 10px;
}
.accordion input {
	display: none;
}
.accordion label {
	display: block;
	background: #9fb7d4;
	cursor: pointer;
	padding: 10px;
	border-bottom: 1px solid #fff;
}
.accordion label:hover {
	background: #ccc;
}
.accordion .ac-cont {
	transition: 0.2s;
	height: 0;
	overflow: hidden;
	background: none;
	padding: 0 10px;
}
.accordion input:checked + .ac-cont {
	height: auto;
	padding: 10px;
}

.button03{
     display:block;
     width: 250px;
     height:70px;
     line-height: 70px;
     color: #FFF;
     text-decoration: none;
     text-align: center;
     background-color: #f39800;
     border-bottom: solid 6px #ec6c00;
     border-radius: 10px;
}
.button03:hover{
     background-color: #f9c500;
     border-bottom: solid 6px #f39800;
}
.button03:active {
     margin-top: 6px;
     border-bottom: none;
     -webkit-transform: translateY(6px);
}

.button04{
     display:block;
     width: 250px;
     height:70px;
     line-height: 70px;
     color: #FFF;
     text-decoration: none;
     text-align: center;
     background-color: #52c49b;
     border-bottom: solid 6px #00cc8f;
     border-radius: 10px;
}
.button04:hover{
     background-color: #8bf0a3;
     border-bottom: solid 6px #52c49b;
}
.button04:active {
     margin-top: 6px;
     border-bottom: none;
     -webkit-transform: translateY(6px);
}

.btn-mode{
     display:block;
     width: 250px;
     height:70px;
     line-height: 70px;
     color: #FFF;
     text-decoration: none;
     text-align: center;
     background-color: #ffc993;
     border-bottom: solid 6px #ec6c00;
     border-radius: 10px;
}
.btn-mode:hover{
     background-color: ;
     border-bottom: solid 6px #f39800;
}
.btn-mode:active {
     margin-top: 6px;
     border-bottom: none;
     -webkit-transform: translateY(6px);
}

.btn-red {
    display: inline-block;
    text-decoration: none;
    background: #ff8e8e;
    color: #FFF;
    width: 120px;
    height: 120px;
    line-height: 120px;
    border-radius: 50%;
    text-align: center;
    font-weight: bold;
    vertical-align: middle;
    overflow: hidden;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.29);
    border-bottom: solid 3px #bd6565;
    transition: .4s;
}

.btn-red:active {
    transform: translateY(2px);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0.15);
    border-bottom: none;
}

.btn-blue {
    display: inline-block;
    text-decoration: none;
    background: #93c9ff;
    color: #FFF;
    width: 120px;
    height: 120px;
    line-height: 120px;
    border-radius: 50%;
    text-align: center;
    font-weight: bold;
    vertical-align: middle;
    overflow: hidden;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.29);
    border-bottom: solid 3px #7f7fff;
    transition: .4s;
}

.btn-blue:active {
    transform: translateY(2px);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0.15);
    border-bottom: none;
}

.arrow_box {
    position: relative;
    background: #d5d197;
    border: 4px solid #f5b56c;
}
.arrow_box:after, .arrow_box:before {
    right: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.arrow_box:after {
    border-color: rgba(213, 209, 151, 0);
    border-right-color: #d5d197;
    border-width: 30px;
    margin-top: -30px;
}
.arrow_box:before {
    border-color: rgba(245, 181, 108, 0);
    border-right-color: #f5b56c;
    border-width: 36px;
    margin-top: -36px;
}



.top-bottun{

    display: block;
    border: solid 5px #3dce8f;
    background-color:#ffffff;
    max-width:200px; 
    min-width:10px; 
    max-height:100px;
    min-height:10px;x
    border-radius: 100px 100px 100px 100px;
    text-decoration: none;
    text-align: center;
    line-height: 100px;
    vertical-align:middle;
    color: #3dce8f;
    font-size:50px
}

.top-bottun:hover{
     background-color: #3dce8f;
     border: none;
     color: #ffffff;
}

.top-bottun:active{

    border: solid 0px #3dce8f;

}

.about-bottun{

    display: block;
    border: solid 5px #17b5ea;
    background-color:#ffffff;
    max-width:200px; 
    min-width:10px; 
    max-height:100px;
    min-height:10px;
    border-radius: 100px 100px 100px 100px;
    text-decoration: none;
    text-align: center;
    line-height: 100px;
    vertical-align:middle;
    color: #17b5ea;
    font-size:40px
}

.about-bottun:hover{
     background-color: #17b5ea;
     border: none;
     color: #ffffff;
}

.about-bottun:active{

    border: none;

}

.day-bottun{

    display: block;
    border: solid 5px #ffef1c;
    background-color:#ffffff;
    max-width:200px; 
    min-width:10px; 
    max-height:100px;
    min-height:10px;
    border-radius: 100px 100px 100px 100px;
    text-decoration: none;
    text-align: center;
    line-height: 100px;
    vertical-align:middle;
    color: #ffef1c;
    font-size:30px
}

.day-bottun:hover{
     background-color: #ffef1c;
     border: none;
     color: #ffffff;
}

.day-bottun:active{

    border: none;

}

.schedule-bottun{

    display: block;
    border: solid 5px #f791d3;
    background-color:#ffffff;
    max-width:200px; 
    min-width:10px; 
    max-height:100px;
    min-height:10px;
    border-radius: 100px 100px 100px 100px;
    text-decoration: none;
    text-align: center;
    line-height: 100px;
    vertical-align:middle;
    color: #f791d3;
    font-size:40px
}

.schedule-bottun:hover{
     background-color: #f791d3;
     border: none;
     color: #ffffff;
}

.schedule-bottun:active{

    border: none;

}

.prepare-bottun{

    display: block;
    border: solid 5px #f4b789;
    background-color:#ffffff;
    max-width:200px; 
    min-width:10px; 
    max-height:100px;
    min-height:10px;
    border-radius: 100px 100px 100px 100px;
    text-decoration: none;
    text-align: center;
    line-height: 100px;
    vertical-align:middle;
    color: #f4b789;
    font-size:40px
}

.prepare-bottun:hover{
     background-color: #f4b789;
     border: none;
     color: #ffffff;
}

.prepare-bottun:active{

    border: none;

}

.information-bottun{

    display: block;
    border: solid 5px #ff5454;
    background-color:#ffffff;
    max-width:200px; 
    min-width:10px; 
    max-height:100px;
    min-height:10px;
    border-radius: 100px 100px 100px 100px;
    text-decoration: none;
    text-align: center;
    line-height: 100px;
    vertical-align:middle;
    color: #ff5454;
    font-size:40px
}

.information-bottun:hover{
     background-color: #ff5454;
     border: none;
     color: #ffffff;
}

.information-bottun:active{

    border: none;

}

.specialthanks-bottun{

    display: block;
    border: solid 5px #e7a0ff;
    
    background-color:#ffffff;
    max-width:200px; 
    min-width:10px; 
    max-height:100px;
    min-height:10px;
    border-radius: 100px 100px 100px 100px;
    text-decoration: none;
    text-align: center;
    line-height: 100px;
    vertical-align:middle;
    color: #e7a0ff;
    font-size:20px
}

.specialthanks-bottun:hover{
     background-color: #e7a0ff;
     border: none;
     color: #ffffff;
}

.specialthanks-bottun:active{

    border: none;

}

.name-display:after{

    content: attr(img-name);
    bottom:30px;

}



.schedule-button {
  display: inline-block;
  width: 150px;
  height: 150px;
  line-height: 150px;
  background: -webkit-linear-gradient(#fe5f95 , #ff3f7f);
  background: linear-gradient(#fe5f95 , #ff3f7f);
  border: 1px solid #fe3276;
  border-radius: 50%;
  color: #fff;
  text-decoration: none;
  text-align: center;
}
.schedule-button:hover {
  -webkit-animation: scale .3s ease-in-out;
  animation: scale .3s ease-in-out;
}
@-webkit-keyframes scale {
  50% { -webkit-transform: scale(1.1); }
}
@keyframes scale {
  50% { transform: scale(1.1); }
}

.about-button {
  display: inline-block;
  width: 150px;
  height: 150px;
  line-height: 150px;
  background: -webkit-linear-gradient(#539ddb , #539ddb);
  background: linear-gradient(#539ddb , #539ddb);
  border: 1px solid #539ddb;
  border-radius: 50%;
  color: #fff;
  text-decoration: none;
  text-align: center;
}
.about-button:hover {
  -webkit-animation: scale .3s ease-in-out;
  animation: scale .3s ease-in-out;
}
@-webkit-keyframes scale {
  50% { -webkit-transform: scale(1.1); }
}
@keyframes scale {
  50% { transform: scale(1.1); }
}

.day-button {
  display: inline-block;
  width: 150px;
  height: 150px;
  line-height: 150px;
  background: -webkit-linear-gradient(#fee95f , #e8d34a);
  background: linear-gradient(#fee95f , #e8d34a);
  border: 1px solid #fee95f;
  border-radius: 50%;
  color: #fff;
  text-decoration: none;
  text-align: center;
}
.day-button:hover {
  -webkit-animation: scale .3s ease-in-out;
  animation: scale .3s ease-in-out;
}
@-webkit-keyframes scale {
  50% { -webkit-transform: scale(1.1); }
}
@keyframes scale {
  50% { transform: scale(1.1); }
}

.prepare-button {
  display: inline-block;
  width: 150px;
  height: 150px;
  line-height: 150px;
  background: -webkit-linear-gradient(#ffb95c, #e8a44a);
  background: linear-gradient(#ffb95c , #e8a44a);
  border: 1px solid #ffb95c;
  border-radius: 50%;
  color: #fff;
  text-decoration: none;
  text-align: center;
}
.prepare-button:hover {
  -webkit-animation: scale .3s ease-in-out;
  animation: scale .3s ease-in-out;
}
@-webkit-keyframes scale {
  50% { -webkit-transform: scale(1.1); }
}
@keyframes scale {
  50% { transform: scale(1.1); }
}

.information-button {
  display: inline-block;
  width: 150px;
  height: 150px;
  line-height: 150px;
  background: -webkit-linear-gradient(#ff6c5c, #e85a4a);
  background: linear-gradient(#ff6c5c , #e85a4a);
  border: 1px solid #ff6c5c;
  border-radius: 50%;
  color: #fff;
  text-decoration: none;
  text-align: center;
}
.information-button:hover {
  -webkit-animation: scale .3s ease-in-out;
  animation: scale .3s ease-in-out;
}
@-webkit-keyframes scale {
  50% { -webkit-transform: scale(1.1); }
}
@keyframes scale {
  50% { transform: scale(1.1); }
}

.specialthanks-button {
  display: inline-block;
  width: 150px;
  height: 150px;
  line-height: 150px;
  background: -webkit-linear-gradient(#ff6c5c, #e27eed);
  background: linear-gradient(#ff6c5c , #e27eed);
  border: 1px solid #ff6c5c;
  border-radius: 50%;
  color: #fff;
  text-decoration: none;
  text-align: center;
}

.specialthanks-button:before{

content:"スペシャルサンクス";
}

.specialthanks-button:after{

content:url("specialthanks.html");
}

.specialthanks-button:hover {
  -webkit-animation: scale .3s ease-in-out;
  animation: scale .3s ease-in-out;
}
@-webkit-keyframes scale {
  50% { -webkit-transform: scale(1.1); }
}
@keyframes scale {
  50% { transform: scale(1.1); }
}