@charset "utf-8";

.contents_section {
	text-align : center;
	margin : 50px auto;
}

.contents_section h2 {
	text-align : center;
	font-weight : 400;
	font-size : 2.4rem;
	font-family: 'Noto Sans Japanese', serif;
	color : #2B91E5;
}

.contents_section.tokucho_section {
	width : 760px;
}

.contents_section .contents_in {
	margin : 30px 0;
}

.contents_section.tokucho_section h3 {
	text-align : left;
	font-size : 1.8rem;
}

.contents_section.tokucho_section p {
	text-align : left;
}

.contents_section.skill_section {
	background : url(../images/img_bg_line.png) #edf5fc repeat top left;
	width:1280px;
}


.skill_art {
	width : 1090px;
	margin : 40px auto;
	position : relative;
	padding : 40px 0;
}

.skill01 .skill_image {
	text-align : left;
}

.skill_text {
	background : #fff;
	padding : 20px;
	text-align : left;
	width : 480px;
	position : absolute;
}

.skill01 .skill_text{
	right : 0;
	top : 100px;
}
.skill02 .skill_image {
	text-align : right;
}
.skill02 .skill_text{
	left : 0;
	top : 100px;
}

.skill_text h3 {
	border-left : 3px solid #2B91E5;
	padding : 2px 0 2px 10px;
	text-align : left;
	margin-bottom : 20px;
	font-weight : 400;
}

.skill_contact_area {
	background : #fff;
	border : 1px solid #2B91E5;
	width : 1090px;
	margin : 0 auto;
	padding : 30px;
}
.skill_contact_area .contents_in {
	width : 760px;
	margin : 20px auto;
}

@media screen and (max-width : 768px) {

	.sub .contents_section {
		margin : 0;
	}

	.contents_section h2 {
		font-size : 1.8rem;
	}


	.contents_section.tokucho_section {
		width : 100%;
	}

	.contents_section.skill_section {
		width:100%;
	}

	 .contents_in {
		width : 100%;
		padding : 20px;
		font-size : 1.4rem;
	}
	.skill_contact_area .contents_in {
		width : 100%;
		padding : 20px;
		font-size : 1.4rem;
	}

	.skill_art {
		width : 100%;
		margin : 20px auto;
		position : relative;
		padding : 20px 0;
	}

	.skill_text {
		width : 90%;
		position : relative;
		margin : 5px auto;
		top : auto;
		right : auto;
	}
	.skill01 .skill_text,
	.skill02 .skill_text {
		top : auto;
	}

	.skill01 .skill_image {
		width : 100%;
	}

	.skill_contact_area {
		width : 100%;
	}
	
	
	
}


