@charset "UTF-8";

h1, h2, h3, h4, h5, dt, dd{
	font-family:"Century Gothic", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
}

.first-wrapper{
	background-color:#eae1c9;
	width:100%;
	padding:40px 30px 0;
	position:relative;
	top:-10px;
}

.title{
	width:1200px;
	display:flex;
	height: auto;
	margin:10px auto;
	justify-content: center;
	align-items:baseline;
}

.caption{
	width:800px;
	margin:40px auto;
}

.caption p, .tate_caption p, .small_flex p{
	text-align: justify!important;
	font-size:14px;
}

.tokushuimg{
	vertical-align:bottom;
}

.tokushuimg img{
	width:180px;
	margin-left:20px;
}

.mid-wrapper{
	width:1100px;
	margin:10px auto;
}

.tate_narabi{
	display:flex;
	justify-content:flex-end;
	height: auto;
	align-items: flex-start;
}

.big_style_class{
	margin-bottom:90px;
}

.big_style_class img{
	width:400px;
}

.big_style01, .big_style02, .big_style03, .big_style04{
	display: flex;
	height: auto;
	align-items: flex-start;
	height:600px;
	margin-bottom:30px;
}

.big_style01, .big_style03, .flex-right{
	flex-direction: row-reverse;
}

.tate_caption, .tate_title{
	-ms-writing-mode: tb-rl;
	 writing-mode: vertical-rl;
	text-orientation: upright;
}

.tate_title{
	background-color:#8f9891;
	color:#fff;
	padding:8px 5px;
	display:block;
	position:relative;
	font-size:15px;
}

.big_style01 .tate_title, .big_style03 .tate_title{
	top:20px;
	left:60px;
	margin-left:-40px;
}

.big_style02 .tate_title, .big_style04 .tate_title{
	top:20px;
	right:380px;
	margin-right:-40px;
}

.second_wrapper{
	padding:60px 0;
}

.second_wrapper .mid-wrapper{
	padding:50px 0;
}

.moji-title{
	text-align: center;
}

.moji-title h3{
	font-size:30px;
	font-weight: bold;
	color:#2f5173;
}

.kimawashi_img{
	width:600px;
	margin:0 auto;
	display: flex;
	height: auto;
	align-items:center;
}

.kimawashi_img img{
	width:200px;
	margin-right:30px;
}

.small_style_wrapper{
	margin-top:40px;
}

.kimawashi-box{
	display: flex;
	height: auto;
	align-items:center;
	margin:50px 0;
	padding:20px 0;
}

.kimawashi-box img{
	width:650px;
}

.kimawashi-box .tate_title{
	height:433px;
	padding:20px 10px;
	margin:0 20px;
}

.kimawashi-box .tate_title h4{
	font-size:25px;
}

.third_wrapper, .ob_img{
	width:1100px;
	margin:20px auto 60px;
}

.third_wrapper{
	padding-bottom:80px;
}

.ob_box, .ob_img{
	display: flex;
	height: auto;
	align-items:center;
}

.color_bar{
	width:20px;
	height:100px;
	background-color:#2f5173;
	margin-right:15px;
}

.oblekt_title img{
	width:600px;
}

.oblekt_caption p{
	font-size: 14px;
}

.ob_img{
	justify-content:space-between;
}

.ob_img img{	
	width:270px;
}

.frames_box h5{
	font-size:16px;
	color:#f6b597;
}

