@charset "utf-8";

@media print { /* 紙媒体向けスタイル定義 */
html {
	color: #000;
}
/* --BODY-- */
body {
	margin: 0;
	padding: 0;
	text-align: center;
}
}


#div_movie {
	position: absolute;
	width: 100%;
	height: 100%;
}

html {
	overflow-y: scroll;
}
body {
	margin: 0;
	padding: 0;
	text-align: center;
}
#video-background {
/*  動画を背景に設定するスタイルシート  */
  position: fixed;
  right: 0; 
  bottom: 0;
  min-width: 100%; 
  min-height: 100%;
  width: auto; 
  height: auto;
  z-index: -100;
}
ul {
	list-style: none;
}
blockquote, dd, div, dl, dt, h1, h2, h3, h4, h5, h6, li, ol, p, pre, span, td, th, ul {
	margin: 0;
	padding: 0;
}
 @import "html5reset";
/*---------------------------------------------------------
　　フォント
---------------------------------------------------------*/

body, table {
	font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "ＭＳ Ｐゴシック", "MS P Gothic", Verdana, Arial, Helvetica, sans-serif;
	font: 14px/1.5;
	font-size: 14px; /* modern browser */
 *font-size: medium; /* IE 7 */
 *font: small; /* IE 6 */
	background: #fff;
}
code, kbd, pre, samp, tt {
	font-family: monospace;
	line-height: 100%;
}
/* for IE7 */
*+html code, kbd, pre, samp, tt {
	font-size: 108%;
}
h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	font-weight: normal;
}
/*---------------------------------------------------------
　　基本スタイル
---------------------------------------------------------*/

* {
	color: #0d283a;
	box-sizing: border-box;
}
p {
	line-height: 1.8em;
	text-align: left;
}
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
/*---------------------------------------------------------
　　共通
---------------------------------------------------------*/

section {
	margin: 0;
}
.txt {
	margin: 0 0 20px 0;
	text-align: left;
	line-height: 1.6em;
}
.txt-c {
	margin: 0 0 20px 0;
	text-align: center;
	line-height: 1.6em;
}
ul.ul1 {
	margin: 0 auto 20px 2em;
	list-style-image: url(../images/list_mark1.png);
}
.ul1 li {
	margin: 0 0 5px 0;
	text-align: left;
	line-height: 1.4em;
}
.img-c {
	margin: 0 0 30px 0;
	text-align: center;
}
.img-c img {
	max-width: 100%;
}
.position-r {
	text-align: right;
}
.position-l {
	text-align: left;
}
.position-c {
	text-align: center;
}
.waku {
	border: 1px solid #ccc;
}
.mt10 {
	margin-top: 10px;
}
.mt30 {
	margin-top: 30px;
}
.mb0 {
	margin-bottom: 0;
}
.mb10 {
	margin-bottom: 10px;
}
.mb20 {
	margin-bottom: 20px;
}
.mb30 {
	margin-bottom: 30px;
}
.mb50 {
	margin-bottom: 50px;
}
.mb70 {
	margin-bottom: 70px;
}
.pt0 {
	padding-top: 0 !important;
}
.pt30 {
	padding-top: 30px;
}
.pb20 {
	padding-bottom: 20px;
}
.pb50 {
	padding-bottom: 50px;
}
.rad5 {
	border-radius: 5px;
	-moz-border-radius: 5px;
}
.rad10 {
	border-radius: 10px;
	-moz-border-radius: 10px;
}
.float-r {
	float: right;
	margin: 0 0 20px 20px;
	text-align: right;
}
.float-l {
	float: left;
	margin: 0 20px 20px 0;
	text-align: left;
}
hr {
	margin: 0;
	padding: 20px 0;
	height: 1px;
	border: none;
	border-top: 1px #ccc solid;
}
.red {
	color: #f00;
}
.pc-tab {
	display: none;
}
.tab {
	display: none;
}

/* タブレット */
@media only screen and (min-width: 546px) {
.sp {
	display: none;
}
.pc-tab {
	display: block;
}
.tab {
	display: block;
}
}

/* PC */
@media only screen and (min-width: 1000px) {
.tab {
	display: none;
}
}
/*---------------------------------------------------------
　　リンク
---------------------------------------------------------*/

a:link {
	color: #07d;
	text-decoration: underline;
}
a:visited {
	color: #07d;
	text-decoration: underline;
}
a:active {
	color: #3af;
	background: none;
	text-decoration: underline;
}
a:hover {
	color: #3af;
	background: none;
	text-decoration: underline;
}
a img, img {
	border: 0;
	margin: 0;
	padding: 0;
	vertical-align: bottom;
}
a:hover img {
	filter: alpha(opacity=70);
	opacity: 0.7;
	background: #fff;
}
/*---------------------------------------------------------
　　ヘッダ
---------------------------------------------------------*/

