@charset "utf-8";

/*
■1)通常ページ
スマホ用     0-519px
タブレット用 520+px
*/

/************************************************

 Reset

*************************************************/

header,section,nav,footer {
 display: block;
 margin: 0;
 padding: 0;
}

html,body {
 width: 100%;
}

body,
h1,h2,h3,h4,h5,h6,
p,ul,ol,dl,dt,dd,
form {
 margin: 0;
 padding: 0;
}

ul,
ol {
 list-style: none;
}

img {
 border: 0;
 vertical-align: top;
}

/************************************************

 Font
 reference YUI Library - Fonts - Example: Setting the font size with YUI Fonts

************************************************/

#audioplayercontent,
.container {
 font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
 line-height: 1.5;
 font-size: 13px;
}

table,
ul ul,
ol ol,
td ul,
td p,
td dt,
td dd {
 font-size: 100%;
}

select,
input,
textarea,
button {
 font-size: 99%;
}

#audioplayercontent p,
.help-content,
.doc-header .help {
 font-size: 131%;/*17px*/
}

.desc {
	font-size: 146.5%;
}

.choice,
.menu p {
 font-size: 153.9%;/*20px*/
}

.back,
.go {
 font-size: 167%;/*22px*/
}

.lang-nav ul,
.menu a.switch,
.menu h1 {
 font-size: 189%;/*25px*/
}
.menu a.showaudio {
 font-size: 167%;/*22px*/
}

.doc-header .title h1 {
 font-size: 210%;
 line-height: 1.2;
}

.menu a em {
 font-size: 110%;
}

/*****************************************

 Default Common

*****************************************/

body {
	background-color: #FFDD06;
	margin: 0;
	padding: 0;
	border-top: 10px solid #E20013;
	border-bottom: 10px solid #E20013;
}

.container {
	position: relative;
}

.heading-a {
	margin-top: 40px;
	margin-bottom: 20px;
	padding-bottom: 5px;
	border-bottom: 1px solid #000;
	text-align: center;
}

.heading-a:first-child {
	margin-top: 0;
}

.doc-header,
.doc-footer {
	position: relative;
	background: #FFF;
	padding: 30px 0;
	text-align: center;
}

.doc-footer {
	padding-right: 30px;
	padding-left: 30px;
}

	.doc-header .title {
		position: relative;
		display: inline-block;
		background: url(../images/page-logo.gif) 0 0 no-repeat;
		min-height: 108px;
		padding-left: 200px;
	}

		.doc-header .title h1 {
			display: inline-block;
			padding-top: 45px;
		}

		.doc-header .title a {
			display: block;
			position: absolute;
			left: 0;
			top: 0;
			width: 167px;
			height: 108px;
			text-indent: -9999px;
		}
	
	.doc-header .help {
		position: absolute;
		top: 10px;
		right: 0;
		border: 2px solid #CCC;
		border-right: 0;
		-webkit-border-top-left-radius: 200px;
  -moz-border-radius-topleft: 200px;
  border-top-left-radius: 200px;
  -webkit-border-bottom-left-radius: 200px;
  -moz-border-radius-bottomleft: 200px;
  border-bottom-left-radius: 200px;
		font-weight: bold;
	}
	
		.doc-header .help a {
			display: block;
			background: url(../images/icon-help.png) 5px 3px no-repeat;
			padding: 0 20px 0 50px;
			min-height: 36px;
		}
	
			.doc-header .help span {
				display: block;
				padding-top: 5px;
			}

