﻿/*base.css*/

/** Struct **/

body{
	font-family : "verdana","serif","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","ＭＳ Ｐゴシック","sans-serif";
	font-size : 12px;
	background : url(../img/back.gif) fixed repeat;
	margin : 12px auto 16px;
	padding : 0px;
}

#header{
	width : 900px;
	background-color : #ffffff;
	margin : 0px auto;
	padding : 5px;
	border : solid 1px #eeeeee;
	border-bottom : none;
	text-align:center;
}

#content{
	width : 900px;
	margin : 0px auto;
	padding : 5px;
	background-color : #ffffff;
	border : solid 1px #eeeeee;
	clear : right;
}

.main {
	width : 640px;
	float : right;
	background-color : #ffffff;
}

.menu{
	width : 240px;
	float : left;
	background-color : #ffffff;
}

.navi{
	width : 900px;
	clear : both;
	text-align : right;
}

#footer{
	width : 900px;
	height : 100px;
	margin : 10px auto 10px auto;
	text-align : center;
	background-color : #fcfcfc;
	border : solid 1px #eeeeee;
	border-top : none;
	padding : 5px;
	color : #aaaaaa;
}

@media screen and (max-width:736px)
{

#header {
    width : auto;
	clear : both;
}

#content {
    width : 100%;
	clear : both;
}

.main {
    width : 100%;
	clear : both;
}

.menu {
    width : auto;
	clear : both;
}

.navi {
    width : auto;
	clear : both;

}

#footer {
    width : auto;
	clear : both;
}

}

/** link **/
a{
	text-decoration : none;
	color : #6495ed;
}

a:hover{
	color : #ff6347;
}

div{
	margin:0px;
	padding:0px;
}

img{
	border : 0px;
}

/** table **/

table{
	margin-left: 10px;
}
td{
	padding-right : 2px;
	padding-left : 2px;
}

/** Header **/
h1{
	color : #aaaaaa;
	text-align:center;
	font-size : 8px;
	font-weight:normal;
	margin: 0px;
}
#header h1{
	text-align:left;
	font-size :24px;
	font-weight:normal;
	margin : 0px;
}

@media only screen and (max-width:736px)
{ 

#header img{
    width : 100%;
}

}

/** Main **/

.main h2{
	/*text*/
	text-align : left;

	/*font*/
	font-family : verdana;
	color : #666666;
	font-size : 32px;
	font-weight : normal;

	/*margin*/
	margin : 0px 0px 20px 0px;

	/*padding*/
	padding : 10px;

	/*border*/
	border-left : solid 20px #cccccc;
	border-top : solid 3px #cccccc;
	/*background-color : #f5fffa;*/
}

.main h3{
	/*font*/
	font-weight : normal;
	font-size : 16px;

	/*margin*/
	margin-top : 30px;

	/*border*/
	border-bottom : solid 1px #cccccc;
}

.main h4{
	/*font*/
	font-weight : normal;
	font-size : 12px;

	/*margin*/
	margin-top:10px;

	/*border*/
	border-bottom : dashed 1px #cccccc;

}
.main ul{
	/*margin*/
	margin : 20px 0px 30px 0px;

	/*padding*/
	padding : 0px;

	/*list*/
	list-style-type:none;
}

.main li{
	/*font*/
	font-size: 20px;
	font-weight : normal;

	/*margin*/
	margin : 8px 0px;

	/*border*/
	border-bottom : dotted #cccccc 2px;

	/*padding*/
	padding-left : 10px;
}

.main img{

}

.news {
    border: solid 1px #cccccc;
    position: relative;
    border-radius: 8px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    margin-top: 1em;
    padding: 0.5em;
}
.news h4 {
    position: absolute;
    top: -0.5em;
    left: 1em;
    margin: 0;
    padding: 0 0.5em;
    color: #000000;
    font-weight: normal;
    background-color:#ffffff;
	font-weight : normal;
	font-size : 12px;
}


p {
	margin-left : 10px;
	font-size : 12px;
}

@media only screen and (max-width:736px)
{

.main h2 {
    font-size: 16px;
}

.main h3 {
    font-size : 16px;
}

.main img{
    width : 100%;
}

p {
	margin-left : 5px;
	font-size : 16px;
}

.news h4 {
    font-size : 16px;
}


}

/** Menu **/

.menu{
	font-family : "verdana","serif","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","ＭＳ Ｐゴシック","sans-serif";
}

.menu h2{
	height : 30px;
	margin-top : 15px;
	padding-right : 10px;
	background-color : #ffffff;
	border-bottom:solid 1px #cccccc;
	text-align : right;
	color : #666666;
	font-size : 24px;
	font-weight : normal;
    font-family : "verdana","serif","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","ＭＳ Ｐゴシック","sans-serif";
}

.menu h3 {
	font-family : "verdana","serif","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","ＭＳ Ｐゴシック","sans-serif";
    font-size : 12px;
	font-weight : normal;
}

.menu ul{
	/*margin*/
	margin : 20px 0px 30px 0px;

	/*padding*/
	padding : 0px;

	/*list*/
	list-style-type:none;
}

.menu li{
	height : 16px;
	width : 160px;
	
	/*font*/
	font-size: 16px;
	font-weight : normal;

	/*margin*/
	margin : 8px 0px;

	/*border*/
	border-bottom : dotted #cccccc 1px;

	/*padding*/
	padding-left : 20px;
}

@media only screen and (max-width:736px)
{

.menu li {
	width : auto;
	height : 24px;
	font-size: 24px;
}

}

@media only screen and (max-width:736px)
{

/** Video **/
.video {
position: relative;
height: 0;
padding: 30px 0 56.25%;
overflow: hidden;
}

.video iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

}

 
