@import url("topImage.css");

/*						*/
/*		body			*/
/*						*/

body {
    width: 100%;
    height: 100%;
	font-family:  'Noto Serif JP', serif,  "KozMinPro-Light", "小塚明朝 Pro L", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "メイリオ", Meiryo, serif;
	font-weight: 100;
	font-size:14px;
	color:#333;
	background-image: url(../img/back.svg);	
	background-size:3em;
}



html {
    width: 100%;
    height: 100%;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0 0 0;
	font-weight: 300;
    letter-spacing: 1px;
}

thead th{
	border-bottom:0 !important;
}


h3 {
	font-size:1.2em;
	margin-bottom:0.5em;
	padding-bottom:0.5em;
	border-bottom:1px solid #ddd;
}

h4 {
	font-size:1.2em;
	margin-bottom:0.5em;
}

p{
	line-height:1.8em;
}

.lead{
	font-size:1.2em;
}

i {
	margin-right:0.25em;
}

caption{
	font-size:0.9em;
}

a {
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}

a:hover{
    text-decoration: none;
}

img {
	width:100%;
}




/*						*/
/*		menu			*/
/*						*/
nav{
	z-index:100;
	overflow: hidden;
}

.navbar-custom {
	padding-top: 30px;
	padding-bottom:30px;
	-webkit-transition: background .5s ease-in-out,padding .5s ease-in-out;
	-moz-transition: background .5s ease-in-out,padding .5s ease-in-out;
	transition: background .5s ease-in-out,padding .5s ease-in-out;
}

.top-nav-collapse {
	padding-top: 8px;
	padding-bottom:8px;
	border-bottom: 1px solid #000;
	background: #333;
}



nav .logo{
	display: inline;
	width:300px;
	height:40px;
	text-align:left;
	margin-right:1em;
	color:#fff;
}

.logo h1{
	display: inline;
	font-size:1.2em;
	margin-right:0.3em;
	vertical-align: middle;
}


.logo h2{
	display: inline;
	font-size:2.5em;
	font-weigh:300;
	line-height:1em;
	vertical-align: middle;
}


@media (max-width: 767.98px) {
	.navbar-custom {
		padding-top: 8px;
		padding-bottom:8px;
		border-bottom: 1px solid #000;
		background: #333;
	}

	nav .logo{
		position:absolute;
		text-align:center;	
		left:50%;
		margin-left:-150px;
		top:8px;
	}
	
	.navbar-nav{
		margin-top:1em;
	}
}
@media (max-width: 575.98px) {
	nav .logo{
		top:13px;		
		margin-left:-125px;
	}
	.logo h1{
		font-size:1em;
	}
	.logo h2{
		font-size:2em;
	}
}


/*						*/
/*		main			*/
/*						*/

main a {
	color:#aaa;
}

main a:hover{
	color:#000;
}

main .container{
	background-color:#fff;
}


@media (max-width: 575.98px) {
	main{
		font-size:16px;
	}
}


main h2 {
	font-size:1.5em;
	text-align:right;
	margin-bottom:1em;
	line-height:1.4em;
}

@media (max-width: 767.98px) {
	main h2 {
		line-height:0;
		margin-bottom:1.5em;
		text-align:center;		
	}
}


/*						*/
/*		about			*/
/*						*/

#about{
	background-color:#555;
	color:#fff !important;
	padding-top:6em;
	margin-top:-3.25em;
	padding-bottom:2em;	
	position: relative;
	overflow: hidden;
}

#about .container{
	background-color:#555;
}


#about .row{
	opacity:0.2;
	position: relative;	
	z-index:15;
}

#about img.musou{
	width:155px;
}

#about img.joseikai{
	width:56px;
}

#about hr{
	border-color:#fff;
}


@media (max-width: 767.98px) {
}
@media (max-width: 575.98px) {
	#about{
		padding-bottom:0.5em;
	}

	#about img.musou{
		width:125px;
	}
}


/*						*/
/*		ranai			*/
/*						*/
/*		w96px			*/
/*		h64px			*/
/*		166frame		*/
/*						*/

