@charset "UTF-8";

#contents {
	overflow: hidden;
}
	#contents > * {
		position: relative;
	}



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

	.title {
		padding: 40px 0;
	}
		.title dl {
		}
			.title dl dt {
				font-size: 0;
				line-height: 1;
				width: 112px;
			}
			.title dl dd {
				margin-top: 15px;
			}
				.title dl dd h1 {
					font-size: 24px;
					line-height: 1.6;
					letter-spacing: 4px;
				}
	.main_img img {
		max-width: none;
		width: 100%;
	}

	#main {
		font-size: 0;
	}
		#main .sec {
			font-size: 16px;
			padding: 60px 0 70px;
		}
		#main .sec:nth-of-type(odd) {
			background-color: #EDEDED;
		}
			@keyframes slideIn {
				0% {
					transform: translateX(180px);
					opacity: 0;
				}
				100% {
					transform: translateX(0);
				}
				40%,100% {
					opacity: 1;
				}
			}
			#main .sec .sammary {
				margin: 32px;
				padding: 32px;
				background-color: rgba(255, 255, 255, .6);
			}
			#main .sec .sammary ul {
				margin: 24px 0 0 32px;
				list-style-type: none;
			}
			#main .sec .sammary ul li {
				position: relative;
				font-size: 14px;
			}
			#main .sec .sammary ul li::before {
				position: absolute;
				content: "";
				top: 12px;
				margin: auto;
				left: -30px;
				width: 14px;
				height: 1px;
				background-color: #000;
			}
				#main .sec h2 {
					position: relative;
					font-size: 28px;
					line-height: 1.6;
					letter-spacing: 4px;
					margin: 60px 0 40px;
					padding-bottom: 10px;
				}
				#main .sec h2:nth-of-type(odd) {
					border-bottom: solid 7px #303776;
				}
				#main .sec h2:nth-of-type(even) {
					border-bottom: solid 7px #3D563A;
				}
				#main .sec h2:after {
					position: absolute;
					content: " ";
					display: block;
					bottom: -7px;
					width: 20%;
				}
				#main .sec h2:nth-of-type(odd)::after {
					border-bottom: solid 7px #822F35;
				}
				#main .sec h2:nth-of-type(even)::after {
					border-bottom: solid 7px #965933;
				}
				#main .sec .main-text a {
					cursor: pointer;
				}
				#main .sec .main-text img.margin {
					margin: 20px 0;
				}
				#main .sec .main-text p.caption {
					margin: 10px 0 20px;
					font-size: 14px;
					font-weight: bold;
					text-align: center;
				}
				#main .sec .main-text p {
					margin-bottom: 40px;
				}
				#main .sec .main-text .reference {
					margin-top: 80px;
					padding: 40px 40px 0 20px;
					font-size: 14px;
					border-top: dotted 2px #000;
				}
				#main .sec .main-text .reference ul {
					margin: 24px 0 0 32px;
					list-style-type: none;
				}
				#main .sec .main-text .reference ul li {
					position: relative;
					font-size: 14px;
				}
				#main .sec .main-text .reference ul li::before {
					position: absolute;
					content: "";
					top: 12px;
					margin: auto;
					left: -30px;
					width: 14px;
					height: 1px;
					background-color: #000;
				}

	
	
	
	
	
	
	
	.deco {
		position: absolute;
		z-index: 0;
	}
	.deco01 {
		top: -2.3vw;
		right: 5%;
		width: 156px;
		width: 11.143%;
	}
	.deco03 {
		top: 13.6%;
		right: 0%;
		width: 156px;
		width: 11.143%;
	}
	.deco04 {
		top: 17.7%;
		left: 0%;
		width: 156px;
		width: 11.143%;
	}
	.deco08 {
		top: 38.7%;
		left: 0%;
		width: 104px;
		width: 7.429%;
	}
	.deco10 {
		top: 49.7%;
		right: 0%;
		width: 156px;
		width: 11.143%;
	}
	.deco13 {
		top: 75.5%;
		right: 0%;
		width: 104px;
		width: 7.429%;
	}
	.deco18 {
		top: 35%;
		right: 0;
		width: 156px;
		width: 11.143%;
	}
	.deco19 {
		top: 56%;
		left: 0;
		width: 104px;
		width: 7.429%;
	}
	.deco20 {
		bottom: 0;
		left: 3.7%;
		width: 104px;
		width: 7.429%;
	}
	.deco21 {
		bottom: -2.3vw;
		right: 0%;
		width: 104px;
		width: 7.429%;
	}
	.deco23 {
		top: -2.3vw;
		left: 3.7%;
		width: 104px;
		width: 7.429%;
	}
	.deco33 {
		top: 75%;
		left: 3.7%;
		width: 156px;
		width: 11.143%;
	}
	.deco36 {
		bottom: 15%;
    right: 3%;
    width: 208px;
    width: 14.858%;
	}
	.deco45 {
		top: -4.5vw;
		left: 0%;
		width: 52px;
		width: 3.715%;
	}

	
}