header {
	height: 100px;
	text-align: center;
	background: url(../images/bg_header.png) 50% 0 no-repeat;
	background-size: 100% 100px;
}
#header {
	margin: 0 auto;
	width: 95%;
	overflow: hidden;
}
#header-logo {
	text-align: center;
}
#header-logo img {
	width: 70%;
}
#hmenu1 {
	display: none;
}
#nav {
	width: 100%;
	padding: 0;
	text-align: center;
}
#nav ul {
	position: absolute;
	top: -300px;
	left: 0;
	width: 100%;
	-webkit-transition: .5s ease-in-out;
	-moz-transition: .5s ease-in-out;
	-o-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
	text-align: left;
	overflow: hidden;
}
#nav ul li {
	width: 100%;
}
#nav ul li a {
	display: block;
	width: 100%;
	padding: 10px 0;
	color: #fff;
	font-weight: bold;
	text-decoration: none;
	text-align: center;
	border-bottom: 1px solid #dff;
	background: url(../images/list_mark3.png) no-repeat 98% 50% #0d283a;
	background-size: 15px;
	opacity: .8;
}
#nav ul li a:hover, #nav ul li a.active {
	color: #0d283a;
	background: url(../images/list_mark2.png) no-repeat 98% 50% #dff;
	background-size: 15px;
	border-bottom: 1px solid #0d283a;
}
#nav ul li:first-child a {
	border-top: 1px solid #dff;
}
#nav ul li img {
	display: none;
}
/* Toggle Button */
#navToggle {
	position: absolute;
	margin: 0 0 0 auto;
	top: 10px;
	right: 10px;
	cursor: pointer;
}
#navToggle div {
	width: 40px;
	height: 40px;
	position: relative;
}
#navToggle span {
	display: block;
	position: absolute;
	left: 10px;
	width: 20px;
	border-bottom: solid 3px #fff;
	-webkit-transition: .35s ease-in-out;
	-moz-transition: .35s ease-in-out;
	transition: .35s ease-in-out;
}
#navToggle span:nth-child(1) {
	top: 10px;
}
#navToggle span:nth-child(2) {
	top: 18px;
}
#navToggle span:nth-child(3) {
	top: 26px;
}
/* Click Toggle Button */
.openNav #navToggle span:nth-child(1) {
	top: 18px;
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
.openNav #navToggle span:nth-child(2) {
	display: none;
}
.openNav #navToggle span:nth-child(3) {
	top: 18px;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	transform: rotate(45deg);
}
.openNav ul {
	-moz-transform: translateY(380px);
	-webkit-transform: translateY(380px);
	transform: translateY(380px);
	z-index: 9999;
}

/* タブレット */
@media only screen and (min-width: 545px) {
header {
	height: 112px;
	text-align: center;
	background: url(../images/bg_header.png) 50% 0 no-repeat;
	background-size: 100% 112px;
}
#header-logo {
	float: left;
	width: 37%;
	text-align: left;
	vertical-align: top;
}
#header-logo img {
	width: 100%;
}
#header-link {
	float: right;
	width: 60%;
	text-align: right;
	vertical-align: top;
}
#hmenu1 {
	display: block;
	padding-top: 10px;
	text-align: right;
}
#hmenu1 li {
	display: inline-block;
	border-right: 1px solid #fff;
}
#hmenu1 li:first-child {
	border-left: 1px solid #fff;
}
#hmenu1 a {
	display: block;
	padding: 0 2em;
	color: #fff;
	font-size: 80%;
	text-decoration: none;
}
#hmenu1 a:hover {
	text-decoration: underline;
}
#nav {
	padding-bottom: 10px;
	width: auto;
	float: right;
}
#nav ul {
	width: 100%;
	position: static;
	overflow: hidden;
	padding: 10px 0 0 0;
	display: block;
	text-align: right;
	-webkit-transition: none;
	-moz-transition: none;
	-o-transition: none;
	transition: none;
}
#nav ul li {
	width: auto;
	font-size: 93%;
	padding: 0 0 0 2em;
	display: inline-block;
	border: 0;
}
#nav ul li:first-child {
	padding: 0;
}
#nav ul li.sp {
	display: none;
}
#nav ul li a {
	display: block;
	padding: 0;
	color: #fff;
	font-size: 120%;
	font-weight: bold;
	background: none;
	border: 0;
}
#nav ul li a:hover, #nav ul li a.active {
	color: #fff;
	background: none;
	text-decoration: underline;
}
#nav ul li:first-child a {
	border-top: 0;
}
#navToggle {
	display: none;
}
}

/* PC */
@media only screen and (min-width: 1000px) {
#header {
	width: 1000px;
}
#header-logo img {
	width: 370px;
}
#nav {
	padding-bottom: 0;
}
#nav ul {
	margin: 0 0 0 auto;
	width: 1000px;
}
}
/*---------------------------------------------------------
　　トップページ
---------------------------------------------------------*/

#top-main {
	min-width: 100%;
	height: auto;
	/*	background: #0d283a url(../video/video.jpg) no-repeat;*/
	background-size: 100%;
	text-align: center;/*background: url(../images/bg_top_img.jpg) 50% 0 no-repeat #476763;
	background-size: cover;*/
}