.main {
	background: url(../images/edge.png) 50% -5px no-repeat;
	padding: 50px 50px;
	-webkit-background-size: 43px 30px;
	-moz-background-size: 43px 30px;
	background-size: 43px 30px;
}

	.menu li {
		margin-bottom: 30px;
	}
		.menu li a.showaudio,
		.menu a.switch {
			display: block;
			background: #ffffff;
			background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUxJSIgc3RvcC1jb2xvcj0iI2YwZjBmMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmMGYwZjAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
			background: -moz-linear-gradient(top,  #ffffff 0%, #ffffff 50%, #f0f0f0 51%, #f0f0f0 100%);
			background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(50%,#ffffff), color-stop(51%,#f0f0f0), color-stop(100%,#f0f0f0));
			background: -webkit-linear-gradient(top,  #ffffff 0%,#ffffff 50%,#f0f0f0 51%,#f0f0f0 100%);
			background: -o-linear-gradient(top,  #ffffff 0%,#ffffff 50%,#f0f0f0 51%,#f0f0f0 100%);
			background: -ms-linear-gradient(top,  #ffffff 0%,#ffffff 50%,#f0f0f0 51%,#f0f0f0 100%);
			background: linear-gradient(to bottom,  #ffffff 0%,#ffffff 50%,#f0f0f0 51%,#f0f0f0 100%);
			padding: 13px 20px 13px 15px;
			-webkit-border-radius: 10px;
			-moz-border-radius: 10px;
			border-radius: 10px;
			-moz-box-shadow: 1px 1px 2px #333;
			-webkit-box-shadow: 1px 1px 2px #333;
			box-shadow: 1px 1px 2px #333;
			font-weight: bold;
		}

			.menu a span {
				padding-right: 25px;
			}
	
			.menu a span.wrap {
				display: block;
			}
	
			.menu a span.wrap span {
				display: block;
				width: 100%;
				background: url(../images/arrow-red.png) 100% 45% no-repeat;
				-webkit-background-size: 29px 27px;
				-moz-background-size: 29px 27px;
				background-size: 29px 27px;
			}
	
				#audioplayercontent a em,
				#audioplayercontent h1 em,
				.menu a em,
				.menu h1 em {
					float: left;
					display: block;
					background-color: #E20013;
					width: 45px;
					height: 45px;
					color: #FFDD06;
					font-style: normal;
					text-align: center;
					vertical-align: middle;
					margin-right: -45px;
					text-indent:-9999px;
				}
				.bg_num01{background:url(../images/num01.gif) 0 0;}
				.bg_num02{background:url(../images/num02.gif) 0 0;}
				.bg_num03{background:url(../images/num03.gif) 0 0;}
				.bg_num04{background:url(../images/num04.gif) 0 0;}
				.bg_num05{background:url(../images/num05.gif) 0 0;}
				.bg_num06{background:url(../images/num06.gif) 0 0;}
				.bg_num07{background:url(../images/num07.gif) 0 0;}
				.bg_num08{background:url(../images/num08.gif) 0 0;}
				.bg_num09{background:url(../images/num09.gif) 0 0;}
				.bg_num10{background:url(../images/num10.gif) 0 0;}
				.bg_num11{background:url(../images/num11.gif) 0 0;}
				.bg_num12{background:url(../images/num12.gif) 0 0;}
				.bg_num13{background:url(../images/num13.gif) 0 0;}
				.bg_num14{background:url(../images/num14.gif) 0 0;}
				.bg_num15{background:url(../images/num15.gif) 0 0;}
				.bg_num16{background:url(../images/num16.gif) 0 0;}
				.bg_num17{background:url(../images/num17.gif) 0 0;}
				.bg_num18{background:url(../images/num18.gif) 0 0;}
				.bg_num19{background:url(../images/num19.gif) 0 0;}
				.bg_num20{background:url(../images/num20.gif) 0 0;}
				.bg_num21{background:url(../images/num21.gif) 0 0;}

				
				.type-y .bg_num01{background:url(../images/y_num01.gif) 0 0;}
				.type-y .bg_num02{background:url(../images/y_num02.gif) 0 0;}
				.type-y .bg_num03{background:url(../images/y_num03.gif) 0 0;}
				.type-y .bg_num04{background:url(../images/y_num04.gif) 0 0;}
				.type-y .bg_num05{background:url(../images/y_num05.gif) 0 0;}
				.type-y .bg_num06{background:url(../images/y_num06.gif) 0 0;}
				.type-y .bg_num07{background:url(../images/y_num07.gif) 0 0;}
				.type-y .bg_num08{background:url(../images/y_num08.gif) 0 0;}
				.type-y .bg_num09{background:url(../images/y_num09.gif) 0 0;}
				.type-y .bg_num10{background:url(../images/y_num10.gif) 0 0;}
				.type-y .bg_num11{background:url(../images/y_num11.gif) 0 0;}
				.type-y .bg_num12{background:url(../images/y_num12.gif) 0 0;}
				.type-y .bg_num13{background:url(../images/y_num13.gif) 0 0;}
				.type-y .bg_num14{background:url(../images/y_num14.gif) 0 0;}
				.type-y .bg_num15{background:url(../images/y_num15.gif) 0 0;}
				.type-y .bg_num16{background:url(../images/y_num16.gif) 0 0;}
				.type-y .bg_num17{background:url(../images/y_num17.gif) 0 0;}
				.type-y .bg_num18{background:url(../images/y_num18.gif) 0 0;}
				.type-y .bg_num19{background:url(../images/y_num19.gif) 0 0;}
				.type-y .bg_num20{background:url(../images/y_num20.gif) 0 0;}
				.type-y .bg_num21{background:url(../images/y_num21.gif) 0 0;}
    	
				#audioplayercontent a strong,
				#audioplayercontent h1 strong,
				.menu a strong,
				.menu h1 strong {
					float: left;
					margin-left: 45px;
					display: block;
					vertical-align: middle;
					padding-left: 15px;
					padding-top: 4px;
				}

#audioplayercontent section,
.menu section {
	position: absolute;
	left: 0;
	top: 0;
	background: #FFF;
	margin: 0 30px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	z-index: 1000;
}

#audioplayercontent {
	position: static;
	left: 0;
	top: 0;
	width: 100%;
}
#audioplayercontent section {
	position: relative;
	box-sizing: border-box;
}

	#audioplayercontent section .inner,
	.menu section .inner {
		padding: 40px 30px 25px 30px;
	}

	#audioplayercontent h1,
	.menu h1 {
		margin-bottom: 40px;
		padding-bottom: 30px;
		border-bottom: 2px solid #CCC;
	}

	#audioplayercontent .unit {
		padding-bottom: 40px;
	}
	.menu .unit {
		padding-bottom: 20px;
	}

		#audioplayercontent .unit p,
		.menu .unit p {
			margin-bottom: 1.5em;
		}

	#audioplayercontent p.close,
	.menu p.close {
		margin: 0;
		padding-top: 25px;
		border-top: 2px solid #CCC;
		text-align: center;
		cursor: pointer;
	}

		#audioplayercontent .close a,
		.menu .close a {
			display: inline-block;
			background: url(../images/icon-close.gif) 0 0 no-repeat;
			-webkit-background-size: 29px 29px;
			-moz-background-size: 29px 29px;
			background-size: 29px 29px;
			padding: 0 0 5px 36px;
			font-weight: bold;
			min-height: 29px;
		}

.back {
	float: left;
}

.go {
	float: right;
}

.back a,
.go a {
	display: table-cell;
	height: 66px;
	vertical-align: middle;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}

.back a {
	background: #5e5e5e;
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iIzVlNWU1ZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUxJSIgc3RvcC1jb2xvcj0iIzVlNWU1ZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUyJSIgc3RvcC1jb2xvcj0iIzQ0NDQ0NCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM0NDQ0NDQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(top,  #5e5e5e 1%, #5e5e5e 51%, #444444 52%, #444444 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#5e5e5e), color-stop(51%,#5e5e5e), color-stop(52%,#444444), color-stop(100%,#444444));
	background: -webkit-linear-gradient(top,  #5e5e5e 1%,#5e5e5e 51%,#444444 52%,#444444 100%);
	background: -o-linear-gradient(top,  #5e5e5e 1%,#5e5e5e 51%,#444444 52%,#444444 100%);
	background: -ms-linear-gradient(top,  #5e5e5e 1%,#5e5e5e 51%,#444444 52%,#444444 100%);
	background: linear-gradient(to bottom,  #5e5e5e 1%,#5e5e5e 51%,#444444 52%,#444444 100%);
	width: 120px;
}

	.back span {
		display: block;
		background: url(../images/arrow-back.png) 10px 4px no-repeat;
		padding-left: 30px;
		-webkit-background-size: 28px 26px;
		-moz-background-size: 28px 26px;
		background-size: 28px 26px;
	}

.go a {
	background: #e62838;
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iI2U2MjgzOCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUxJSIgc3RvcC1jb2xvcj0iI2U2MjgzOCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUxJSIgc3RvcC1jb2xvcj0iI2UyMDAxMyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlMjAwMTMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(top,  #e62838 1%, #e62838 51%, #e20013 51%, #e20013 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#e62838), color-stop(51%,#e62838), color-stop(51%,#e20013), color-stop(100%,#e20013));
	background: -webkit-linear-gradient(top,  #e62838 1%,#e62838 51%,#e20013 51%,#e20013 100%);
	background: -o-linear-gradient(top,  #e62838 1%,#e62838 51%,#e20013 51%,#e20013 100%);
	background: -ms-linear-gradient(top,  #e62838 1%,#e62838 51%,#e20013 51%,#e20013 100%);
	background: linear-gradient(to bottom,  #e62838 1%,#e62838 51%,#e20013 51%,#e20013 100%);
	padding-right: 10px;
	padding-left: 20px;
	color: #FFF;
	-moz-box-shadow: 1px 1px 2px #333;
	-webkit-box-shadow: 1px 1px 2px #333;
	box-shadow: 1px 1px 2px #333;
}

	.go span {
		display: block;
		background: url(../images/arrow-white.png) 100% 4px no-repeat;
		padding-right: 50px;
		-webkit-background-size: 28px 26px;
		-moz-background-size: 28px 26px;
		background-size: 28px 26px;
	}

#overlay,
#audiooverlay {
	background: #000;
	position: absolute;
	left: 0;
	top: 0;
	opacity: 0.5;
}

.logo {
	background: url(../images/top-logo.png) 0 0 no-repeat;
	margin: 65px auto 70px auto;
	width: 513px;
	height: 328px;
	text-indent: -9999px;
}

.desc,
.choice {
	font-weight: bold;
	text-align: center;
}

.desc {
	margin-bottom: 80px;
	padding: 0 20px;
}

.choice {
	margin-bottom: 50px;
}

.lang-nav {
	padding-bottom: 70px;
}

	.lang-nav li {
		margin-bottom: 30px;
	}
	
	.lang-nav li.col {
		float: left;
		width: 48%;
	}
	
	.lang-nav li.even {
		float: right;
	}
	
		.lang-nav a,
		.lang-nav span {
			display: block;
		}
		
		.lang-nav a {
			display: block;
			background: #e62838;
			background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iI2U2MjgzOCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUxJSIgc3RvcC1jb2xvcj0iI2U2MjgzOCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUxJSIgc3RvcC1jb2xvcj0iI2UyMDAxMyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlMjAwMTMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
			background: -moz-linear-gradient(top,  #e62838 1%, #e62838 51%, #e20013 51%, #e20013 100%);
			background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#e62838), color-stop(51%,#e62838), color-stop(51%,#e20013), color-stop(100%,#e20013));
			background: -webkit-linear-gradient(top,  #e62838 1%,#e62838 51%,#e20013 51%,#e20013 100%);
			background: -o-linear-gradient(top,  #e62838 1%,#e62838 51%,#e20013 51%,#e20013 100%);
			background: -ms-linear-gradient(top,  #e62838 1%,#e62838 51%,#e20013 51%,#e20013 100%);
			background: linear-gradient(to bottom,  #e62838 1%,#e62838 51%,#e20013 51%,#e20013 100%);
			padding: 28px 20px 28px 30px;
			-webkit-border-radius: 10px;
			-moz-border-radius: 10px;
			border-radius: 10px;
			-moz-box-shadow: 1px 1px 2px #333;
			-webkit-box-shadow: 1px 1px 2px #333;
			box-shadow: 1px 1px 2px #333;
			font-weight: bold;
		}
		
		.lang-nav span {
			background: url(../images/arrow-white.png) 100% 50% no-repeat;
			-webkit-background-size: 28px 26px;
			-moz-background-size: 28px 26px;
			background-size: 28px 26px;
		}

.help-content li {
	margin-bottom: 50px;
}

.help-content h2 {
	float: left;
	background: url(../images/step1.gif) 0 0 no-repeat;
	width: 76px;
	height: 76px;
	margin-right: -76px;
	text-indent: -9999px;
}

.help-content .step-2 h2 {
	background-image: url(../images/step2.gif);
}

.help-content .step-3 h2 {
	background-image: url(../images/step3.gif);
}

.help-content div.unit img {
	margin-right: -210px;
	float: left;
}

.help-content div.unit,
.help-content div.val {
	float: left;
	width: 100%;
}

.help-content div.inner {
	margin-left: 106px;
}

.help-content div.val p {
	margin-left: 230px;
}

a:link,
a:visited {
	color: #000;
	text-decoration: none;
}

.lang-nav a:link,
.lang-nav a:visited,
.go a:link,
.go a:visited,
.back a:link,
.back a:visited {
	color: #FFF;
}

.help-content li:after,
.doc-footer:after,
.lang-nav ul:after,
.menu a:after,
.menu h1:after,
.wrap span:after {
 content: '';
 display: block;
 clear: both;
 overflow: hidden;
}

/*****************************************

 スマホ用 0-519px Screen and iPhone Retina

*****************************************/

@media only screen and (max-width:519px), only screen and (max-device-width:519px) and (-webkit-min-device-pixel-ratio:2) {

	#audioplayercontent .close a {
		padding-top: 4px;
	}
	
	body {
		border-width: 5px;
	}
	
	.back,
	.go,
	.menu a.switch,
	.menu h1,
	.doc-header .title h1,
	.lang-nav ul {
 	font-size: 138.5%;/*18px*/
	}

	.help-content,
	#audioplayercontent p,
	.menu p {
	 font-size: 116%;/*15px*/
	}

	.doc-header .help {
	 font-size: 108% ;/*14px*/
	}
	
	.choice {
		font-size: 100%;
	}
	
	#doc .menu em,
	.desc {
		font-size: 96%;
	}

	.doc-header {
		padding: 25px 20px 10px 20px;
	}

	.doc-footer {
		padding: 20px 10px;
	}

		.doc-header .title {
			min-height: 64px;
			padding-left: 100px;
			-webkit-background-size: 90px 57px;
			-moz-background-size: 90px 57px;
			background-size: 90px 57px;
		}

		.doc-header .title a {
			width: 90px;
			height: 57px;
		}

			.doc-header .title h1 {
				padding-top: 22px;
			}
	
		.doc-header .help {
			top: 5px;
		}
		
			.doc-header .help a {
				display: block;
				background: url(../images/icon-help.png) 5px 4px no-repeat;
				padding: 0 20px 0 36px;
				min-height: 27px;
				-webkit-background-size: 20px 19px;
				-moz-background-size: 20px 19px;
				background-size: 20px 19px;
			}
	
				.doc-header .help span {
					padding-top: 2px;
				}
	
	.main {
		padding: 25px 20px;
		-webkit-background-size: 30px 20px;
		-moz-background-size: 30px 20px;
		background-size: 30px 20px;
	}

	.menu li {
		margin-bottom: 10px;
	}
	
		.menu a.switch {
			padding-right: 15px;
		}
	
			#audioplayercontent a strong,
			#audioplayercontent h1 strong,
			.menu a strong,
			.menu h1 strong {
					margin-left: 25px;
					padding-top: 2px;
			}
		
			.menu a span {
				display: block;
				padding-right: 25px;
			}
		
			.menu a span.wrap span {
				-webkit-background-size: 22px 20px;
				-moz-background-size: 22px 20px;
				background-size: 22px 20px;
			}
	
		.menu h1 {
			margin-bottom: 20px;
			padding-bottom: 10px;
		}
	
		#audioplayercontent a em,
		#audioplayercontent h1 em,
		.menu a em,
		.menu h1 em {
			width: 30px;
			height: 30px;
		}

				.bg_num01{background:url(../images/num01_s.gif) 0 0;}
				.bg_num02{background:url(../images/num02_s.gif) 0 0;}
				.bg_num03{background:url(../images/num03_s.gif) 0 0;}
				.bg_num04{background:url(../images/num04_s.gif) 0 0;}
				.bg_num05{background:url(../images/num05_s.gif) 0 0;}
				.bg_num06{background:url(../images/num06_s.gif) 0 0;}
				.bg_num07{background:url(../images/num07_s.gif) 0 0;}
				.bg_num08{background:url(../images/num08_s.gif) 0 0;}
				.bg_num09{background:url(../images/num09_s.gif) 0 0;}
				.bg_num10{background:url(../images/num10_s.gif) 0 0;}
				.bg_num11{background:url(../images/num11_s.gif) 0 0;}
				.bg_num12{background:url(../images/num12_s.gif) 0 0;}
				.bg_num13{background:url(../images/num13_s.gif) 0 0;}
				.bg_num14{background:url(../images/num14_s.gif) 0 0;}
				.bg_num15{background:url(../images/num15_s.gif) 0 0;}
				.bg_num16{background:url(../images/num16_s.gif) 0 0;}
				.bg_num17{background:url(../images/num17_s.gif) 0 0;}
				.bg_num18{background:url(../images/num18_s.gif) 0 0;}
				.bg_num19{background:url(../images/num19_s.gif) 0 0;}
				.bg_num20{background:url(../images/num20_s.gif) 0 0;}
				.bg_num21{background:url(../images/num21_s.gif) 0 0;}


				#audioplayercontent.type-y em,
				.type-y .menu li a em {
					-webkit-background-size: 100% auto;
					background-size: 100% auto;
				}
    

		.menu section {
			margin: 0 10px;
		}
		
			.menu section .inner {
				padding: 20px 20px 20px 20px;
			}

	.menu .close {
		padding-top: 20px;
	}

		.menu .close a {
			-webkit-background-size: 20px 20px;
			-moz-background-size: 20px 20px;
			background-size: 20px 20px;
			padding: 0 0 5px 26px;
		}

	.back a,
	.go a {
		height: 50px;
	}

	.back a {
		width: 100px;
	}
	
	.go a {
		padding-left: 10px;
		padding-right: 8px;
	}
	
		.back span {
			background-position: 10px 4px;
			padding-left: 30px;
			-webkit-background-size: 22px 20px;
			-moz-background-size: 22px 20px;
			background-size: 22px 20px;
		}

		.go span {
			background-position: 100% 4px;
			padding-right: 30px;
			-webkit-background-size: 22px 20px;
			-moz-background-size: 22px 20px;
			background-size: 22px 20px;
		}

	.logo {
		margin: 0 auto 20px auto;
		width: 204px;
		height: 131px;
		-webkit-background-size: 204px 131px;
		-moz-background-size: 204px 131px;
		background-size: 204px 131px;
	}

	.desc {
		margin-bottom: 10px;
		padding: 0 40px;
	}

	.choice {
		margin-top: 5px;
		margin-bottom: 20px;
	}

	.lang-nav {
		padding-bottom: 30px;
	}
	
		.lang-nav li {
			margin-bottom: 15px;
		}
			
			.lang-nav a {
				padding: 14px 12px 14px 20px;
			}
			
			.lang-nav span {
				-webkit-background-size: 20px 18px;
				-moz-background-size: 20px 18px;
				background-size: 20px 18px;
			}

	.help-content li {
		margin-bottom: 30px;
	}

	.help-content div.inner {
		margin-left: 90px;
	}
	
}

@media only screen and (max-width:600px),
only screen and (max-device-width:600px) and (-webkit-min-device-pixel-ratio:2) {


	.help-content h2 {
		width: 55px;
		height: 55px;
		margin-right: -55px;
		-webkit-background-size: 55px 55px;
		-moz-background-size: 55px 55px;
		background-size: 55px 55px;
	}

	.help-content div.inner {
		margin-left: 70px;
	}
	
	.help-content div.val p {
		margin-left: 194px;
	}
	
	.help-content div.unit img,
	.help-content div.val {
		margin: 0;
		float: none;
	}
	
	.help-content div.val p {
		margin: 10px 0 0 0;
	}
	
}

