
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp,apply
small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	color:#1a1a1a;
	font-family: 'Noto Sans', 'Noto Sans CJK JP', 'Noto Sans CJK JP Subset', 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
.red {
	color:#D70B24;
}

a:link {color: #1070C5; text-decoration: none; }
a:visited { color: #1070C5; text-decoration: none; }
a:hover { color: #0087FF; text-decoration: underline; }
a:active { color: #1070C5; text-decoration: none; }
a:hover img { transition:0.5s; opacity: 0.8; filter:alpha(opacity=80); -ms-filter:"alpha(opacity=80)";}


/*** 要素出し分け ***/
.pc {
	display: none;
}
/* 480px～959px */
@media screen and (min-width: 480px) and (max-width: 959px) { 
.sp {
	display: none;
	}
.pc {
	display: inline;
	}
}
/* 960px～ */
@media screen and (min-width: 960px) { 
.sp {
	display: none;
	}
.pc {
	display: inline;
	}
}

/*** 見出しh2 ***/
	h2 {
		font-size:20px;
		line-height:1.4em;
		font-weight:600;
		margin: 0 auto 20px;
		padding: 0 35px;
		display: inline-block;
		position: relative;
        display: block;
	}
	h2 span {
		font-size: 16px;
		color: #15b29a;
	}

/* 480px～959px */
@media screen and (min-width: 480px) and (max-width: 959px) { 
	h2 {
		font-size:24px;
		line-height:1.4em;
		margin-bottom:40px;
		padding: 0 40px;
	}
	h2 span {
		font-size: 20px;
	}
}
/* 960px～ */
@media screen and (min-width: 960px) { 
	h2 {
		font-size:34px;
		line-height:1.4em;
		margin-bottom: 40px;
		padding: 0 60px;
	}
	h2 span {
		font-size: 26px;
	}
}

/*** ヘッダ ***/
header {
	min-width: 100%;
	overflow: hidden;
	background:rgba(255,255,255,1);
	padding: 15px 0px 32px;
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    z-index: 999;
	}
	header #block {
		width: 100%;
		margin: 0 auto;
	}
	/*** ハンバーガーメニュー ***/
	header #hamburger .btn-gNav{
	  position: fixed;
	  top: 13px;
	  right: 20px;
	  width: 30px;
	  height: 24px;
	  z-index: 3;
	  box-sizing: border-box;
	  cursor: pointer;
	  -webkit-transition: all 400ms;
	  transition: all 400ms;
	}
	header #hamburger .btn-gNav span{
	  position: absolute;
	  width: 100%;
	  height: 4px;
	  background: #15b29a;
	  border-radius: 10px;
	  -webkit-transition: all 400ms;
	  transition: all 400ms;
	}
	header #hamburger .btn-gNav span:nth-child(1) {
	  top:0;
	}
	header #hamburger .btn-gNav span:nth-child(2) {
	  top:10px;
	}
	header #hamburger .btn-gNav span:nth-child(3) {
	  top:20px;
	}
	header #hamburger .btn-gNav.open span:nth-child(1){
	  background: #15b29a;
	  top: 8px;
	  -webkit-transform: rotate(-45deg);
	  -moz-transform   : rotate(-45deg);
	  transform        : rotate(-45deg);
	}
	header #hamburger .btn-gNav.open span:nth-child(2),#hamburger .btn-gNav.open span:nth-child(3){
	  top: 8px;
	  background :#15b29a;
	  -webkit-transform: rotate(45deg);
	  -moz-transform   : rotate(45deg);
	  transform        : rotate(45deg);
	}
	header #gNav{
	  position: fixed;
	  top: 0;
	  right: -100%;
	  width: 100%;
	  height: 100%;
	  background: #a6e8d5;
	  font-size: 16px;
	  box-sizing: border-box;
	  z-index: 2;
	  margin-top: 47px;
	  padding: 0px;
	  transition: .3s;
	}
	header #gNav.open{
	  right: 0px;
	}
	header #gNav .gNav-menu{
	  width: 80%;
	  height:100%;
	  padding: 10px 30px 0;
	  background: #a6e8d5;
	  margin: 0 auto;
	  display: flex;
	  flex-direction: column;
	  text-align: center;
	  justify-content: top;
	}
	header #gNav .gNav-menu li{
	  font-size:18px;
	  line-height:1.4em;
	  font-weight:600;
	  display: block;
	  padding : 18px 15px;
	  border-bottom: 1px solid #15b29a;
	}
	header #gNav .gNav-menu li a{
	  color: #292929;
	  text-decoration: none;
	  display: block;
	}

