.container {
	width:100%;

}

.header {
	width:100%;
	height: 200px;
/*	position: fixed;*/
	background: #fff;
	padding-top:20px;
}

.header .logo {
	margin:30px auto;
	display: block;
	
}

.header .navi {
	width:340px;
	margin:0 auto;
}

.header .navi li {
	float:left;
	margin-right:20px;
}

.header .navi li a {
	text-decoration: none;
	color:#000;
	font-weight: normal;
	font-size: 15px;
}

.screen {
	width:100%;
	height: 800px;
}


/* ----- 背景用の動画ファイル ----- */
#bg-video{
	position: fixed;
	right: 0;
	bottom: 0;
	min-width: 100%;
	min-height: 100%;
	width: auto;
	height: auto;
	z-index: -100;
	background: url('poster.jpg') no-repeat;
	background-size: cover;
}
/* ----- 背景の上に表示させたいコンテンツ ----- */
.header-title{
	position: relative; /*必ず必要*/
	z-index: 2; /*必ず必要*/
	top: 300px;
	display: flex;
	width: 50%;
	justify-content: center;
	align-items: center;
	text-align:center;
	margin: auto;
}

.header-title p {
	color:#fff;
}

.main {
	width:800px;
	margin:0 auto;
	padding-bottom: 30px;
}

.list-news {
	line-height: 30px;
	font-size: 16px;
}

.col-2 {
	float: left;
}

.footer {
	clear: both;
	width: 100%;
	background:#3F3F3F;
	height: 220px;
}

.inner-footer {
	width:350px;
	margin:0px auto;
	padding:40px 0;
	text-align: center;
}

.inner-footer p {
	color: #fff;
	font-size: 16px;
}

.main-ttl {
	border-bottom:1px solid #ccc;
	padding-bottom: 10px;
	margin-bottom:15px;
	font-size: 24px;
	margin-top:40px;
	font-family: "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
}

.gaiyo-table {
	width: 100%;
	border-top: 1px solid #ccc;
}

.gaiyo-table td,.gaiyo-table th {
border-bottom: 1px solid #ccc;
padding:1% 2%;
	font-size: 16px;
}

.gaiyo-table th {
	background: #e6eaf3;
}

.bnr-l {
	margin-right: 20px;
	margin-bottom: 20px;
}

.bnr-r {
	margin-bottom: 20px;
}

.box {
	background: #344F9B;
	padding:10px;
	float: left;
}

.box p {
	color:#fff;
}

.box-btn {
	color: #fff;
	border:1px solid #fff;
	width:98%;
	display: block;
	text-align: center;
	padding:10px 0;
	text-decoration: none;
	transition: 1.0s ;
}

.box-btn:hover {
	background: #fff;
	color:#344F9B;
	
}

.box-ttl {
	color:#fff;
	border-bottom:1px solid #fff;
	padding-bottom: 5px;
	font-size: 20px;
	font-family: "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
	margin:15px 0;
}

.box-l {
	width:47%;
	margin-right: 1%;
}

.box-r {
	width: 47%;
}

#page-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    font-size: 77%;
}
#page-top a {
    background: #666;
    text-decoration: none;
    color: #fff;
    width: 60px;
    padding: 18px 0;
    text-align: center;
    display: block;
/*    border-radius: 70px;*/
    line-height:18px;
	font-size: 25px;
}
#page-top a:hover {
    text-decoration: none;
    background: #999;
}

.clear {
	clear:both;
}

.article {
	margin:20px 0;
	overflow: hidden;
}

.main-wrap {
	width: 100%;
	background: #fff;
	padding-top:30px;
}


.clone-nav {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 2;
  width: 100%;
  transition: .3s;
  transform: translateY(-100%);
	background: #fff;
	padding:10px 0;
	height: 50px;
}
.is-show {
  transform: translateY(0);
}

.inner-header {
	width:1080px;
	margin:0 auto;
}

 .clone-nav li {
	float:left;
	margin-right:20px;
	 
}

.clone-nav li a {
	line-height: 50px;
	text-decoration: none;
}

