@charset "utf-8";
/* CSS Document */

html {
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:16px;
	line-height:1.5;
}

body {
	margin:0 auto;
}
img {
	max-width:100%;
}

#contents {
	margin:0 auto;
}
ul li {
	list-style:none;
}
li{
	padding-left:50px;
}
//マージンとパディングをリセット
*{ margin: 0;padding: 0}
//テキストデコレーションをなしにする
a { text-decoration : none}
//リストスタイルを初期化
ul, ol { list-style : none}
//ディセンダ―を削除
img { vertical-align : middle}

//イメージの表示
img { max-width : 100%}

h1 {
font-size : 3em; /* 48px */
line-height : 1; /* 48px */
margin-bottom : 0.5em;
color:#0000FF;
} 

h2 {
font-size : 2.25em; /* 36px */
line-height : 1.3333; /* 48px */
margin-bottom : 0.6667em;
} 

h3 {
font-size : 1.5em; /* 24px */
line-height : 1; /* 24px */
margin-bottom : 1em;
text-align:center;
color:#899082;
}

p.situmon{
	color:#0000FF;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:22px;
	margin-left:32px;
	line-height:150%;
	text-indent:-2em;
}
p.kaito{
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:22px;
	margin-left:32px;
	line-height:150%;
	text-indent:-2em;
}

hgroup h2,h4,h5,h6 {
font-size : 1em; /* 16px */
line-height : 1.5; /* 24px */
margin-bottom : 1.5em;
}

/* @group Header */

header { 
text-align : center;
padding-top : 1.5em;
background : #211f1f}

header h1 { margin-bottom : 0.5em}
header h2 { color : #fff}

/* @end */

#youtube {
	width: 75%; 
	margin: 0 auto;
	padding-top:20px;
}

.movie {
    position: relative;
    height: 0;
    padding-top: 56.25%; /* 16:9 */
}

iframe {
    height: 100%;
    position: absolute;
    left:0;
    top:0;
    width:100%;
}
table.tb1{
	margin:0 auto;
}
/*ボタンホバー*/
.button{
	display: inline-block;
	width: 200px;
	height: 54px;
	text-align: center;
	text-decoration: none;
	line-height: 54px;
	outline: none;
	background-color: #333;
	color: #fff;
	font-weight:bold;

}
.button:hover {
	background-color: #59b1eb;
	text-decoration: none;
}
.button::before,
.button::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.button,
.button::before,
.button::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
}



/* COLOR */
.ao{ color:#0000FF }	/* blue */
.aka{ color:#FF0000 }	/* red */
.ki{ color:#FF0000 }	/* yellow */
.midori{ color:#008000 }	/* green */
.gin{ color:#C0C0C0 }	/* silver */
.hai{ color:#808080 }	/* gray */
.kuri{ color:#800000 }	/* maroon */
.sora{ color:#000FFF }	/* aqua */
.murasaki{ color:#800080 }	/* purple */
.kon{ color:#000080 }	/* navy */

/* PC用 */
@media only screen and (min-width: 960px){
	
	#contents{
	width:960px;
	margin:0 auto;
	padding:0;
}
}


/* タブレット */
@media only screen and (max-width:959px){
	
	#contents{
	width:95%;
	margin:0 auto;
	padding:0;
}
h1 {
	font-size:2.3em;
}
h2 {
	font-size:1.9em;
}
h3 {
	font-size:1.5em;
}



/* スマートフォン 横(ランドスケープ) */
@media only screen and (max-width:640px){
	li{
	padding-left:0px;
	font-size:1em;
}
p.situmon{
	font-size:1em;
}
p.kaito{
	font-size:1em;
}

}


/* スマートフォン 縦(ポートレート) */
@media only screen and (max-width:480px){

html {
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:0.8em;
	line-height:1.5;
}
h1 {
	font-size:2em;
}
h2 {
	font-size:1.6em;
}
h3 {
	font-size:1.2em;
}


}

