@charset "UTF-8";



/* FONT size
---------------------------------------------------------------------
[ px ]	[ % ]
10px 	72  %		19px 	136 %
11px 	79  %		20px 	143 %
12px 	86 %		21px 	150 %
13px 	93 %		22px 	158 %
14px 	100 %		23px 	165 %
15px 	108 %		24px 	172 %
16px 	115 %		25px 	179 %
17px 	122 %		26px 	186 %
18px 	129 %
---------------------------------------------------------------------*/


img{
	width: 100%;
}


p {
/*	font-size: 115%;*/
}

/* ++++++++++++++++++++++++++++++++++++++++++++++    PC    ++++++++++++++++++++++++++++++++++++++++++++++  */
/* 801px ~ */
@media screen and (min-width: 801px), print {

	
	
	
	
	
	#mainArea{
		position: relative;
		background: url("../img/top.jpg") no-repeat center;
		background-size: cover;
		height: 470px;
		box-sizing: border-box;
	}
		#mainArea .top-wrapper {
			position: absolute;
			bottom: 100px;
			width: 100%;
		}
			#mainArea .top-wrapper h1 {
				font-size: 88px;
				text-align: center;
				font-family: 'Bodoni Moda', serif;
				opacity: 0.9;
				font-weight: 400;
				letter-spacing: 3px;
				color: #9bd2d9;
				line-height: 1;
			}
			#mainArea .top-wrapper .jp_tit{
				font-size: 24px;
				text-align: center;
				font-weight: 400;
				width: 100%;
				color: #0096BF;
				margin-top: 28px;
				letter-spacing: 2px;
			}
	

	/* menu */
	.menu {
		display: flex;
		margin-top: 100px;
		justify-content: center;
	}
		.menu_item {
			width: 250px;
			height: 120px;
			border: solid 1px #4C9AC3;
			position: relative;
			margin: 0 14px;
			transition: 0.4s;
		}
				.menu_item:nth-of-type(2){
					animation-delay: 0.4s;
				}
				.menu_item:nth-of-type(3){
					animation-delay: 0.8s;
				}
					.menu_item:hover{
						transform: translateY(-10px);
					}
			.menu_item .num {
				text-align: center;
				margin-top: 12px
			}
			.menu_item .txt {
				text-align: center;
				font-size: 20px;
				line-height: 1.5;
			}
		.menu_item .line {
			position: absolute;
			bottom: -14px;
			left: 50%;
			transform: translateX(-50%);
			width: 13px;
			height: 27px;
			background-color: #FFFFFF;
			overflow: hidden;
		}
		.menu_item .line span {
			display: block;
			width: 1px;
			height: 27px;
			background-color: #4C9AC3;
			position: absolute;
			margin: 0 auto;
			right: 0;
			left: 0;

	}
	
/*	sectionのとこ*/
	
	
	.section {
		width: 100%;
		margin: 180px auto 0;
		max-width: 1440px;
		position: relative;
	}
		#sec_01 {
			margin: 150px auto 0;
		}
	
	.sec_bg{
		width: 85%;
		height: 516px;
		position: relative;
	}
			.sec_bg01 {
				background-image: url("../img/bg_01.jpg");
				background-size: cover;
				background-position: right;
			}
			.sec_bg02 {
				background-image: url("../img/bg_02.jpg");
				margin-left: auto;
				background-size: cover;
				background-position: left;
			}
			.sec_bg03 {
				background-image: url("../img/bg_03.jpg");
				background-size: cover;
				background-position: right;
			}

	.wrapper {
		background-color: #fff;
		box-sizing: border-box;
		position: absolute;
		top: 0;
		bottom: 0;
		margin: auto 0;		
		width: 463px;
		height: 368px;
	}
		.wrap_01 {
			right: 130px;		
		}
		.wrap_02 {
		}
		.wrap_03 {
			right: 130px;
		}
	.wrapper .content {
		width: 100%;
		height: 100%;
		background-color: #fff;
		box-sizing: border-box;
		z-index: 2;
		padding: 40px;
	}
		.wrapper::before {
			content: '';
			display: block;
			position: absolute;
			bottom: -20px;
			right: -20px;
			z-index: -1;
			width: 100%;
			height: 100%;
			background-image: repeating-linear-gradient(-45deg, transparent, transparent 14px, rgba(195, 229, 193, 1) 14px, rgba(195, 229, 193, 1) 20px );
		}
	
			.wrapper .content h2{
				font-weight: 400;
				font-size: 27px;
				letter-spacing: 5px;
				line-height: 1.8;
				font-family: YuMincho, 'YuMincho', 游明朝, '游明朝', 'Noto Serif JP', serif;
			}
	
			.wrapper .content .txt {
				width: 100%;
				margin-top: 36px;
				text-align: justify;
				position: relative;
				z-index: 2;
			}
				.wrapper .content .num {
					position: absolute;
					top: 45px;
					right: 45px;
				}


}




