@charset "utf-8";

/* body */
body {
	color:#1a1a1a;
	margin:0px auto;
	padding:180px 0px 0px 0px;      /* ヘッダー固定部分 */
	background:#fff url(../../img/bg1.gif) repeat;
	background-position:center;
	font-family: "Helvetica Neue", Arial, Meiryo, "Meiryo UI", "Hiragino Kaku Gothic ProN", "Hiragino Sans", system-ui, sans-serif;
	max-width:1080px;
	-webkit-text-size-adjust: 100%;
	text-size-adjust: none;
}


/* コンテンツ */
body { text-align:center; }
h1 { color:deeppink; font-size:26px; margin:0px 0px;}
h2 { color:black; font-size:40px; font-weight:bold; margin:0px 0px;}
h3 { color:deeppink; font-size:14px; margin:0px 0px;}
p  { margin:5px 5px; }
header, footer { max-width:1080px; z-index:99; }
div { margin-right:auto; margin-left:auto; }

.header_fix { width: 100%; min-width:300px; position: fixed; top: 0px; }
.title_bar1 { width: 100%; height:120px; text-align:center; border:0px; background:#fff url(../../img/title_bg1_sp.gif) repeat;}
.title_bar2 { width: 100%; height:60px; text-align:center; border:0px; background:#fff url(../../img/title_bg2_sp.gif) repeat;}
.title_logo { margin: 30px 0 0 0; }

.back { margin:5px 0px 5px 20px; text-align:left; float:left; }
.back a{ font-size:28px; font-weight:bold; text-decoration: none; color:white; }
.back img {width:50px; height:50px; vertical-align:middle; }
.back span { vertical-align:middle; }

.music_title {
	font-size:42px;
	font-weight:bold;
	color:black;
	text-align:center;
}

.arrange { font-size:24px; }

.play { margin:0px 10px 0px 10px; line-height:2; }
.play a { font-size:28px; font-weight:bold; color:#fff; }
.play a:hover { color:#444; background-color:#fc9; }

.footer_1 { 
	height:30px;
	font-size:24px;
	font-weight:bold;
	color:white;
	padding:18px;
	text-align:center;
	line-height:30px;
	background-color:#f89;
}
.footer_2 { 
	font-size:18px;
	font-weight:bold;
	color:gray;
	text-align:right;
	line-height:40px;
	margin:0px 20px 0px 0px;
}

/**************************************************
　　　　角丸枠を作る ＋ 枠の縁を立体的にする
**************************************************/
.radius1
{
	font-size:28px;
	font-weight:bold;
	color:white;
	border: ridge 4px #ffc6bf;
	background-color: #ff4ca5;
	border-radius: 10px;
	margin: 20px auto;
	width: 320px;
	height: 90px;
	padding: 10px 5px;
}
.radius1 p {font-weight:bold; color:white; }

/**************************************************
　　　　曲名ボタンのデザイン
**************************************************/

.utube ,
.sounds ,
.stop-button
{
	display: block ;
	border: ridge 4px #8cf;
	max-width: 660px ;
	margin: 20px auto;
	padding: 2px 0 ;
	border-radius: 10px ;
	color: #fff ;
	font-weight: bold ;
	background-color: #09f ;
	text-align: center ;
	text-decoration: none ;
}

.stop-button
{
	background-color: #777 ;
}