/* 480px～959px */
@media screen and (min-width: 480px) and (max-width: 959px) { 
header {
	background:rgba(255,255,255,0);
	}
	header #block {
		display: none;
	}
}
/* 960px～ */
@media screen and (min-width: 960px) { 
header {
	background:rgba(255,255,255,0);
	}
	header #block {
		display: none;
	}
}

/*** メインビジュアル ***/
#mainV {
	padding: 0em 0 1em;
	min-width: 100%;
	overflow: hidden;
	background: #f1ece0;
	}
	#mainV .contents {
		width: 100%;
		overflow: hidden;
		margin: 0 auto;
	}
	#mainV .contents h1 {
		text-align: center;
		margin-top: 55px;
	}
	#mainV .contents h1 img {
		width: 100%;
		height: auto;
	}
	#mainV .contents h1 img.box_in {
		width: 90%;
		height: auto;
	}
	#mainV .contents p {
		width: 90%;
		margin: 20px auto 5px;
		color: #393939;
		font-size:15px;
		line-height:1.6em;
		font-weight:600;
	}
	#mainV .contents p.attention {
		width: 90%;
		margin: 0 auto 10px;
		font-size:13px;
		font-weight:400;
	}

/* 480px～959px */
@media screen and (min-width: 480px) and (max-width: 959px) { 
#mainV {
	min-width: 100%;
	padding-bottom: 1.5em;
	}
	#mainV .contents h1 {
		margin-top: 40px;
	}
	#mainV .contents h1 img {
		width: 80%;
		height: auto;
	}
	#mainV .contents p {
		width: 80%;
		margin: 30px auto 5px;
	}
	#mainV .contents p.attention {
		width: 80%;
	}
}
/* 960px～ */
@media screen and (min-width: 960px) { 
#mainV {
	min-width: 1050px;
	padding-bottom: 1.5em;
	}
	#mainV .contents {
		width: 1050px;
		overflow: hidden;
		margin: 0 auto;
	}
	#mainV .contents h1 {
		margin-top: 25px;
	}
	#mainV .contents h1 img {
		width:980px;
		height: auto;
	}
	#mainV .contents p {
		width: 90%;
		margin: 40px auto 5px;
		font-size:16px;
	}
	#mainV .contents p.attention {
		width: 90%;
		font-size:14px;
	}
}

/*** 目次ナビ ***/
#toc {
	display: none;
	}

/* 480px～959px */
@media screen and (min-width: 480px) and (max-width: 959px) { 
#toc {
	display: inline-block;
	min-width: 100%;
	overflow: hidden;
	background: #a6e8d5;
	padding: 1em 0 1em;
	}
	#toc .contents {
		width: 96%;
		overflow: hidden;
		margin: 0 auto;
		text-align: center;
	}
	#toc .contents .container {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-around;
	}
	#toc .contents .container .item {
		width: 20%;
	}
	#toc .contents .container .button {
		display: inline-block;
		font-size: 15px;
		line-height:1.4em;
		font-weight:600;
		color: #5e5e5e;
		background-color: #fff;
		border: 2px solid #fff;
		text-decoration: none;
		border-radius: 20px;
		text-align: center;
		padding: 8px 5px;
		margin: 5px 2px;
	}
	#toc .contents .container .button:hover {
		color: #fff;
		background-color: #292929;
		border: 2px solid #292929;
	}
	#toc .contents .container .button_on {
		display: inline-block;
		font-size: 15px;
		line-height:1.4em;
		font-weight:600;
		color: #fff;
		background-color: #292929;
		border: 2px solid #292929;
		text-decoration: none;
		border-radius: 20px;
		text-align: center;
		padding: 8px 5px;
		margin: 5px 2px;
	}
}
/* 960px～ */
@media screen and (min-width: 960px) { 
#toc {
	display: inline-block;
	min-width: 100%;
	overflow: hidden;
	background: #a6e8d5;
	padding: 1em 0 1em;
	}
	#toc .contents {
		width: 850px;
		overflow: hidden;
		margin: 0 auto;
	}
	#toc .contents .container {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-around;
	}
	#toc .contents .container .item {
		width: 20%;
	}
	#toc .contents .container .button {
		display: inline-block;
		font-size: 16px;
		line-height:1.4em;
		font-weight:600;
		color: #5e5e5e;
		background-color: #fff;
		border: 2px solid #fff;
		text-decoration: none;
		border-radius: 30px;
		text-align: center;
		padding: 12px 9px;
		margin: 5px 1px;
	}
	#toc .contents .container .button:hover {
		color: #fff;
		background-color: #292929;
		border: 2px solid #292929;
	}
	#toc .contents .container .button_on {
		display: inline-block;
		font-size: 16px;
		line-height:1.4em;
		font-weight:600;
		color: #fff;
		background-color: #292929;
		border: 2px solid #292929;
		text-decoration: none;
		border-radius: 30px;
		text-align: center;
		padding: 12px 9px;
		margin: 5px 1px;
	}
}