.ranai{
	display: none;
	position:absolute;
	z-index:10;
	width:100%;
	top:40%;
	margin-top:-320px;
}

.ranai img{
	position:absolute;
	width:960px;
	height:auto;
	left:50%;
	margin-left:-480px;
	animation: move 32s steps(166) infinite;	
}

@keyframes move {
	to {
		margin-top: -106240px;
	}
}

@media (max-width: 1199.98px) { 
	.ranai{
		margin-top:-384px;
	}

	.ranai img{
		width:1152px;
		margin-left:-576px;
	}
	
	@keyframes move {
		to {
			margin-top: -127488px;
		}
	}
}

@media (max-width: 991.98px) {
	.ranai{
		margin-top:-448px;
	}

	.ranai img{
		width:1344px;
		margin-left:-672px;
	}
	
	@keyframes move {
		to {
			margin-top: -148736px;
		}
	}
}

@media (max-width: 767.98px) {
	.ranai{
		margin-top:-480px;
	}
	
	.ranai img{
		width:1440px;
		margin-left:-720px;
	}
	
	@keyframes move {
		to {
			margin-top: -159360px;
		}
	}
}

@media (max-width: 575.98px) {
	.ranai{
	}
}


/*						*/
/*		news: 	;		*/
/*						*/

#news .row{
	padding:1.75em 0 0.75em 0;
	opacity:0.2;
}

/*						*/
/*		admission		*/
/*						*/

#admission .row{
	padding-top:2.75em;
	opacity:0.2;
}

#admission .br{
	display:block;
}

#admission th{
	font-weight:100;
	text-align:right;
	width:40%;
}

#admission .br{
	display:inline;
}

#admission .jodo{
	overflow: hidden;
	height:200px;
}

@media (max-width: 1199.98px) { 
	#admission .jodo{
		height:180px;
	}
}

@media (max-width: 991.98px) {
	#admission .jodo{
		height:160px;
	}
}

@media (max-width: 767.98px) {
	#admission .jodo{
		height:200px;
	}
}

@media (max-width: 575.98px) {
	#admission .jodo{
		height:240px;
	}
}


@media (max-width: 991.98px) {
	#admission .br{
		display:block;
	}
}

@media (max-width: 767.98px) {

	#admission .br{
		display:inline;
	}

	#admission th{
		width:50%;
	}	
}


/*						*/
/*		schedule		*/
/*						*/
#schedule .row{
	padding-top:6em;
	margin-top:-3em;	
	opacity:0.2;
}

#schedule th{
	font-weight: 100;
}
#schedule th:nth-child(1){
	width:7em;
}
#schedule th:nth-child(2){
	width:9em;
}
#schedule th:nth-child(3){
}



@media (max-width: 575.98px) {
	#schedule th:nth-child(1){
		width:4em;
	}
	#schedule th:nth-child(2){
		width:5em;
	}
	#schedule th:nth-child(3){
	}
}


/*						*/
/*		map				*/
/*						*/
#access .row{
	padding-top:6em;
	margin-top:-3em;	
	opacity:0.2;
}


#map {
    width: 100%;
	height: 300px;
	border-top:1px solid #ddd;
	border-bottom:1px solid #ddd;
}

@media (max-width: 767.98px) {

	#access p {
		text-align:center;
	}	
}



/*						*/
/*		contact			*/
/*						*/
#contact .row{
	padding-top:2em;
	opacity:0.2;
}


#contact th{
	font-weight:300;
	width:10em;
}



/*						*/
/*		フッター		*/
/*						*/
footer{
	background-color:#333;
	text-align:center;
	padding-top:1em;
	padding-bottom:1em;
}

footer .link{
	margin-bottom:0.5em;
}

footer .link a{
	color:#fff;
}

footer .link a:hover{
	color:#ccc;
}


footer .copyright{
	color:#fff;
	font-size:0.9em;
}

@media (max-width: 575.98px) {
	footer .link .br{
		display:block;
	}
	
	footer{
		font-size:16px;
		line-height:1.8em;
	}
}