@charset "utf-8";

body #container {
	background-image: url(../imgs/bg.png);
	background-repeat: no-repeat;
	background-position: top 90px right;
	background-size: 100% auto;
	background-attachment: fixed;
	}
/* backBtn */
	.backBtn {
		margin-top:20px;
		text-align: center;
	}
	.backBtn a {
	padding-left: 26px;
	color: #333;
	background-image: url(../images/bg-back.png);
	background-repeat: no-repeat;
	background-position: 0 50%;
	}
	
#content #head_title{ margin:30px 0 90px;}
#content #head_title2{ display:none}

body #container #content .wrapper h3{
	color: #93773d;
	font-size:20px;
	font-weight: bold;
	background-image: url(../images/h3_img.png);
	background-repeat: no-repeat;
	background-position: left 2px;
	margin-bottom: 30px;
	padding-bottom: 10px;
	padding-left: 30px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #666;
}

.boxContainer {
	display: flex;
	display: -moz-flex;
	display: -o-flex;
	display: -webkit-flex;
	display: -ms-flex;
	flex-direction: row;
	-moz-flex-direction: row;
	-o-flex-direction: row;
	-webkit-flex-direction: row;
	-ms-flex-direction: row;
	margin-bottom:40px;
}

.card + .card {
 margin: 0 0 0 10px;
}

body #container #content .wrapper ul.p_set {
	width:1200px;
	margin: 0;
	padding:0;
}

body #container #content .wrapper ul.p_set li{
	float: left;
	width:292px;
	padding:0;
}

body #container #content .img_under{ float:right; width:478px; height:473px;position: relative;}
body #container #content .img_under p { margin-left:30px;}
body #container #content .img_under div.under_img{ float:right; margin-left:10px; position: absolute; bottom:0;}

body #container #content .wrapper p{ letter-spacing:0.07em; margin-bottom:0.8em}

body #container #content .wrapper p.Limg{ float:left; margin:0 30px 50px 0;}
body #container #content .wrapper p.Limg2{ float:left; margin:0 30px 40px 0;}
body #container #content .wrapper p.Limg3{ float:left; margin:0 30px 40px 0;}
body #container #content .wrapper p.Limg4{ float:left; margin:0 30px 10px 0;}
body #container #content .wrapper p.Limg5{ float:left; margin:0 0 10px 0;}
body #container #content .wrapper p.Limg6{ float:left; margin:0 30px 40px 0;}

body #container #content .wrapper p.Rimg{ float:right; margin-left:30px; margin-bottom:50px;}
body #container #content .wrapper p.Rimg2{ float:right; margin-left:30px; margin-bottom:30px;}

@media only screen and (max-width:1200px) {
	body #container #content .wrapper p{ letter-spacing:0.03em;}
	body #container #content .wrapper p.Limg{ width:43%;}
	body #container #content .wrapper p.Limg2{ width:45%;}
	body #container #content .wrapper p.Limg4{ width:36%; margin-bottom:50px;}
	body #container #content .wrapper p.Limg5{ float:none;}
	body #container #content .wrapper p.Limg6{ width:43%; margin-bottom:50px;}
	
	body #container #content .img_under{ float:none; width:auto; height:auto; position:inherit;}
	body #container #content .img_under p { margin-left:0px;}
	body #container #content .img_under div.under_img{float: left; margin:0 20px 30px 0; position:inherit; bottom:auto;width:45%;}
	
	body #container #content .wrapper p.Rimg{ width:50%; }
	body #container #content .wrapper p.Rimg2{ width:50%; }
	/*#content #head_title{ margin:120px 0 60px;}*/

}

@media only screen and (max-width:1080px) {
	body #container #content .wrapper p.Limg,
	body #container #content .wrapper p.Limg4{ float:none; margin:0 0 30px 0; width:auto;}
	body #container #content .wrapper p.Rimg{ float:none; margin:0 0 30px 0; width:auto;}

body #container #content .img_under div.under_img{ margin-bottom:60px; width:48%;}

}
@media only screen and (max-width:950px) {
	/*#content #head_title{ margin:100px 0 50px;}*/
	body #container #content .wrapper p.Limg2{ float:none; margin:0 0 30px 0; width:auto;}
	body #container #content .wrapper p.Rimg2{ float:none; margin-left:0px; width:auto;}
	
	body #container #content .img_under div.under_img{ margin-bottom:10px; width:38%;}
	
	.boxContainer { margin-bottom:10px;}
}

@media only screen and (max-width:830px) {
	/*#content #head_title{ margin:80px 0 40px;}*/
	
	body #container #content .wrapper p.Limg6{ float:none;width:auto;margin-bottom:30px;}
	body #container #content .wrapper h3{ font-size:18px; margin-bottom: 20px; padding-bottom: 7px;}
	body #container #content .img_under div.under_img{ float:none; width:auto; margin:0 0px 20px 0;}
}

@media only screen and (max-width:740px) {
	body #container #content .wrapper p.Limg3{ float:none; margin:0 0 30px 0; width:auto;}
}

@media only screen and (max-width:640px) {
	/*#content #head_title{ margin:50px 0 30px;}*/
	.boxContainer {
	flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	justify-content: space-between;
	margin-bottom:0;
}
.card  { width:49%; padding-bottom:10px}
.card + .card { margin: 0;}
}


@media only screen and (max-width:600px) {
	body #container #content .wrapper h3{ font-size:16px;}
}


@media only screen and (max-width:480px) {
	#content #head_title { display:none}
	#content #head_title2 { display: block;/*margin:50px 0 30px;*/ margin-bottom:30px;}
}