video {
    position: fixed;
    right: 0;
    bottom: 0;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
		background: #0d283a;
    background-size: cover;
}

.wrap {
	margin: 30px auto 0 auto;
	width: 90%;
}
#top-message {
	margin: 0 0 20px 0;
	text-align: center;
}
#top-message img {
	max-width: 100%;
}
#top-newsarea {
	margin: 0 auto;
	padding: 0 0 40px 0;
	background: url(../images/triangle.png) 50% 0 no-repeat;
	background-size: 120px;
	opacity: .8;
}
#top-newsarea h1 {
	margin: 0;
	padding: 0;
	height: 50px;
	line-height: 50px;
	text-align: center;
	color: #fff;
	font-weight: bold;
	font-size: 120%;
}
#top-newsarea dl {
	margin: 0 0 10px;
	font-size: 90%;
	background-color: rgba(255,255,255,.8);
}
#top-newsarea dl dt {
	margin: 0;
	padding: 8px 8px 8px 15px;
	clear: left;
	float: left;
	color: #0d283a;
	font-weight: bold;
	line-height: 1.5em;
	text-align: left;
}
#top-newsarea dl dd {
	margin: 0;
	padding: 8px 8px 8px 9em;
	line-height: 1.5em;
	text-align: left;
}
#top-newsarea dd:nth-of-type(even) {
	background-color: rgba(129,146,153,.8);
}
#top-movie {
	width: 100%;
	margin: auto;
	padding: 0 0 50px 0;
}
.movie_box {
	position: relative;
	width: 100%;
    padding-top: 55.8%;
    background: #ccc;
    overflow: hidden;
    z-index: 3;
	margin: auto;
	box-shadow: 0 0 20px rgba(255,255,255,.4);
    /* border: solid 1px #eee; */
}
.movie_box iframe {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
}
#top-menu {
	overflow: hidden;
}
#top-menu1 img, #top-menu2 img {
	width: 100%;
}

/* タブレット */
@media only screen and (min-width: 546px) {
.wrap {
	margin: 40px auto 0 auto;
}
#top-message {
	text-align: left;
}
#top-newsarea {
	background-size: 180px;
}
#top-newsarea h1 {
	height: 70px;
	line-height: 70px;
	font-size: 150%;
}
#top-newsarea dl {
	font-size: 100%;
}
#top-newsarea dl dt {
	width: 8em;
	margin: 0;
	padding: 8px 8px 8px 15px;
	clear: left;
	float: left;
	color: #0d283a;
	font-weight: bold;
	line-height: 1.5em;
	text-align: left;
}
#top-newsarea dl dd {
	margin: 0;
	padding: 8px 8px 8px 9em;
	line-height: 1.5em;
	text-align: left;
}
#top-menu1 {
	float: left;
	width: 100%;
}
#top-menu2 {
	float: right;
	width: 50%;
}
}

/* PC */
@media only screen and (min-width: 1000px) {
.wrap {
	width: 1000px;
}
#top-newsarea {
	width: 80%;
	padding: 0 0 60px 0;
}
#top-movie {
	width: 80%;
	padding: 0 0 100px 0;
}
}
/*---------------------------------------------------------
　　フッタ
---------------------------------------------------------*/

/* ページトップ */
#pagetop {
	width: 40px;
	height: 40px;
	padding: 0;
	background: rgba(13,40,58,0.8);
	position: fixed;
	bottom: 15px;
	right: 15px;
	text-align: center;
	z-index: 1000;
	border-radius: 5px;
	-moz-border-radius: 5px;
}
#pagetop img {
	width: 100%;
	height: auto;
}
#pagetop a:hover img {
	filter: alpha(opacity=60);
	opacity: 0.6;
	background: none;
}

.mds {
	font-size: 133%;
	color: #07d;
	text-shadow: 1px 1px 2px #666;
}

#footer {
	background: #f7f7f7;
	text-align: center;
}
#footer-main {
	margin: 0 auto;
	padding: 20px 0;
	width: 95%;
	text-align: center;
	overflow: hidden;
}
#footer-copy {
	margin: 0 0 10px 0;
	text-align: center;
	font-size: 80%;
	font-family: Arial, Helvetica, sans-serif;
}
#footer-link {
	font-size: 80%;
	text-align: center;
	color: #999;
}
#footer-link a {
	color: #333;
	text-decoration: none;
}
#footer-link a:hover {
	text-decoration: underline;
}

footer {
	background: #f7f7f7;
}

/* タブレット */
@media only screen and (min-width: 546px) {
#pagetop {
	width: 55px;
	height: 55px;
}
#footer-main {
	padding: 40px 0 20px 0;
}
#footer-copy {
	margin: 0;
	text-align: left;
	width: 50%;
	font-size: 90%;
	float: left;
}
#footer-link {
	margin: 0;
	text-align: right;
	width: 50%;
	font-size: 90%;
	float: right;
}
}

/* PC */
@media only screen and (min-width: 1000px) {
#pagetop {
	width: 70px;
	height: 70px;
}
#footer-main {
	width: 1000px;
}
}