/*** 目次一覧 ***/
#list {
	padding: 2.5em 0 3em;
	min-width: 100%;
	overflow: hidden;
	}
	#list .contents {
		width: 90%;
		overflow: hidden;
		margin: 0 auto;
		text-align: center;
	}
	#list .contents div.list_wrap {
		border-bottom: 1px solid #D9D9D9;
	}
	#list .contents div.list_wrap div.list_unit {
		flex-direction: column;
		padding: 8px 0 8px;
		border-top: 1px solid #D9D9D9;
		position: relative;
	}
	#list .contents div.list_wrap div.list_unit:before {
		content: "";
		position: absolute;
		display: inline-block;
		background-image: url(../images/icon_arw.png);
		background-size: contain;
		background-repeat: no-repeat;
		margin-left: 0px;
		top: 33%;
		right: 2px;
		width: 35px;
		height: 35px;
	}
	#list .contents div.list_wrap div.list_unit:hover {
		background-color: #f5fffc;
	}
	#list .contents div.list_wrap div.list_unit div {
		flex: 1;
		text-align: left;
	}
	#list .contents div.list_wrap div.list_unit div.col-2 {
		padding: 0 35px 0 0;
	}
	#list .contents div.list_wrap div.list_unit p.chapter {
		padding: 0px;
		margin: 0 auto;
		display: block;
		font-size:17px;
		font-weight:600;
		color: #15b29a;
	}
	#list .contents div.list_wrap div.list_unit h3 {
		font-size:17px;
		line-height:1.6em;
		font-weight:600;
		margin: 5px 0 5px;
	}
	#list .contents div.list_wrap div.list_unit p.sound {
		font-size: 15px;
		line-height:1.8em;
		font-weight:400;
	}
	#list .contents div.list_wrap div.list_unit p.sound span {
		color: #fff;
		background-color: #15b29a;
		border-radius: 20px;
		padding: 1px 10px 3px;
	}
	#list .contents a:link {
		color: #1a1a1a; 
		text-decoration: none; 
	}

/* 480px～959px */
@media screen and (min-width: 480px) and (max-width: 959px) { 
#list {
	padding: 3.5em 0 3em;
	}
	#list .contents div.list_wrap {
		margin: 20px 5px 20px;
		padding: 0px;
	}
	#list .contents div.list_wrap div.list_unit {
		display: -webkit-flex;
		display: flex;
		flex-direction: row;
		justify-content:center;
		align-items: center;
	}
	#list .contents div.list_wrap div.list_unit:before {
		top: 33%;
		right: 10px;
		width: 38px;
		height: 38px;
	}
	#list .contents div.list_wrap div.list_unit div.col-1 {
		flex-grow:1;
	}
	#list .contents div.list_wrap div.list_unit div.col-2 {
		flex-grow:3.8;
		border-left: 1px dotted #D9D9D9;
		margin: 10px 0;
		padding: 5px 40px 5px 25px;
		text-align: left;
	}
	#list .contents div.list_wrap div.list_unit p.chapter {
		font-size:20px;
		text-align: center;
		margin: 0;
	}
	#list .contents div.list_wrap div.list_unit h3 {
		margin: 0 0 10px;
		font-size:19px;
	}
	#list .contents div.list_wrap div.list_unit p {
		display: inline;
	}
	#list .contents div.list_wrap div.list_unit p.sound {
		margin-right: 20px;
	}
}

/* 960px～ */
@media screen and (min-width: 960px) { 
#list {
	padding: 4em 0 6em;
	min-width: 1050px;
	overflow: hidden;
	}
	#list .contents {
		width: 1050px;
		overflow: hidden;
		margin: 0 auto;
	}
	#list .contents div.list_wrap div.list_unit {
		display: -webkit-flex;
		display: flex;
		flex-direction: row;
		justify-content:center;
		align-items: center;
	}
	#list .contents div.list_wrap div.list_unit:before {
		top: 30%;
		right: 10px;
		width: 48px;
		height: 48px;
	}
	#list .contents div.list_wrap div.list_unit div.col-1 {
		flex-grow:1;
	}
	#list .contents div.list_wrap div.list_unit div.col-2 {
		flex-grow:4;
		border-left: 1px dotted #D9D9D9;
		margin: 10px 0;
		padding: 5px 50px 5px 25px;
		text-align: left;
	}
	#list .contents div.list_wrap div.list_unit p.chapter {
		font-size:22px;
		text-align: center;
		margin: 0;
	}
	#list .contents div.list_wrap div.list_unit h3 {
		margin: 0 0 10px;
		font-size:21px;
	}
	#list .contents div.list_wrap div.list_unit p {
		display: inline;
	}
	#list .contents div.list_wrap div.list_unit p.sound {
		margin-right: 20px;
	}
}