@media screen and (max-width: 768px){
	.title, .caption, .mid-wrapper, .big_style_class, .kimawashi-box, .kimawashi_img, .second_wrapper, .third_wrapper{
		width:600px;
	}
	
	.second_wrapper{
		margin:0 auto;
	}
	
	.first-wrapper{
		padding-bottom:30px;
	}
	
	.big_style_class img{
		width:100%;
	}
	
	.big_style01, .big_style02, .big_style03, .big_style04, .tate_narabi, .kimawashi-box{
		display:block;
		height:auto;
	}
	
	.big_style_class .tate_title{
		position:relative;
		padding:10px;
		font-size:20px;
	}
	
	.big_style01 .tate_title{
		top:-880px;
		margin-bottom:-370px;
	}
	
	.big_style02 .tate_title{
		top:-880px;
		left:20px;
		margin-bottom:-630px;
	}
	
	.big_style03 .tate_title{
		top:-880px;
		margin-bottom:-440px;
	}
	
	.big_style04 .tate_title{
		top:-880px;
		left:20px;
		margin-bottom:-670px;
	}
	
	.tate_caption, .kimawashi-box .tate_title{
		writing-mode:horizontal-tb!important;
	}
	
	.kimawashi_img{
		justify-content:center;
	}
	
	.kimawashi-box .tate_title{
		width:600px;
		margin:10px 0;
		height:auto;
		padding:5px 10px;
	}
	
	.ob_img{
		width:600px;
		flex-wrap: wrap;
		justify-content:space-between;
	}

	.color_bar{
		width:30px;
		height:130px;
	}

	.oblekt_title img{
		width:570px;
	}

	.oblekt_caption p{
		font-size:13px;
		text-align: justify;
	}

	.ob_img img{	
		width:49%;
		margin-bottom:10px;
	}

	.f_sp_img img{
		width:100% !important;
		margin:20px 0;
	}
	
	.yomoyama_img{
		text-align: center;
	}
	
	.yomoyama_img img{
		width:50% !important;
	}

}

@media screen and (max-width:640px){

	.title{
		width:100%;
	}

	.caption, .mid-wrapper, .big_style_class, .kimawashi-box, .kimawashi_img, .second_wrapper, .third_wrapper, .ob_img{
		width:350px;
	}
	
	.mid-wrapper{
		padding:0;
	}
	
	.first-wrapper{
		padding:40px 0 40px;
	}
	
	.title{
		display:block;
	}
	
	.tokushuimg{
		text-align: center;
	}

	.tokushuimg img{
		width:130px;
		margin-right:15px;
	}

	.kimawashi-box .tate_title{
		width:300px;
		margin:10px 0;
		height:auto;
		padding:5px 10px;
	}
	
	.oblekt_title img{
		width:100%;
	}
	
	.ob_img img{	
		width:170px;
		margin-bottom:10px;
	}
	
	.big_style_class .tate_title{
		position:relative;
		padding:5px 2px;
		font-size:12px;
		font-weight: bold;
	}

	.caption .bold_text{
		font-size:13px;
	}
	
	.tate_caption p, .small_flex p, .oblekt_caption p, .third_wrapper .modoru_box p{
		font-size:12px;
	}
	
	.big_style_class{
		margin:40px 0 40px;
	}
	
	.big_style01 .tate_title{
		top:-510px;
		margin-bottom:-230px;
	}
	
	.big_style02 .tate_title{
		top:-510px;
		left:20px;
		margin-bottom:-400px;
	}
	
	.big_style03 .tate_title{
		top:-510px;
		margin-bottom:-270px;
	}
	
	.big_style04 .tate_title{
		top:-510px;
		left:20px;
		margin-bottom:-420px;
	}
	
	.moji-title h3{
		font-size:17px;
	}
	
	.kimawashi_img{
		display:block;
		text-align: center;
	}

	.kimawashi_img img{
		margin-right:0;
	}

	.second_wrapper{
		padding:40px 0;
	}
	
	.second_wrapper .mid-wrapper{
		padding:20px 0;
	}
	
	.kimawashi-box .tate_title{
		width:100%;
		margin:10px 0;
		height:auto;
		padding:5px 10px;
	}
	
	.kimawashi-box .tate_title h4{
		font-size:15px;
		text-align: center;
	}
	
	.color_bar{
		height:170px;
	}
	
	


}

/* CSS Document */