@charset "utf-8";
/* ======================================================
 * ELEMENT **********************************************
 * Common Parts
 * Section Parts
 * COMPONENT ********************************************
 * RESPONSIVE *******************************************
 * - 769px <= width <= 1024px
 * Clearfix
====================================================== */
@media only screen and (max-width: 768px) {
/********************************************************

  ELEMENT

********************************************************/
	.sec-lead {
		width: 100%;
	}
	.sec-lead .sec-lead__img {
		margin: 0 auto 35px;
		text-align: center;
		padding: 0 0px;
	}
	.sec-lead .sec-lead__img img {
		width: 100%;
	}
	.sec-lead .sec-lead__txt {
		margin-bottom: 25px;
	}
	.sec-lead .sec-lead__txt p {
		margin-top: 0;
		font-size: 12px;
		line-height: 1.75;
	}
	.section02 {
		border-radius: 5px;
		background: #eae4d4;
		margin-top: 0;
		margin-bottom: 15px;
		padding: 20px;
	}
	.section02:last-of-type {
		margin-bottom: 35px;
	}
	.section02 .flexArea {
		display: block;
	}
	
	.section02 .photo_area {
		width: 100%;
	}
	.section02 .photo_area p {
		margin: 0;
	}
	.section02 .photo_area img {
		width: 100%;
	}
	.section02 .detail_area {
		margin-top: 10px;
	}
	.section02 .detail_area h2 {
		color: #24753b;
		font-size: 15px;
		font-weight: bold;
	}
	.section02 .detail_area p {
		font-size: 14px;
		line-height: 1.5;
		margin-top: 5px;
	}

	.section02 .detail_area .btn {
		margin-top: 15px;
	}
	.section02 .detail_area .btn a {
		display:-webkit-box;
		display:-ms-flexbox;
		display:flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		border-radius: 5px;
		background-color: #027048;
		color: #fff;
		font-size: 15px;
		font-weight: bold;
		line-height: 1.25;
		text-align: center;
		width: 100%;
		padding: 17px 24px;
		position: relative;
	}

	.section02 .detail_area .btn a:before {
		content: "";
		position: absolute;
		left: 14px;
		top: 50%;
		display: inline-block;
		width: 0;
		height: 0;
		margin: -6px 0 0 0;
		border-width: 6px 10px;
		border-style: solid;
		border-color: transparent transparent transparent #fff;
	}

	.useful {
		margin: 0 -10px;
		background-color: #e7f1d0;
		padding: 0 30px;
	}
	.useful h3 {
		font-size: 16px;
		font-weight: bold;
		color: #24753b;
		text-align: center;
		padding: 30px 0 10px;
	}
	  
	.useful ul {
		display: block;
		padding-bottom: 10px;
		margin-top: 0;
	}
	.useful ul li {
		width: 100%;
		margin: 0 0 15px;
		position: relative;
	}
	.useful ul li a {
		position: relative;
		display: inline-block;
		width: 100%;
		padding: 17px 24px;
		border-radius: 5px;
		background-color: #027048;
		color: #fff;
		font-size: 15px;
		font-weight: bold;
		line-height: 1.25;
		text-align: center;
	}

	.useful ul li a:before {
		content: "";
		position: absolute;
		left: 14px;
		top: 50%;
		display: inline-block;
		width: 0;
		height: 0;
		margin: -6px 0 0 0;
		border-width: 6px 10px;
		border-style: solid;
		border-color: transparent transparent transparent #fff;
	}

	.useful .btn_back {
		font-size: 20px;
		display:-webkit-box;
		display:-ms-flexbox;
		display:flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		padding-bottom: 30px;
		margin-top: 0;
		margin-left: -30px;
	}
	.useful .btn_back a {
		display: inline-block;
		color: #222;
		font-weight: bold;
		position: relative;
		min-height: 24px;
	}
	.useful .btn_back a:before {
		content: "";
		position: absolute;
		right: -30px;
		top: 50%;
		display: inline-block;
		width: 25px;
		height: 24px;
		background: url(/beginner/img/ico_back.png) no-repeat 0 0;
		background-size: cover;
		-moz-transform: translateY(-50%);
		-webkit-transform: translateY(-50%);
		-o-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
	}

	
	  
}