@charset "UTF-8";



@font-face{
	font-family: yanonr;
	src: url('/fonts/fontr.ttf');
	font-style: normal;
	font-weight: normal;
}

@font-face{
	font-family: yanonb;
	src: url('/fonts/fontb.ttf');
	font-style: normal;
	font-weight: bold;
}



*{
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

body{
	background-color: #E8E8E8;
	background-image: url('/syspic/bg1.png');
	color: #000000;
	margin: 0;
	padding: 0;
	font-family: Arial;
	width:100%;
}

h4{
	display:block;
	font-family: yanonr;
	font-size: 1.4em;
	letter-spacing: 3px;
	font-weight:normal;
	margin-top:0px;
	margin-bottom:16px;
	color: #000000;
	text-align:center;
}

h5{
	display:block;
	font-family: yanonb;
	font-size: 2em;
	color: #3465A4;
	margin:0;
	padding:0;
}

h6{
	display:inline-block;
	font-family: yanonb;
	font-size: 2em;
	color: #3465A4;
	margin:0;
	padding:0;
}

.xlink{
	font-size: x-large;
	font-weight: bold;
	font-family: yanonb;
	text-decoration: none;
	color: #3465A4;
	padding-left: 4px;
	padding-right: 4px;
}

.xlink:hover {
	background-color: #3465A4;
	color: #FFFFFF;
}

.bull{
	font-size: 1.4em;
	color: #3465A4;
	margin:0;
	padding:0;
}

.table {
	display: table;
	width: 100%;
	max-width: 1400px;
	margin: 0 auto;
	border-collapse: separate;
	border-spacing: 20px;
}

.row {
	display: table-row;
	padding: 0px;
	margin: 0px;
}

.cell {
	display: table-cell;
	padding: 20px;
	width: 50%;
	overflow:hidden;
	background-color: #DDDDDD;
	text-decoration: none;
}

.cell > h1{
	font-family: yanonb;
	font-size: 3.4em;
	font-weight:bold;
	margin-top:16px;
	margin-bottom:16px;
	color: #3465A4;
}

.cell > h2{
	font-family: yanonr;
	font-size: 2.2em;
	font-weight:normal;
	margin-top:16px;
	margin-bottom:16px;
	color: #000000;
}

.cell > h3{
	font-family: Arial;
	font-size: 1.2em;
	font-weight:normal;
	margin-top:16px;
	margin-bottom:16px;
	color: #000000;
}

.cell:hover {
	background-color: #3465A4;
}

.cell:hover > h1{
	color: #FFFFFF;
}

.cell:hover > h2{
	color: #FFFFFF;
}

.cell:hover > h3{
	color: #FFFFFF;
}

.cellnc {
	display: table-cell;
	padding: 0px;
	width: 50%;
	overflow:hidden;
	background-color: #DDDDDD;
	text-decoration: none;
}

.cellnc > h3{
	font-weight:normal;
}

.cell .cellnc{
	color: #000000;
}

.cell:hover .cellnc{
	background-color: #3465A4;
	color: #FFFFFF;
}

.cella {
	display: table-cell;
	padding: 20px;
	width: 50%;
	overflow:hidden;
	text-decoration: none;
	vertical-align:top;
	text-align:right;
}

.cellb {
	display: table-cell;
	padding: 20px;
	width: 50%;
	overflow:hidden;
	text-decoration: none;
	vertical-align:top;
	text-align:left;
}

.cella img {
	display:inline-block;
	border:4px solid #3465A4;
	max-width:300px;
}

.cellc {
	display: table-cell;
	padding: 0px;
	width: 50%;
	overflow:hidden;
	text-decoration: none;
	vertical-align:top;
	text-align:left;
}



.menu {
	display: inline-block;
	padding: 4px;
	text-decoration: none;
}

.menu > h1{
	font-family: yanonr;
	font-size: 1.6em;
	font-weight:normal;
	margin:4px;
	color: #3465A4;
}

.menu:hover {
	background-color: #3465A4;
}

.menu:hover > h1{
	color: #FFFFFF;
}

.menuddd {
	display: none;
	background-color: #E8E8E8;
	background-image: url('/syspic/bg1.png');
	text-align: left;
	position: absolute;
	margin-left: -4px;
	min-width: 160px;
	border: 4px solid #3465A4;
	box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
	z-index: 1;
}

.menudd {
	display: inline-block;
	padding: 4px;
	text-decoration: none;
}

.menuddl {
	display: block;
	text-decoration: none;
	font-family: yanonr;
	font-size: 1.6em;
	font-weight:normal;
	padding:10px;
	padding-top:4px;
	padding-bottom:4px;
	color: #3465A4;
}

.menuddl:hover {
	background-color: #3465A4;
	color: #FFFFFF;
}

.menudd > a {
	text-decoration: none;
}

.menudd > a > h1 {
	font-family: yanonr;
	font-size: 1.6em;
	font-weight:normal;
	margin:4px;
	color: #3465A4;
}

.menudd:hover {
	background-color: #3465A4;
}

.menudd:hover > a > h1 {
	color: #FFFFFF;
}

.menudd:hover > .menuddd {
	display: block;
}




.headdist {
	padding-top:30px;
}





@media screen and (min-width: 1100px) and (max-width: 1200px){
	.cell > h1{font-size: 3em;}
	.cell > h2{font-size: 1.8em;}
	.cell > h3{font-size: 1.4em;}
	.cellnc > h3{font-size: 1.4em;}
}

@media screen and (min-width: 1000px) and (max-width: 1100px){
	.cell > h1{font-size: 2.7em;}
	.cell > h2{font-size: 1.6em;}
	.cell > h3{font-size: 1.2em;}
	.cellnc > h3{font-size: 1.2em;}
}

@media screen and (min-width: 800px) and (max-width: 1000px){
	.cell > h1{font-size: 2.2em;margin-top:10px;margin-bottom:10px;}
	.cell > h2{font-size: 1.3em;margin-top:10px;margin-bottom:10px;}
	.cell > h3{font-size: 1.1em;margin-top:10px;margin-bottom:10px;}
	.cellnc > h3{font-size: 1.1em;margin-top:10px;margin-bottom:10px;}
	.headdist {padding-top:0px;}
}

@media screen and (min-width: 700px) and (max-width: 800px){
	.cell > h1{font-size: 2em;margin-top:8px;margin-bottom:8px;}
	.cell > h2{font-size: 1.2em;margin-top:8px;margin-bottom:8px;}
	.cell > h3{font-size: 1.0em;margin-top:8px;margin-bottom:8px;}
	.cellnc > h3{font-size: 1.0em;margin-top:8px;margin-bottom:8px;}
	.headdist {padding-top:0px;}
}

@media screen and (min-width: 630px) and (max-width: 700px){
	.cell > h1{font-size: 2em;margin-top:4px;margin-bottom:4px;}
	.cell > h2{font-size: 1em;margin-top:4px;margin-bottom:4px;}
	.cell > h3{font-size: 0.8em;margin-top:4px;margin-bottom:4px;}
	.cellnc > h3{font-size: 0.8em;margin-top:4px;margin-bottom:4px;}
	.headdist {padding-top:0px;}
}

@media screen and (min-width: 560px) and (max-width: 630px){
	.cell > h1{font-size: 3em;margin-top:10px;margin-bottom:10px;}
	.cell > h2{font-size: 2em;margin-top:10px;margin-bottom:10px;}
	.cell > h3{font-size: 1.5em;margin-top:10px;margin-bottom:10px;}
	.cellnc > h3{font-size: 1.5em;margin-top:10px;margin-bottom:10px;}
	.headdist {padding-top:0px;}
	.table {
		display: block;
		border-spacing: 0px;
		padding: 0px;
		margin: 0px;
	}
	.row {
		display: block;
	}
	.cell, .cella, .cellb, .cellnc {
		display: block;
		padding: 4px;
		padding-left: 20px;
		padding-right: 20px;
		margin:10px;
		width: calc(100% - 20px);
	}
	.cellnc {
		display: block;
		padding: 0px;
		margin:0px;
	}
	.cellnc > h3{
		margin:0px;
	}
	.cella{
		text-align:center;
		padding-top:30px;
	}
	.cellb{
		border-bottom:6px solid #3465A4;
		padding-bottom:30px;
	}
	.cella img {
		max-width:300px;
	}
}

@media screen and (min-width: 400px) and (max-width: 560px){
	.menu > h1{font-size: 1.4em;}
	.menudd > a > h1 {font-size: 1.4em;}
	.cell > h1{font-size: 2em;margin-top:8px;margin-bottom:8px;}
	.cell > h2{font-size: 1.4em;margin-top:8px;margin-bottom:8px;}
	.cell > h3{font-size: 1.2em;margin-top:8px;margin-bottom:8px;}
	.cellnc > h3{font-size: 1.2em;margin-top:8px;margin-bottom:8px;}
	.headdist {padding-top:0px;}
	.table {
		display: block;
		border-spacing: 0px;
		padding: 0px;
		margin: 0px;
	}
	.row {
		display: block;
	}
	.cell, .cella, .cellb, .cellnc {
		display: block;
		padding: 4px;
		padding-left: 20px;
		padding-right: 20px;
		margin:10px;
		width: calc(100% - 20px);
	}
	.cellnc {
		display: block;
		padding: 0px;
		margin:0px;
	}
	.cellnc > h3{
		margin:0px;
	}
	.cella{
		text-align:center;
		padding-top:30px;
	}
	.cellb{
		border-bottom:6px solid #3465A4;
		padding-bottom:30px;
	}
	.cella img {
		max-width:300px;
	}
}

@media screen and (max-width: 400px){
	.menu > h1{font-size: 1.2em;}
	.menudd > a > h1 {font-size: 1.2em;}
	.cell > h1{font-size: 1.8em;margin-top:4px;margin-bottom:4px;}
	.cell > h2{font-size: 1em;margin-top:4px;margin-bottom:4px;}
	.cell > h3{font-size: 0.8em;margin-top:4px;margin-bottom:4px;}
	.cellnc > h3{font-size: 0.8em;margin-top:4px;margin-bottom:4px;}
	.headdist {padding-top:0px;}
	.table {
		display: block;
		border-spacing: 0px;
		padding: 0px;
		margin: 0px;
	}
	.row {
		display: block;
	}
	.cell, .cella, .cellb, .cellnc {
		display: block;
		padding: 4px;
		padding-left: 20px;
		padding-right: 20px;
		margin:10px;
		width: calc(100% - 20px);
	}
	.cellnc {
		display: block;
		padding: 0px;
		margin:0px;
	}
	.cellnc > h3{
		margin:0px;
	}
	.cella{
		text-align:center;
		padding-top:30px;
	}
	.cellb{
		border-bottom:6px solid #3465A4;
		padding-bottom:30px;
	}
	.cella img {
		max-width:200px;
	}
}