/*** 音源一覧 ***/
#list_audio {
	padding: 1.5em 0 2em;
	}
#list_audio {
	min-width: 100%;
	overflow: hidden;
	background: #fff;
	}
	#list_audio .contents {
		width: 92%;
		overflow: hidden;
		margin: 0 auto;
		text-align: center;
	}
	#list_audio .contents table {
		border-collapse: collapse;
		border-spacing: 0;
		border: solid 2px #d9d9d9;
		width: 100%;
		margin-bottom: 20px;
	}
	#list_audio .contents table th, table td {
		border: dotted 1px #d9d9d9;
	}
	#list_audio .contents table th {
		color: #fff;
		background: #15b29a;
		font-size:14px;
		line-height:1.4em;
		font-weight:600;
		text-align: center;
		padding: 10px 5px;
		vertical-align: middle;
        width: 33.3%;
	}
	#list_audio .contents table.type02 th:nth-child(1){
		width: 20%;
	}
	#list_audio .contents table.type02 th:nth-child(2){
		width: 80%;
	}
	#list_audio .contents table td {
		text-align: left;
		padding: 10px 5px;
	}
	#list_audio .contents table td p.sound_no {
		font-size:12px;
		line-height:1.4em;
		font-weight:600;
		color: #15b29a;
	}
	#list_audio .contents h3.sound_no_type02 {
		font-size: 14px;
		line-height:1.6em;
		font-weight:400;
		color: #15b29a;
		border: 1px solid #15b29a;
		background-color: #fff;
		border-radius: 20px;
		padding: 2px 15px;
		margin-bottom: 10px;
		display: inline-block;
	}
	#list_audio .contents table td p.japanese {
		font-size:14px;
		line-height:1.6em;
	}
	#list_audio .contents table td p.korean {
		font-size:14px;
		line-height:1.6em;
		font-weight:600;
	}
	#list_audio .contents table td p.btn {
		color: #1070C5;
		font-size:14px;
		line-height:1.6em;
		font-weight:600;
		padding-left: 30px;
		display: block;
		position: relative;
	}
	#list_audio .contents table td p.btn:before {
		content: "";
		position: absolute;
		display: inline-block;
		background-image: url(../images/icon_sound.svg);
		background-size: contain;
		background-repeat: no-repeat;
		margin-left: 0px;
		top: -1px;
		left: 0;
		width: 25px;
		height: 25px;
	}
	#list_audio .contents table td p.btn span {
		color: #1070C5;
	}
	#list_audio .contents table td p.btn span:hover {
		cursor:pointer;
		color: #0087FF;
	}
	#list_audio .contents table span.small {
		font-size:80%;
	}


/* 480px～959px */
@media screen and (min-width: 480px) and (max-width: 959px) { 
#list_audio {
	padding: 2.5em 0 3em;
	}
	#list_audio .contents table {
		margin-bottom: 25px;
	}
	#list_audio .contents table th {
		font-size:16px;
	}
	#list_audio .contents table td {
		padding: 10px;
	}
	#list_audio .contents table td p.sound_no {
		font-size:13px;
	}
	#list_audio .contents h3.sound_no_type02 {
		font-size: 16px;
	}
	#list_audio .contents table td p.japanese {
		font-size:15px;
	}
	#list_audio .contents table td p.korean {
		font-size:15px;
	}
	#list_audio .contents table td p.btn {
		font-size:15px;
		padding-left: 38px;
	}
	#list_audio .contents table td p.btn:before {
		top: -2px;
		width: 30px;
		height: 30px;
	}
}

/* 960px～ */
@media screen and (min-width: 960px) { 
#list_audio {
	padding: 3em 0 5em;
	}
