@charset "utf-8";

/* body */
body {
	color:#1a1a1a;
	margin:0px auto;
	padding:200px 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;
	line-height:1.4;
	text-align:justify;
	-webkit-text-size-adjust: 100%;
	text-size-adjust: none;
}

/* コンテンツ */
h1 { font-size:40px; font-weight:bold; margin:20px 10px 40px 10px; text-align:center; }
p { font-size:36px; margin:0px 40px 0px 40px; }
header, footer { max-width:1080px; z-index:99; }
span { font-size:24px; }

.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; }


.dividing_line {
	margin:80px 0px;
	height:10px;
	background-color:#6cc;	
}

.control_bar { text-align:center ; }
.control_bar a {  font-size:32px; font-weight:bold; color:#fff; }
.control_bar a:hover { color:#444; background-color:#fc9; }

audio { width:400px; border:solid #09f; background-color:#09f; }

img { padding-left:15px; }

.utube
{
	display: block ;
	border: ridge 4px #8cf;
	width: 100% ;
	width: 550px ;
	margin: 25px auto 20px auto;
	padding: 10px 0 ;
	border-radius: 20px ;
	color: #fff ;
	font-size: 28px ;
	font-weight: 700 ;
	background-color: #09f ;
	text-align: center ;
	text-decoration: none ;
}

.footer { 
	height:50px;
	font-size:28px;
	font-weight:bold;
	color:white;
	padding:18px;
	text-align:center;
	line-height:40px;
	background-color:#f89;
}

.pp {
	font-family: 'Times New Roman';
	font-weight: bold;
	font-style: italic;
	font-size: 40px;
}


/* 上に戻るボタン 
.pagetop{
  width: 80px;
  height: 80px;
  position: fixed;
  right: 0;
  bottom: 20px;
  opacity: 0.8;
}
.pagetop a{
  width: 80px;
  height: 80px;
  text-decoration: none;
}
.pagetop a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f0aa';
  font-size: 80px;
  color: ForestGreen;
}

/*下に行くボタン 
.pagebottom {
  width: 80px;
  height: 80px;
  position: fixed;
  right: 0;
  top: 180px;
  opacity: 0.8;
}
.pagebottom a{
  width: 80px;
  height: 80px;
  text-decoration: none;
}
.pagebottom a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f0ab';
  font-size: 80px;
  color: blueviolet ;
} */



/********************************************************
					文字点滅
	<span class="blinking">点滅させたい文字</span>
*********************************************************/

.blinking{
	font-size: 28px;
	font-weight: bold;
	color: red;
    -webkit-animation:blink 1.5s ease-in-out infinite alternate;
    -moz-animation:blink 1.5s ease-in-out infinite alternate;
    animation:blink 0.7s ease-in-out infinite alternate;
}

.blinking_h1 {
	font-size: 36px;
	font-weight: bold;
	color: red;
    -webkit-animation:blink 1.5s ease-in-out infinite alternate;
    -moz-animation:blink 1.5s ease-in-out infinite alternate;
    animation:blink 0.7s ease-in-out infinite alternate;
}

@-webkit-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@-moz-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}