/* ++++++++++++++++++++++++++++++++++++++++++++++    sp    ++++++++++++++++++++++++++++++++++++++++++++++  */
/* ~ 800px */
@media only screen and (max-width: 800px) {


	.title {
		padding: 35px 0 30px;
	}
		.title dl {
		}
			.title dl dt {
				font-size: 0;
				line-height: 1;
				width: 112px;
			}
			.title dl dd {
				margin-top: 15px;
			}
				.title dl dd h1 {
					font-size: 20px;
					line-height: 1.6;
					letter-spacing: 2px;
				}
	.main_img {
		padding-bottom: 50vw;
		background-image: url("../img/main_img.jpg");
		background-size: cover;
		background-position: 85% 50%;
	}

	#main {
		font-size: 0;
	}
		#main .sec {
			font-size: 14px;
			padding: 40px 0;
		}
		#main .sec:nth-child(odd) {
			background-color: #EDEDED;
		}
		@keyframes slideIn {
			0% {
				transform: translateX(180px);
				opacity: 0;
			}
			100% {
				transform: translateX(0);
			}
			40%,100% {
				opacity: 1;
			}
		}
			#main .sec .sammary {
				margin: 32px 0;
				padding: 2em;
				background-color: rgba(255, 255, 255, .6);
			}
			#main .sec .sammary ul {
				margin: 24px 0 0 32px;
				list-style-type: none;
			}
			#main .sec .sammary ul li {
				position: relative;
				font-size: 14px;
			}
			#main .sec .sammary ul li::before {
				position: absolute;
				content: "";
				top: 12px;
				margin: auto;
				left: -30px;
				width: 14px;
				height: 1px;
				background-color: #000;
			}
			#main .sec h2 {
				position: relative;
				font-size: 20px;
				line-height: 1.6;
				letter-spacing: 4px;
				margin: 30px 0 20px;
				padding-bottom: 6px;
			}
			#main .sec h2:nth-of-type(odd) {
				border-bottom: solid 7px #303776;
			}
			#main .sec h2:nth-of-type(even) {
				border-bottom: solid 7px #3D563A;
			}
			#main .sec h2:after {
				position: absolute;
				content: " ";
				display: block;
				bottom: -7px;
				width: 20%;
			}
			#main .sec h2:nth-of-type(odd)::after {
				border-bottom: solid 7px #822F35;
			}
			#main .sec h2:nth-of-type(even)::after {
				border-bottom: solid 7px #965933;
			}
			#main .sec .main-text img.margin {
				margin: 20px 0;
			}
			#main .sec .main-text p.caption {
				margin: 10px 0 20px;
				font-size: 14px;
				font-weight: bold;
				text-align: center;
			}
			#main .sec .main-text p {
				margin-bottom: 24px;
			}
			#main .sec .main-text .reference {
				margin-top: 60px;
				padding-top: 30px;
				font-size: 14px;
				border-top: dotted 2px #000;
			}
			#main .sec .main-text .reference ul {
				margin: 24px 0 0 32px;
				list-style-type: none;
			}
			#main .sec .main-text .reference ul li {
				position: relative;
				font-size: 14px;
			}
			#main .sec .main-text .reference ul li::before {
				position: absolute;
				content: "";
				top: 12px;
				margin: auto;
				left: -30px;
				width: 14px;
				height: 1px;
				background-color: #000;
			}
	
	
	
	
	
	
	
	.deco {
		position: absolute;
		z-index: 0;
		line-height: 1;
		font-size: 0;
	}
	.mainimg .deco {
		z-index: 2;
	}
	.deco01 {
		top: -2.3vw;
		right: 5%;
		width: 156px;
		width: 11.143%;
	}
	.deco03 {
		top: 13.6%;
		right: 0%;
		width: 156px;
		width: 11.143%;
	}
	.deco04 {
		top: 17.7%;
		left: 0%;
		width: 156px;
		width: 11.143%;
	}
	.deco08 {
		top: 38.7%;
		left: 34%;
		width: 104px;
		width: 7.429%;
	}
	.deco10 {
		top: 49.7%;
		right: 15.85%;
		width: 156px;
		width: 11.143%;
	}
	.deco13 {
		top: 75.5%;
		right: 0%;
		width: 104px;
		width: 7.429%;
	}
	.deco18 {
		top: 35%;
		right: 0;
		width: 156px;
		width: 11.143%;
	}
	.deco19 {
		top: 56%;
		left: 0;
		width: 104px;
		width: 7.429%;
	}
	.deco20 {
		bottom: 0;
		left: 3.7%;
		width: 104px;
		width: 7.429%;
	}
	.deco21 {
		bottom: -2.3vw;
		right: 0%;
		width: 104px;
		width: 7.429%;
	}
	.deco23 {
		top: -2.3vw;
		left: 3.7%;
		width: 104px;
		width: 7.429%;
	}
	.deco33 {
		top: 75%;
		left: 3.7%;
		width: 156px;
		width: 11.143%;
	}
	.deco36 {
		bottom: 15%;
    right: 3%;
    width: 208px;
    width: 14.858%;
	}
	.deco45 {
		top: -4.5vw;
		left: 0%;
		width: 52px;
		width: 3.715%;
	}

	

	
	
}



	.title dl {
		opacity: 0;
		transition-delay: 300ms;
		transition-duration: 1200ms;
	}
	.on .title dl {
		opacity: 1;
	}
	.main_img {
		position: relative;
	}
	.main_img::before {
		position: absolute;
		content: "";
		top: 0;
		right: 0;
		width: 100%;
		height: 100%;
		transition-delay: 300ms;
		transition-duration: 600ms;
		transition-timing-function: ease-in-out;
		background-color: #fff;
	}
	.on .main_img::before {
		width: 0;
	}