@charset "utf-8";

*,*::before,*::after {
box-sizing: border-box;}

ul,li {list-style: none; margin:0; padding: 0;}
a {text-decoration: none;}




/* PC ================================================== */
@media all and (min-width:960px){
#company-page {
padding-top: 80px;
}
	.top-img-area {
		width: 100%;
		height: 650px;
		max-width: 1500px;
		display: flex;
		margin:0 auto;
	}
	.company-txt-area {
		width: 30%;
		height: auto;
		margin: 0 auto;
		position: relative;
	}
		.ttl-box {
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%,-50%);
			-webkit-transform: translate(-50%,-50%);
		}
			.ttl-box h1 {
				font-size: 42px;
			}
			.top-img {
				/* background-image: url(../img/company-top.jpg);
				background-size: cover;
				background-position: 0 0; */
				width: 70%;
				height: auto;
				margin:0 auto;
			}
				.top-img {
					width: 100%;
					max-width: 1000px;
					height: auto;
				}
					.top-img img {
						width: 100%;
						height: auto;
					}
		.company-inner {
			width: 90%;
			max-width: 1000px;
			margin: 50px auto 0;
		}
			
		.contents {
			width: 100%;
			height: auto;
			margin: 60px auto 0;
		}
			.contents dl {
				display: flex;
				align-items: flex-start;
				width: 100%;
				height: auto;
				border-bottom: 1px solid #DEDEDE;
				margin-bottom: 25px;
				padding-bottom: 25px;
			}
				.contents dt {
					width: 213px;
					font-size: 16px;
				}
					.contents dd {
						font-size: 16px;
					}
						.yakuin-box p{
							width: 130px;
							display: inline-block;
						}
		.concept--area {
			width: 100%;
			height: auto;
			margin: 40px 0;
		}
			.concept--area p {
				width: 90%;
				margin:0 auto;
				text-align: center;
				font-size: 20px;
				line-height: 1.7;
			}
			.concept-img-area {
				width:100%;
				height:250px;
				display: flex;
				justify-content: center;
				align-items: center;
				margin: 30px 0;
				position: relative;
			}
			.concept-img {
				width: 50%;
			}
				/* .move-circle-box {
					position: relative;
					top:0;
					right:0px;
					width: 240px;
					height:240px;
					padding: 10px;
					overflow: hidden;
				}
					.circle-str {
						width: 100%;
						height: auto;
					}
						.re-str {
							width:87px;
							height:auto;
							position: absolute;
							top: 50%;
							left: 50%;
							transform: translate(-50%,-50%);
							-webkit-transform: translate(-50%,-50%);
						} */
		.prof-area {

		}
			.prof-box {
				display: flex;
				justify-content: center;
				align-items: center;
				margin: 30px 0;
			}
				.prof-box img {
					width:300px;
					height: auto;
				}
					.noimg {
						width:300px;
						height: 180px;
					}
				.prof-txt-area {
					width: 710px;
				}
					.yakusyoku {
						font-size: 18px;
						color:#1B904B;
					}
					.name {
						font-size: 28px;
						font-weight: bold;
						color:#1B904B;
						display: flex;
						align-items: center;
					}
						.name span {
							display: inline-block;
							font-size: 16px;
							font-family: Lato,serif;
							margin-left: 15px;
						}
							.prof-txt {
								font-size: 16px;
								line-height: 1.5;
								letter-spacing: 0.12em;
								margin: 10px 0 0;
							}
}

