@charset "utf-8";
/* ▼▼▼ メタルボタンここから ▼▼▼ */

/* button --------------------------*/
.dl_button a { 
text-decoration: none;
display: block;
color: #000;
font-weight: bold;
}
/* metal ------------------------- */
.metal {
margin: 10px auto;
text-align: center;
color: hsla(0,0%,20%,1);
text-shadow: hsla(0,0%,40%,.5) 0 -1px 0, hsla(0,0%,100%,.6) 0 2px 1px;
background-color: hsl(0,0%,90%);
-webkit-box-shadow: inset hsla(0,0%,15%, 1) 0 0px 0px 4px, /* border */
inset hsla(0,0%,15%, .8) 0 -1px 5px 4px, /* soft SD */
inset hsla(0,0%,0%, .25) 0 -1px 0px 7px, /* bottom SD */
inset hsla(0,0%,100%,.7) 0 2px 1px 7px, /* top HL */
hsla(0,0%, 0%,.15) 0 5px 6px 4px, /* outer SD */
hsla(0,0%,100%,.5) 0 5px 6px 4px; /* outer HL */
-webkit-transition: color .2s;
-moz-box-shadow:
inset hsla(0,0%,15%, 1) 0 0px 0px 4px, /* border */
inset hsla(0,0%,15%, .8) 0 -1px 5px 4px, /* soft SD */
inset hsla(0,0%,0%, .25) 0 -1px 0px 7px, /* bottom SD */
inset hsla(0,0%,100%,.7) 0 2px 1px 7px, /* top HL */
hsla(0,0%, 0%,.15) 0 -5px 6px 4px, /* outer SD */
hsla(0,0%,100%,.5) 0 5px 6px 4px; /* outer HL */
-moz-transition: color .2s;
}
/* Linear ------------------------- */
.metal.linear {
width: 100px;
line-height: 1.5;
border-radius: 10px 50px 10px 50px;
background-image: -webkit-repeating-linear-gradient(left, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0) 6%, hsla(0,0%,100%, .1) 7.5%),
-webkit-repeating-linear-gradient(left, hsla(0,0%, 0%,0) 0%, hsla(0,0%, 0%,0) 4%, hsla(0,0%, 0%,.03) 4.5%),
-webkit-repeating-linear-gradient(left, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0) 1.2%, hsla(0,0%,100%,.15) 2.2%),
-webkit-linear-gradient(-90deg, hsl(0,0%,78%) 0%,
hsl(0,0%,90%) 47%,
hsl(0,0%,78%) 53%,
hsl(0,0%,70%)100%);/* ステンレスの質感 */