#list_audio {
	min-width: 1050px;
	overflow: hidden;
	}
	#list_audio .contents {
		width: 1050px;
		overflow: hidden;
		margin: 0 auto;
	}
	#list_audio .contents table {
		margin-bottom: 30px;
	}
	#list_audio .contents table th {
		font-size:18px;
	}
	#list_audio .contents table td {
		padding: 12px;
	}
	#list_audio .contents table td p.sound_no {
		font-size:14px;
	}
	#list_audio .contents h3.sound_no_type02 {
		font-size: 18px;
	}
	#list_audio .contents table td p.japanese {
		font-size:16px;
	}
	#list_audio .contents table td p.korean {
		font-size:16px;
	}
	#list_audio .contents table td p.btn {
		font-size:16px;
		padding-left: 38px;
	}
	#list_audio .contents table td p.btn:before {
		top: -2px;
		width: 30px;
		height: 30px;
	}
}

/*** フッタ ***/
footer {
	min-width: 100%;
	overflow: hidden;
	background: #F6F6F6;
	padding: 20px 0px 60px;
	margin: 0;
	}
	footer .footer-content-wrap {
		width: 96%;
		margin: auto;
		text-align: center;
	}
	footer p.footer-logo img {
		width: 120px;
		margin-bottom: 10px;
	}
	footer p.footer-copyright {
		font-size: 11px;
		color: #555;
	}
/* 480px～959px */
@media screen and (min-width: 480px) and (max-width: 959px) { 
footer {
	padding: 30px 0px 70px;
	}
	footer p.footer-logo img {
		width: 150px;
		margin-bottom: 15px;
	}
	footer p.footer-copyright {
		font-size: 12px;
	}
}
/* 960px～ */
@media screen and (min-width: 960px) { 
footer {
	min-width: 1050px;
	overflow: hidden;
	padding: 40px 0px 40px;
	}
	footer .footer-content-wrap {
		min-width: 980px;
		margin: auto;
		text-align: center;
	}
	footer p.footer-logo img {
		width: 160px;
		margin-bottom: 20px;
	}
	footer p.footer-copyright {
		font-size: 12px;
	}
}

/*ページトップ */
#pageTop {
	position: fixed;
	bottom: 10px;
	left: 45%;
	z-index: 99999;
	}
	#pageTop #pagetop-icon {
		display: block;
		border-radius: 50%;
		width: 42px;
		height: 42px;
		background:rgba(0,0,0,0.4);
		text-decoration: none;
		text-align: center;
	}
	#pageTop #pagetop-icon:hover {
		text-decoration: none;
		opacity: 0.7;
	}
	#pagetop-icon::before, #pagetop-icon::after {
		width: 42px;
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		margin: auto;
		content: "";
		vertical-align: middle;
	}
	#pagetop-icon::before {
		width: 42px;
		height: 42px;
		-webkit-border-radius: 50%;
		border-radius: 50%;
		background:rgba(0,0,0,0.4);
	}
	#pagetop-icon::after {
		top: 3px;
		left: 15px;
		width: 9px;
		height: 9px;
		border-top: 3px solid #fff;
		border-right: 3px solid #fff;
		-webkit-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
/* 480px～959px */
@media screen and (min-width: 480px) and (max-width: 959px) { 
#pageTop {
	left: 47%;
	}
	#pageTop #pagetop-icon {
		width: 50px;
		height: 50px;
	}
	#pagetop-icon::before, #pagetop-icon::after {
		width: 50px;
	}
	#pagetop-icon::before {
		width: 50px;
		height: 50px;
	}
	#pagetop-icon::after {
		top: 3px;
		left: 18px;
		width: 11px;
		height: 11px;
	}
}
/* 960px～ */
@media screen and (min-width: 960px) { 
#pageTop {
	left: 93%;
	bottom: 50px;
	}
	#pageTop #pagetop-icon {
		width: 58px;
		height: 58px;
	}
	#pagetop-icon::before, #pagetop-icon::after {
		width: 58px;
	}
	#pagetop-icon::before {
		width: 58px;
		height: 58px;
	}
	#pagetop-icon::after {
		top: 3px;
		left: 21px;
		width: 12px;
		height: 12px;
	}
}

/* 追加 */
#sound_area_001 {
  counter-reset: number 0;
}
#sound_area_002{
  counter-reset: number 10;
}
#sound_area_003{
  counter-reset: number 129;
}

#sound_area_001 h3:after ,#sound_area_002 h3:after ,#sound_area_003 h3:after{
  counter-increment: number 1;
  content: "0" counter(number,decimal-leading-zero) ;
}
#sound_area_003 h3:after{
  counter-increment: number 1;
  content: counter(number,decimal-leading-zero) ;
}
#sound_area_002 h3:nth-child(n+199):after {
    content: counter(number);
}
#list_audio .contents table td.sound_tit{background: #eee;}