/* Tablet ================================================== */
@media all and (min-width:560px) and (max-width:959px){
	#company-page {
		padding-top: 80px;
		}
			.top-img-area {
				width: 100%;
				height: auto;
				display: flex;
				flex-direction: column-reverse;
				margin:0 auto;
			}
			.company-txt-area {
				width: 90%;
				height: auto;
				margin: 20px auto 0;
			}
				.ttl-box {
				}
					.ttl-box h1 {
					}
				.top-img {
					width: 100%;
					height: auto;
				}
					.top-img img{
						width: 100%;
						height: auto;
					}
				.company-inner {
					width: 90%;
					max-width: 1000px;
					margin: 50px auto 0;
				}
					
				.contents {
					width: 80%;
					height: auto;
					margin: 60px auto 0;
				}
					.contents dl {
						display: flex;
						align-items: flex-start;
						width: 100%;
						height: auto;
						border-bottom: 1px dotted #DEDEDE;
						margin-bottom: 25px;
						padding-bottom: 25px;
						font-size: 18px;
					}
						.contents dt {
							width: 140px;
							font-size: 14px;
						}
							.contents dd {
								font-size: 14px;
							}
								.yakuin-box p{
									width: 100px;
									display: inline-block;
								}
								.business-dl dd {
									width: 250px;
								}
				.concept--area {
					width: 80%;
					height: auto;
					margin: 40px auto;
				}
					.concept--area p {
						font-size: 16px;
						line-height: 1.7;
					}
					.concept-img-area {
						width:100%;
						height:auto;
						margin: 30px 0;
						position: relative;
					}
					.concept-img {
						width: 86%;
					}
	
				.prof-area {
		
				}
					.prof-box {
						width: 80%;
						margin: 30px auto;
					}
						.prof-box img {
							display: block;
							width:300px;
							height: auto;
							margin: 0 auto;
						}
						.noimg {
							height:100px;
						}
						.prof-txt-area {
							width: 100%;
						}
							.yakusyoku {
								font-size: 18px;
								color:#1B904B;
							}
							.name {
								font-size: 28px;
								font-weight: bold;
								color:#1B904B;
								display: flex;
								align-items: center;
							}
								.name span {
									display: inline-block;
									font-size: 16px;
									font-family: Lato,serif;
									margin-left: 15px;
								}
									.prof-txt {
										font-size: 16px;
										line-height: 1.5;
										letter-spacing: 0.12em;
										margin: 10px 0 0;
									}
}

/* SP ================================================== */
@media all and (max-width:559px){
#company-page {
	padding-top: 80px;
	}
		.top-img-area {
			width: 100%;
			height: auto;
			display: flex;
			flex-direction: column-reverse;
			margin:0 auto;
		}
		.company-txt-area {
			width: 86%;
			height: auto;
			margin: 20px auto 0;
		}
			.ttl-box {
			}
				.ttl-box h1 {
					font-size: 32px;
				}
			.top-img {
				width: 100%;
				height: auto;
			}
				.top-img img{
					width: 100%;
					height: auto;
				}
			.company-inner {
				width: 86%;
				margin: 30px auto 0;
			}
			.contents {
				width: 100%;
				height: auto;
				margin: 60px auto 0;
			}
				.contents dl {
					display: flex;
					align-items: flex-start;
					width: 100%;
					height: auto;
					border-bottom: 1px dotted #DEDEDE;
					margin-bottom: 18px;
					padding-bottom: 18px;
				}
					.contents dt {
						width: 100px;
						font-size: 14px;
					}
						.contents dd {
							font-size: 14px;
						}
							.yakuin-box p{
								width: 100px;
								display: inline-block;
							}
							.business-dl dd {
								width: 230px;
							}

			.concept--area {
				width: 100%;
				height: auto;
				margin: 40px 0;
			}
				.concept--area p {
					font-size: 16px;
					line-height: 1.7;
				}
				.concept-img-area {
					width:100%;
					height:auto;
					margin: 30px 0;
					position: relative;
				}
				.concept-img {
					width: 86%;
				}

			.prof-area {
	
			}
				.prof-box {
					width: 100%;
					margin: 30px auto;
				}
					.prof-box img {
						display: block;
						width:300px;
						height: auto;
						margin: 0 auto;
					}
					.noimg {
						height:100px;
					}
					.prof-txt-area {
						width: 100%;
					}
						.yakusyoku {
							font-size: 15px;
							color:#1B904B;
						}
						.name {
							font-size: 24px;
							font-weight: bold;
							color:#1B904B;
							display: flex;
							align-items: center;
						}
							.name span {
								display: inline-block;
								font-size: 16px;
								font-family: Lato,serif;
								margin-left: 15px;
							}
								.prof-txt {
									font-size: 15px;
									line-height: 1.5;
									letter-spacing: 0.12em;
									margin: 10px 0 0;
								}
}