background-image:
-moz-repeating-linear-gradient(left, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0) 6%, hsla(0,0%,100%, .1) 7.5%),
-moz-repeating-linear-gradient(left, hsla(0,0%, 0%,0) 0%, hsla(0,0%, 0%,0) 4%, hsla(0,0%, 0%,.03) 4.5%),
-moz-repeating-linear-gradient(left, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0) 1.2%, hsla(0,0%,100%,.15) 2.2%),
-moz-linear-gradient(-90deg, hsl(0,0%,78%) 0%,
hsl(0,0%,90%) 47%,
hsl(0,0%,78%) 53%,
hsl(0,0%,70%)100%);/* ステンレスの質感 */
font-size: 100%;
padding:7% 7% 7% 7%;
height: 30px;
}
/* Radial -------------------------
.radial.metal {
width: 160px;
line-height: 1.5;
border-radius: 80px;
background-image:
-webkit-radial-gradient( 50% 0%, 8% 50%, hsla(0,0%,100%,.3) 0%, hsla(0,0%,100%,0) 100%),
-webkit-radial-gradient( 50% 100%, 12% 50%, hsla(0,0%,100%,.4) 0%, hsla(0,0%,100%,0) 100%),
-webkit-radial-gradient( 0% 50%, 50% 7%, hsla(0,0%,100%,.3) 0%, hsla(0,0%,100%,0) 100%),
-webkit-radial-gradient( 100% 50%, 50% 5%, hsla(0,0%,100%,.3) 0%, hsla(0,0%,100%,0) 100%),
-webkit-repeating-radial-gradient( 50% 50%, 100% 100%, hsla(0,0%, 0%,0) 0%, hsla(0,0%, 0%,0) 3%, hsla(0,0%, 0%,.1) 3.5%),
-webkit-repeating-radial-gradient( 50% 50%, 100% 100%, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0) 6%, hsla(0,0%,100%,.1) 7.5%),
-webkit-repeating-radial-gradient( 50% 50%, 100% 100%, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0) 1.2%, hsla(0,0%,100%,.2) 2.2%),
-webkit-radial-gradient( 50% 50%, 200% 50%, hsla(0,0%,90%,1) 5%, hsla(0,0%,85%,1) 30%, hsla(0,0%,60%,1) 100%);

background-image:
-moz-radial-gradient( 50% 0%, 8% 50%, hsla(0,0%,100%,.3) 0%, hsla(0,0%,100%,0) 100%),
-moz-radial-gradient( 50% 100%, 12% 50%, hsla(0,0%,100%,.4) 0%, hsla(0,0%,100%,0) 100%),
-moz-radial-gradient( 0% 50%, 50% 7%, hsla(0,0%,100%,.3) 0%, hsla(0,0%,100%,0) 100%),
-moz-radial-gradient( 100% 50%, 50% 5%, hsla(0,0%,100%,.3) 0%, hsla(0,0%,100%,0) 100%),
-moz-repeating-radial-gradient( 50% 50%, 100% 100%, hsla(0,0%, 0%,0) 0%, hsla(0,0%, 0%,0) 3%, hsla(0,0%, 0%,.1) 3.5%),
-moz-repeating-radial-gradient( 50% 50%, 100% 100%, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0) 6%, hsla(0,0%,100%,.1) 7.5%),
-moz-repeating-radial-gradient( 50% 50%, 100% 100%, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0) 1.2%, hsla(0,0%,100%,.2) 2.2%),
-moz-radial-gradient( 50% 50%, 200% 50%, hsla(0,0%,90%,1) 5%, hsla(0,0%,85%,1) 30%, hsla(0,0%,60%,1) 100%);

font-size: 100%;
font-weight: bold;
padding:7% 7% 7% 7%;
width: 100px;
height: 30px;
}  */

/* ▼▼▼ ファンシーボタンここから ▼▼▼ */
.fancy {
width: 100px;
margin: 5px auto;
padding: 10px; 
text-align: center;
background-color: #555; 
background: -webkit-gradient(linear, left top, left bottom, from(rgba(150,150,150,0.4)), to(rgba(0,0,0,0.4)));  
background: -moz-linear-gradient(top, rgba(0,0,0,0.4), rgba(77,77,77,0.4));
text-decoration: none; 
outline: 0; 
border-width: 1px; 
-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
-webkit-background-clip: padding-box;
border-width: 1px; 
border-style: solid; 
border-color: #ccc #444 #111 #444; 
border-color: rgba(255,255,255,0.7) rgba(0,0,0,0.5) rgba(0,0,0,0.7) rgba(0,0,0,0.5); 
-webkit-box-shadow: rgba(0,0,0,0.75) 0px 0px 3px; -moz-box-shadow: rgba(0,0,0,0.75) 0px 0px 3px; box-shadow: rgba(0,0,0,0.75) 0px 0px 3px;
}

.fancy a {
display: block;
margin: auto;
text-decoration: none;
color: #eee;
text-shadow: 0px 0px 6px #5555ff;
}

/* ▼▼▼ アコーディオンここから ▼▼▼ */
dl.accordion dt {
	margin: auto;
	text-align: center;
	cursor:	pointer;
	color: #fff;
	background-color: #bc8f8f;
	width: 100%;
}
dl.accordion dt.opened {
	background-color: #db7093;
}
dl.accordion dd {
	margin: 0px;
	padding: 0px;
	width: 100%;
}