﻿@charset "UTF-8";

/* ▼▼▼ トップ
=====================================*/
section {
	border: none;
	padding-top: 20px;
	margin-bottom: 20px;
	}
#mainVisual {
	background: url(../img/main_bg.png)no-repeat 0 -29vw;
	background-size: cover;
	padding: 20px 0 ;
	}
	#mainVisual::after {
	height: 75%;
	padding-top: 60px;
	}
	#mainVisual > .container {
		margin-bottom: 0;
		}
#main::before {
	content: none!important;
	}
	#main.container {
		max-width: 720px;
		}
/* nav  */
	.nav ul {
		max-width: 1000px;
		}
		.nav ul li{
			width: 13%;
			}
			 .nav  ul li a, .nav ul li.library a {
				padding-top: 5px;
				font-size: 15px;
				}
				 .nav  ul li img, .nav ul li.library img {
					display: block;
					width: 30px;
					height: 30px;
					margin: 0 auto 5px;
					}
					.nav ul li:nth-child(1){
						border-left: none;
						}
						.nav ul li:nth-child(5){
							border-right: none;
							}
							.nav ul li.library {
								width: 13%;
								padding: 0;
								}
								.nav ul li.library a {
									width: auto;
									height: 70px;
									border: none;
									border-radius: 0;
									background: #6a0000;
									pointer-events: none;
									}
									.nav ul li.scroll_block{
										display: block;
										width: 22%;
										}
										.nav ul li.scroll_block img{
											width: 206px;
											height: 50px;
											margin: 5px auto;
											}
#library h2{
	background: #0062B1;
	padding: 3px;
	margin-bottom: 0;
	font-size: 20px;
	color: #fff;
	text-align: center;
	}
	#library .inner{
		background: #e2e2e2;
		padding: 45px 0;
		margin-bottom: 30px;
		text-align: center;
		}
		#library .inner p{
			height: 333px;
			text-align: center;
			position: relative;
			}
			#library .inner p a{
				display: inline;
				}
				#library .inner p img{
					height: 100%;
					}
					#library .inner span{
						position: relative;
						top: -27px;
						right: -27px;
						}
						#library .inner span::after{
							content: "";
							display: block;
							width: 22px;
							height: 22px;
							background: url(../img/library/icon01.svg)no-repeat top center;
							background-size: cover;
							position: absolute;
							right: 0;
							}
							p.download {
								max-width: 270px;
								margin: 0 auto;
								}
footer {
	margin-bottom:200px;
}
/* ▼▼▼ 480px〜768px
=====================================*/
@media screen and (max-width: 768px) {
#mainVisual {
	background: url(../img/main_bg.png)no-repeat 0 -20vw;
	background-size: cover;
	padding: 0;
	}
	#mainVisual::after {
		height: 51%;
		padding-top: 8vw;
		font-size: 20px;
		}
	#main  {
		padding: 15px 20px;
		}
		h2::after {
			content: none;
			}
#library h2{
	padding: 5px;
	font-size: 15px;
	}
	#library .inner{
		padding: 25px 0;
		margin-bottom: 20px;
		}
		#library .inner p{
			height: 37vw;
			min-height: 130px
			}
			#library .inner p img{
				height: 100%;
				}
				#library .inner span{
					position: relative;
					top: -25px;
					right: -25px;
					}
					#library .inner span::after{
						width: 20px;
						height: 20px;
						}
						p.download {
							max-width: 65%;
							}

#library .inner iframe {
	width: 80vw;
	height: 45vw;
	margin: 0 auto;
		}
}