/* ++++++++++++++++++++++++++++++++++++++++++++++    sp    ++++++++++++++++++++++++++++++++++++++++++++++  */
/* ~ 800px */
@media only screen and (max-width: 800px) {
	main{
		position: relative;
		overflow: hidden;
	}

	
	#mainArea{
		position: relative;
		background: url("../img/top.jpg") no-repeat center;
		background-size: cover;
		height: 430px;
		box-sizing: border-box;
	}
		#mainArea .top-wrapper {
			display: -webkit-flex;
			display: -ms-flexbox;
			display: flex;
			-webkit-box-pack: center;
			-ms-flex-pack: center;
			justify-content: center;
			-webkit-box-align: center;
			-ms-flex-align: center;
			align-items: center;
			flex-direction: column;
			height: 100%;
		}
		#mainArea .top-wrapper h1 {
			font-size: 72px;
			text-align: center;
			font-family: 'Bodoni Moda', serif;
			opacity: 0.9;
			font-weight: 400;
			letter-spacing: 3px;
			color: #9bd2d9;
			line-height: 1;
		}
			#mainArea .top-wrapper .jp_tit {
				text-align: center;
				font-size: 18px;
				font-weight: 400;				
				margin-top: 22px;
			}
	
	
	.menu {
		margin-top: -60px;
		justify-content: center;
	}
	.menu_item {
		display: block;
		width: 260px;
		padding: 10px 0;
		border: solid 1px #4C9AC3;
		position: relative;
		margin: 30px auto;
		background-color: #fff;
	}
	.menu_item p {
		text-align: center;
	}


	.menu_item .line {
		position: absolute;
		bottom: -20px;
		left: 50%;
		transform: translateX(-50%);
		width: 13px;
		height: 27px;
		background-color: #FFFFFF;
	}
		.menu_item .line span {
			display: block;
			width: 1px;
			height: 20px;
			background-color: #4C9AC3;
			margin: 0 auto;
			right: 0;
			left: 0;
		}
	
	
	
	.section {
		margin: 0 auto;
		margin-top: 120px;
		max-width: 1440px;
		position: relative;
	}
	#sec_01 {
		margin-top: 80px;
	}
	#sec_03{
		padding-bottom: 80px;
	}
	
	.sec_bg{
		width: 100%;
		height: 300px;
		position: relative;
	}
		.sec_bg01 {
			background-image: url("../img/bg_01.jpg");
			margin-left: -7%;		
			background-size: cover;
			background-position: center;
		}
		.sec_bg02 {
			background-image: url("../img/bg_02.jpg");
			background-size: cover;
			background-position: right;
		}
		.sec_bg03 {
			background-image: url("../img/bg_03.jpg");
			background-size: cover;
			background-position: right;
		}
	.wrapper{
		width: 90%;
		margin: -120px auto 0;
	}
		.wrap_01 {
		}
		.wrap_02 {
			
		}
		.wrap_03 {
			
		}
		.wrapper::after {
			content: '';
			display: block;
			position: absolute;
			bottom: -5%;
			right: -5%;
			z-index: -1;
			width: 100%;
			height: 100%;
			background-image: repeating-linear-gradient(-45deg, transparent, transparent 14px, rgba(195, 229, 193, 1) 14px, rgba(195, 229, 193, 1) 20px );
		}
	.wrapper .content {
		background-color: #fff;
		box-sizing: border-box;
		padding: 40px;
	}

		.wrapper .content h2{
			font-weight: 400;
			font-size: 24px;
			letter-spacing: 3px;
			font-family: YuMincho, 'YuMincho', 游明朝, '游明朝', 'Noto Serif JP', serif;

		}
		.wrapper .content .txt {
			width: 100%;
			margin-top: 20px;
			text-align: justify;
		}
		.wrapper .content .moda {
			position: absolute;
			top: 40px;
			right: 40px;		
		}
	
	

}