.clone-nav .logo {
	float:left;
	width:100px;
	height: auto;
	margin:0px 0;
}

a.scroll {
  padding-top: 60px;
	color:#fff;
	text-decoration: none;
	font-size: 20px;
	transition: 1.0s;
	
}
a.scroll span {
  position: absolute;
  top: 140px;
  left: 50%;
  width: 46px;
  height: 46px;
  margin-left: -23px;
  border: 1px solid #fff;
  border-radius: 100%;
  box-sizing: border-box;
	transition: 1.0s ;
	
}
a.scroll span::after {
  position: absolute;
  top: 50%;
  left: 50%;
  content: '';
  width: 16px;
  height: 16px;
  margin: -12px 0 0 -8px;
  border-left: 1px solid #fff;
  border-bottom: 1px solid #fff;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  box-sizing: border-box;
	transition: 1.0s ;
	animation: fluffy1 3s ease infinite;
}



.copy {
	font-size: 40px;
	display: block;
	font-family: "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
}

.scroll-btn {
	display: block;
}

a.scroll span:hover {
	background: #fff;
	
}

a.scroll span:hover:after{
	border-color: #000;
}


.about-box {
	padding:2%;
	width:45%;
}

.ttl-about {
	font-size:20px;
}

.about-all {
	margin-bottom:40px;
	margin-top:40px;
}




 
/* tablet  */
@media only screen and (max-width: 960px) {
/*ここにtablet用スタイルを記述*/
	
	.screen {
	width:100%;
	height: 500px;
}
	
	.inner-header {
		width:100%;
	}
	
	.header-title {
		top:150px;
	}
	
	.box {
		float: none;
		margin-bottom: 20px;
	}
	
	.box-l {
		width:96%;
		padding:2%;
	}
	
	.box-r {
		width:96%;
		padding:2%;
	}
	
	.article {
		
/*		min-width: 940px;*/
		width:96%;
		margin:2%;
	}
	
	.main {
		width:100%;
	}
	
	#bg-video {
/*width:100%;*/
/*		position: static;*/
/*		min-width: 960px;*/
		/*
		
		top:0px;
		width:100%;
*/
	}
	
	.col-2 {
		width:48%;
	}
	
	.col-2 img {
		width:100%;
	}
	
	.about-all {
		margin-top:60px;
	}

}
 
/* smartPhone */
@media screen and (max-width: 640px) {
/*ここにスマホ用スタイルを記述*/
	
	.header {
		height: 188px;
		padding-top:1px;
	}
	
	.clone-nav {
		height: 55px !important;
		padding-top:20px;
	}

	.clone-nav .navi {
		display:none !important;
	}
	
	.clone-nav .logo {
		margin:0 auto;
		display: block;
		float: none;
	}
	
	.screen {
		height: 400px;
	}
	
	.header-title {
		top:120px;
		width:80%;
	}
	
	a.scroll span {
		top:210px;
	}
	
	
	.col-2 {
		float:none;
		width:100%;
	}
	
	.copy {
		font-size: 26px;
		line-height: 40px;
	}
	
	.inner-header .navi {
	background-color: #fff;
  display: table;
  table-layout: fixed;
  text-align: center;
  width: 100%;
	}
	
	.inner-header .navi li {
		display: table-cell;
  		vertical-align: middle;
		border:1px solid #344F9B;
		float:none;
	}
	
	.inner-header .navi li:nth-child(1){
		border-left:0px;
		border-right: 0px;
		border-bottom:0px;
	}
	
	.inner-header .navi li:nth-child(2) {
		border-right: 0px;
		border-bottom:0px;
	}
	
	.inner-header .navi li:nth-child(3) {
		border-right: 0px;
		border-bottom:0px;
	}
	
		.inner-header .navi li:nth-child(4){
		border-right:0px;
			border-bottom:0px;
	}
	
	.inner-header .navi li a {
		color: #344F9B;
  display: block;
  font-size: 12px;
  text-decoration: none;
  padding: 10px 0;
		font-weight: bold;
	}
	
	.inner-footer p {
		font-size: 12px;
	}
	
	
}