@charset "utf-8";
/*----------------------------------------------------
 GrapeCity Corporate Marketing and Communication Team
 (http://www.grapecity.com/) A.C
-----------------------------------------------------*/
/*****************************************************
	Common
*****************************************************/


/*****************************************************
	Contents
******************************************************/
section.content:nth-child(even) { background:url(../imgs/bg_content.png) no-repeat -10% 50%; }
section.content:nth-child(odd) { background:url(../imgs/bg_content.png) no-repeat 110% 50%; }

/* Top Block */
.block {
	display:table;
	width:100%;
	max-width:1100px;
	margin:0 auto;
	padding:50px 0 100px;
}
	.block .txt,
	.block .img {
		display:table-cell;
		vertical-align:top;
	}
	.block .txt {
		width:30%;
		padding-right:30px;
	}
	.block .img img { width:100%; }
	.block h1 { color:#a27939; margin-bottom:0; }
	.block h2 { margin-top:0; }
	.block .txt a {
		display:inline-block;
		color:#fff;
		border-radius:16px;
		background-color:#9f845c;
	}
	
/* Column Left */
.column_left {
	display:flex;
	width:100%;
	max-width:1500px;
	margin:0 auto;
	padding:0;
}
	.column_left .txt_area .fixed_box {
		position:absolute;
		top:80px;
		left:-15%;
		width:400px;
		min-height:200px;
		padding:30px 50px;
		background-color:#fff;
		border-right:solid 10px #77aa55;
		box-shadow: 0 0 10px 5px rgba(0,0,0,0.2);
	}
		.column_left .photo { text-align:left; }
		.column_left .txt_area .fixed_box h2 {
			color:#77aa55;
			line-height:26px;
		}
		.column_left .txt_area .fixed_box span {
			color:#333;
			font-size:80%;
			font-weight:normal
		}
		.column_left .txt_area .fixed_box a {
			display:inline-block;
			color:#fff;
			border-radius:16px;
			background-color:#77aa55;
		
		}
		
/* Column Right */
.column_right {
	display:flex;
	width:100%;
	max-width:1500px;
	margin:0 auto;
	padding:0;
}
	.column_right .txt_area .fixed_box {
		position:absolute;
		top:80px;
		right:-15%;
		width:400px;
		min-height:200px;
		padding:30px 50px 40px;
		background-color:#fff;
		border-left:solid 10px #be7ccf;
		box-shadow: 0 0 10px 5px rgba(0,0,0,0.2);
	}
		.column_right .photo { text-align:right; }
		.column_right .txt_area .fixed_box h2 {
			color:#be7ccf;
			line-height:26px;
		}
		.column_right .txt_area .fixed_box span {
			color:#333;
			font-size:80%;
			font-weight:normal
		}
		.column_right .txt_area .fixed_box a {
			display:inline-block;
			color:#fff;
			border-radius:16px;
			background-color:#be7ccf;
		}
		
/* Column Common Settings */
	.photo,
	.txt_area {
		vertical-align:top;
	}
	.photo {
		width:50%;
		overflow:hidden;
	}
		.photo img {
			width:auto;
			max-width:auto;
			height:100%;
			overflow:hidden;
		}
	
	.txt_area {
		position:relative;
		width:50%;
	}

/* pic_box */
.pic_box {
	position:relative;
	width:100%;
	max-width:1500px;
	min-height:500px;
	margin:0 auto;
	padding:100px 0 100px;
	background:url(../imgs/photo_land.jpg) no-repeat top center;
}
	.pic_box .txt_box {
		/*position:absolute;
		top:15%;
		left:30%;*/
		max-width:300px;
		margin-left:200px;
		padding:40px;
		color:#fff;
		background:rgba(0, 0, 0, 0.5);
	}
		.pic_box .txt_box h2 {
			color:#b3e1fb;
			line-height:26px;
		}
		.pic_box .txt_box h2 span {
			color:#fff;
			font-size:80%;
			font-weight:normal
		}
		.pic_box .txt_box a {
			display:inline-block;
			color:#fff;
			border-radius:16px;
			background-color:#3961a2;
		}

/*****************************************************
	Mobile Settings
******************************************************/
@media screen and (max-width: 968px) {
	.block .txt,
	.block .img { display:block; }
	.block .txt { width:90%; margin:0 auto 30px; }
	
	.photo { width: 50%; }
	    .column_left .photo img { float: right; }
		
	.column_left .txt_area .fixed_box,
	.column_right .txt_area .fixed_box {
		max-width:400px;
		width:auto;
		min-width:200px;
		min-height:200px;
		padding:30px 50px 40px;
	}
}
@media screen and (max-width: 640px) {
.block { padding: 20px 0 20px; }
.column_left,
.column_right {
	display:block;
	width:100%;
	margin:0 auto;
	padding:0;
}
	.txt_area {
		position: relative;
		width: 90%;
		margin:0 auto;
	}
	.column_left .photo,
	.column_right .photo { display:none; }

	.column_left .txt_area .fixed_box,
	.column_right .txt_area .fixed_box {
		position:static;
		top:auto;
		right:auto;
		max-width:90%;
		margin-bottom:20px;
	}
	.column_right .txt_area .fixed_box {
		border-left:none;
		border-right:solid 10px #be7ccf;
	}
.pic_box .txt_box {
    max-width: 80%;
    margin: 0 auto;
}
}