@charset "UTF-8";
/* CSS Document */

/*-----------------
	mainVisual
---------------- */

.mainVisual-profile {
	background: url("../images/mainVisual-profile.png") top center no-repeat;
}

.mainVisual-history {
	background: url("../images/mainVisual-history.png") top center no-repeat;
}

.mainVisual-office-information {
	background: url("../images/mainVisual-information.png") top center no-repeat;
}

.mainVisual-message {
	background: url("../images/mainVisual-message.png");
	width: 100%;
	height: 100%;
	min-height: 1800px;
}

.mainVisual-group {
	background: url("../images/mainVisual-group.png") top center no-repeat;
}

.mainVisual-quality-assurance {
	background: url("../images/mainVisual-quality.png") top center no-repeat;
}






/*-----------------
	 company
---------------- */

.company-inner {
	margin: 100px auto;
	width: 1000px;
}






/*-----------------
	  message
---------------- */

.message01 {
	position: absolute;
	top: 10%;
	left: 45%;
	transform: translateX(-55%);
	max-width: 550px;
	padding: 5% 1.5%;
	width: 100%;
	background: linear-gradient(to bottom, rgba(0,0,0,0.5) , rgba(0,0,0,0.0));
}

.message01 h1 {
	color: #FFF;
	font-size: 24px;
	line-height: 2;
	margin-bottom: 30px;
	text-shadow: 1px 1px 1px #000;
	text-align: center;
}

.message01 p {
	color: #FFF;
	font-size: 15px;
	line-height: 3;
	margin-bottom: 50px;
	text-shadow: 1px 1px 5px #000;
	text-align: center;
}

.txt-sign {
	text-align: right;
	text-shadow: none !important;
}

.txt-sign span {
}

.txt-sign img {
	width: 200px;
}




.message02 {
	background-color: rgba(235,85,4,0.7);
	width: 100%;
	padding: 50px 0;
	position: relative;
	height: 250px;
}

.message02 h2 {
	color: #FFF;
	margin: 0;
	letter-spacing: 1rem;
	writing-mode: vertical-lr;
	position: absolute;
	bottom: 250px;
	max-width: 416px;
	width: 100%;
	left: 50%;
	transform: translateX(-50%);
	line-height: 0.5;
}

.message02 h2 span {
	color: #EA5504;
	font-size: 140%;
}

.message02 p {
	color: #FFF;
	margin-bottom: 0;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	line-height: 2;
}




/*-----------------
	 profile
---------------- */

.company-profile table {
	width: 100%;
	line-height: 2;
}

.company-profile table th {
	width: 30%;
	padding: 30px;
	border-bottom: 1px solid #ccc;
}

.company-profile table td {
	width: 70%;
	padding: 30px;
	border-bottom: 1px solid #ccc;
}

.company-profile table tr:nth-child(1) th , .company-profile table tr:nth-child(1) td {
	border-top: 1px solid #ccc;
}




/*-----------------
	  history
---------------- */


/*タイムライン全体の設定*/
.timeline{
	width:100%;
	padding:0 30px;
}

.timeline li{
    /*線の起点とするためrelativeを設定*/
    position: relative;
	list-style: none;
	padding: 20px 0;
}

.timeline dl{
	margin: 0 0 0 3em;
	display: flex;
}

.timeline dl dt {
	clear: both;
	float: left;
	width: 30%;
	font-weight: 600;
}

.timeline dl dd {
	width: 70%;
}

/*絶対配置で線を設定*/
.border-line {
    /*線の位置*/
	position: absolute;
	left:0.38em;
	top: 25px;
	width:3px;/*線の太さ*/
	height:0;/*はじめは高さを0に*/
	background: #ccc;
}

/*タイムラインの見出し横の丸の位置と形状*/
.timeline li::after{
	content:'';
	position: absolute;
	top: 25px;
	left:0;
	width:15px;
	height: 15px;
	background:#ED6C00;
	border-radius: 50%;
}

.timeline li:last-child .border-line {
	display: none;
}




/*-------------------------
	 office-information
------------------------ */

.office-information h1 {
	font-size: 24px;
	color: #004098;
	margin-bottom: 30px;
	font-weight: 600;
}

.office-information ul {
	padding: 0;
	font-size: 95%;
	line-height: 1.6;
}

.office-information .col-md-4 img {
	width: 100%;
}

.office-information .col-md-4 p {
	margin: 0;
}

.office-information .col-md-4 p span {
	padding-top: 5px;
	display: inline-block;
	font-size: 90%;
}

.office-information dl {
	font-size: 90%;
	padding: 0;
}

.office-information dl dt {
	 clear: both;
	 float: left;
	 width: 10%;
	text-align: center;
}

.office-information dl dd {
	 width: 90%;
	 margin-left: 10%;
	margin-bottom: 5px;
}


.office-information .img-office-information05 img {
	margin: 0 calc(50% - 50vw);
	width: 100vw;
}




/*-----------------------
	  group-company
---------------------- */

.group-company h1 {
	font-size: 24px;
	color: #004098;
	font-weight: 600;
	margin-bottom: 30px;
}

.group-company h2 {
	font-size: 18px;
	font-weight: 600;
}

.group-company p {
	line-height: 1.8;
	margin-bottom: 30px !important;
}

.group-company ul {
	padding: 0;
	font-size: 95%;
	line-height: 1.6;
}

.ul-flex li:last-child {
	margin-left: 52px;
}



/*-----------------------
    quality-assurance
---------------------- */

.quality-assurance h1 {
	text-align: center;
	font-size: 34px;
	margin-bottom: 50px;
}

.quality-assurance p {
	font-size: 100%;
	line-height: 2;
}

.quality-assurance .bg-gray ol {
	padding-left: 25px;
	font-size: 24px;
	color: #004098;
	font-weight: 600;
	line-height: 2;
	margin: 50px 0;
}

.quality-assurance .col-12 {
	margin-bottom: 30px !important;
}


.quality-assurance .col-md-5 p:nth-child(1) {
	font-size: 15px;
	margin: 0;
}

.quality-assurance .col-md-5 p:nth-child(2) {
	font-size: 18px;
}

.quality-assurance .col-md-5 p:nth-child(2) span {
	font-size: 110%;
	letter-spacing: 0.5rem;
}

.quality-assurance h2 {
	color: #004098;
	font-size: 24px;
	margin-bottom: 20px;
}

.quality-assurance h3 {
	font-size: 18px;
	color: #004098;
	margin: 20px 0;
}

.quality-assurance h3:nth-child(3) {
	margin-top: 40px;
}


.quality-assurance .bg-white ol {
	padding-left: 20px;
	font-size: 90%;
	line-height: 2;
	margin: 30px 0;
}

.txt-sign02 {
	margin: 15px 0 0 !important;
}

.txt-sign02 span {
	padding-right: 20px;
}

.txt-sign02 img {
	width: 150px;
}




@media screen and ( max-width:767px ) {
	
	
	/*----------------------
	     mainVisual(sp)
	--------------------- */
	
	.mainVisual-message {
		background: url("../images/mainVisual-message-sp01.png") center right no-repeat;
		min-height: 830px;
		background-size: 100% 100% !important;
	}

	.mainVisual-profile {
	}

	.mainVisual-history {
	}

	.mainVisual-office-information {
	}

	.mainVisual-group {
	}

	.mainVisual-quality-assurance {
	}
	
	
	/*-------------------
	     company(sp)
	------------------ */

	.company-inner {
		margin: 50px auto;
		width: 100%;
		padding: 0 3%;
	}
	
	
	
	/*----------------------
	      message(sp)
	--------------------- */
	
	.mainVisual-message + .breadcrumbs {
		position: absolute;
		top: 0;
	}

	.message01 {
		top: 8%;
		max-width: 350px;
		padding: 5% 3%;
		background: linear-gradient(rgba(0,0,0,0.4), rgba(0,0,0,0.0));
	}

	.message01 h1 {
		font-size: 120%;
		line-height: 1.8;
		margin-bottom: 20px;
	}

	.message01 p {
		font-size: 85%;
		line-height: 2;
		margin-bottom: 20px;
	}

	.txt-sign {
		margin-bottom: 30px;
	}

	.txt-sign span {
	}




	.message02 {
		padding: 30px 3%;
		height: 300px;
	}

	.message02 h2 {
		margin: 0 0 10px;
		writing-mode: inherit;
		position: static;
		max-width: 100%;
		transform: none;
		line-height: 1.5;
		font-size: 150%;
		text-align: center;
	}

	.message02 h2 span {
	}

	.message02 p {
		font-size: 90%;
		padding: 0 3%;
		max-width: 420px;
		width: 100%;
	}
	
	
	
	
	/*-----------------
	    profile(sp)
	---------------- */

	.company-profile table {
		line-height: 1.8;
		font-size: 90%;
	}

	.company-profile table th {
		width: 100%;
		padding: 3% 2%;
		display: block;
	}

	.company-profile table td {
		width: 100%;
		padding: 3% 2%;
		display: block;
		border-bottom: none;
		margin-bottom: 20px;
	}

	.company-profile table tr:nth-child(1) th , .company-profile table tr:nth-child(1) td {
		border-top: none;
	}
	
	
	
	
	/*----------------------
	      history(sp)
	--------------------- */


	/* タイムライン全体の設定 */
	
	.timeline {
		padding:0 3%;
	}

	.timeline li {
    	/*線の起点とするためrelativeを設定*/
		padding: 10px 0;
	}

	.timeline dl {
		margin: 0 0 10px 2em;
		display: block;
	}

	.timeline dl dt {
		float: none;
		width: 100%;
		margin-bottom: 5px;
	}

	.timeline dl dd {
		margin-bottom: 0;
		font-size: 90%;
		width: 100%;
	}

	/*絶対配置で線を設定*/
	.border-line {
    	/*線の位置*/
		position: absolute;
		top: 14px;
	}

	/*タイムラインの見出し横の丸の位置と形状*/
	.timeline li::after{
		top: 14px;
	}

	.timeline li:last-child .border-line {
	}
	
	
	
	
	/*------------------------------
	 	 office-information(sp)
	----------------------------- */

	.office-information h1 {
		font-size: 130%;
		margin-bottom: 20px;
	}

	.office-information ul {
		font-size: 90%;
	}

	.office-information .col-md-4 img {
	}
	
	.office-information .col-md-4:nth-child(2) p {
		margin-bottom: 20px;
	}

	.office-information .col-md-4 p span {
	}

	.office-information dl {
		font-size: 85%;
		padding: 0 15px;
	}

	.office-information dl dt {
	 	width: 20%;
		text-align: left;
	}

	.office-information dl dd {
	 	width: 80%;
		margin-left: 20%;
	}
	
	.office-information iframe {
		width: 100%;
		height: 350px;
		padding: 0 3%;
	}
	
	.img-office-information05 {
		margin-bottom: 0;
	}
	
	.office-information .img-office-information05 img {
		max-width: none;
		height: 120px;
	}
	
	
	
	/*--------------------------
	 	  group-company(sp)
	------------------------- */

	.group-company h1 {
		font-size: 130%;
		margin-bottom: 20px;
	}

	.group-company h2 {
		font-size: 110%;
	}

	.group-company p {
		margin-bottom: 20px;
		font-size: 90%;
	}

	.group-company ul {
		font-size: 90%;
	}

	.ul-flex li:last-child {
		margin-left: 5%;
	}
	
	.group-company .col-md-6:nth-child(2) {
		margin-bottom: 40px;
	}
	
	.group-company .col-md-6:nth-child(2) p {
		margin-bottom: 0;
	}
	
	.group-company .row:last-child .col-md-6:nth-child(2) {
		margin-bottom: 0;
	}
	
	.group-company .ul-flex {
		margin-bottom: 0;
	}
	
	
	
	
	
	
	/*----------------------------
    	quality-assurance(sp)
	--------------------------- */
	
	.quality-assurance  .breadcrumbs ul li a {
		font-size: 90%;
	}
	
	.quality-assurance .breadcrumbs ul li:first-child a {
		font-size: 110%;
	}

	.quality-assurance h1 {
		font-size: 150%;
		margin-bottom: 30px;
	}

	.quality-assurance p {
		font-size: 90%;
	}

	.quality-assurance .bg-gray ol {
		font-size: 120%;
		line-height: 1.8;
		margin: 20px 0;
	}

	.quality-assurance .col-12 {
		margin: 0 0 20px;
	}
	
	.quality-assurance .col-md-3 {
		text-align: right;
	}


	.quality-assurance .col-md-5 p:nth-child(1) {
		font-size: 95%;
		text-align: right;
	}

	.quality-assurance .col-md-5 p:nth-child(2) {
		font-size: 110%;
		text-align: right;
	}

	.quality-assurance .col-md-5 p:nth-child(2) span {
		font-size: 90%;
		letter-spacing: normal;
	}

	.quality-assurance h2 {
		font-size: 120%;
	}

	.quality-assurance h3 {
		font-size: 110%;
		margin: 10px 0;
	}

	.quality-assurance h3:nth-child(3) {
		margin-top: 20px;
	}


	.quality-assurance .bg-white ol {
		margin: 20px 0;
	}
	
	.quality-assurance  .col-md-4 {
		margin-bottom: 10px;
	}
	
	.txt-sign02 {
		margin-top: 10px;
	}

	.txt-sign02 span {
		padding-right: 10px;
	}

	.txt-sign02 img {
	}
	
	
}









@media only screen and (min-width:576px) and (max-width:767px) {
	
	/*---------------------------------
	     mainVisual(sp:576px-767px)
	-------------------------------- */
	
	.mainVisual-message {
		background: url("../images/mainVisual-message-sp02.png") center left no-repeat;
		min-height: 950px;
	}
	
	/*--------------------------------
	     message(sp:576px-767px)
	------------------------------- */
	
	.message01 {
		top: 8%;
		max-width: 450px;
	}
	
	.message01 p {
		font-size: 90%;
	}
	
	/*---------------------------
	    profile(sp:576px-767px)
	-------------------------- */

	.company-profile table {
		line-height: 1.8;
		font-size: 95%;
	}

	.company-profile table th {
		width: 25%;
		padding: 3% 2%;
		display: table-cell;
	}

	.company-profile table td {
		width: 75%;
		padding: 3% 2%;
		display: table-cell;
		border-bottom: 1px solid #ccc;
		
	}

	.company-profile table tr:nth-child(1) th , .company-profile table tr:nth-child(1) td {
		border-top: 1px solid #ccc;
	}
	
	
	
}







@media only screen and (min-width:768px) and (max-width:1199px) {
	
	
	/*----------------------
	     mainVisual(tab)
	--------------------- */

.mainVisual-profile {
	background: url("../images/mainVisual-profile.png") top center no-repeat;
}

.mainVisual-history {
	background: url("../images/mainVisual-history.png") top center no-repeat;
}

.mainVisual-office-information {
	background: url("../images/mainVisual-information.png") top center no-repeat;
}

	.mainVisual-message {
		background: url("../images/mainVisual-message-tab.png") center center;
		min-height: 1200px;
	}

.mainVisual-group {
	background: url("../images/mainVisual-group.png") top center no-repeat;
}

.mainVisual-quality-assurance {
	background: url("../images/mainVisual-quality.png") top center no-repeat;
}
	
	/*----------------------
	 	  company(tab)
	--------------------- */

	.company-inner {
		margin: 80px auto;
		width: 100%;
		padding: 0 3%;
	}
	
	/*----------------------
	 	  message(tab)
	--------------------- */

	.message01 {
		top: 5%;
		left: 40%;
		transform: translateX(-60%);
		max-width: 450px;
		padding: 4% 2%;
	}

	.message01 h1 {
		font-size: 140%;
		line-height: 1.8;
		margin-bottom: 20px;
	}

	.message01 p {
		font-size: 90%;
		line-height: 2.5;
		margin-bottom: 30px;
	}
	
	.message01 p .br-sp {
		display: none;
	}

	.txt-sign {
	}

	.txt-sign span {
	}

	.txt-sign img {
	}




	.message02 {
		padding: 40px 0;
		height: 220px;
	}

	.message02 h2 {
		letter-spacing: 0.6rem;
	}

	.message02 h2 span {
		font-size: 150%;
	}

	.message02 p {
		font-size: 90%;
	}
	
	
	
	
	/*----------------------
	 	  profile(tab)
	--------------------- */

	.company-profile table {
		line-height: 1.8;
	}

	.company-profile table th {
		padding: 25px;
		width:25%;
	}

	.company-profile table td {
		padding: 25px;
		width: 75%;
	}

	.company-profile table tr:nth-child(1) th , .company-profile table tr:nth-child(1) td {
	}
	
	
	
	
	/*----------------------
	 	  history(tab)
	--------------------- */


	/*タイムライン全体の設定*/
	
	.timeline {
	}

	.timeline li {
    	/*線の起点とするためrelativeを設定*/
	}

	.timeline dl {
	}

	.timeline dl dt {
		width: 25%;
	}

	.timeline dl dd {
		width: 75%;
		margin-bottom: 0;
	}

	/*絶対配置で線を設定*/
	.border-line {
	}

	/*タイムラインの見出し横の丸の位置と形状*/
	.timeline li::after{
	}

	.timeline li:last-child .border-line {
	}
	
	
	
	
	/*------------------------------
	 	office-information(tab)
	----------------------------- */

	.office-information h1 {
		font-size: 150%;
	}

	.office-information ul {
		font-size: 90%;
	}

	.office-information .col-md-4 img {
	}

	.office-information .col-md-4 p {
	}

	.office-information .col-md-4 p span {
		font-size: 85%;
	}

	.office-information dl {
	}

	.office-information dl dt {
	}

	.office-information dl dd {
	}


	.office-information .img-office-information05 img {
	}
	
	
	
	
	/*----------------------------
		  group-company(tab)
	--------------------------- */

	.group-company h1 {
		font-size: 150%;
		margin-bottom: 20px;
	}

	.group-company h2 {
		font-size: 110%;
	}

	.group-company p {
		font-size: 95%;
	}
	
	.group-company p .br-sp {
		display: none;
	}
	
	.group-company p img {
		width: 100%;
	}

	.group-company ul {
		font-size: 90%;
	}

	.ul-flex li:last-child {
	}
	
	.group-company .ul-flex li img {
		width: 100%;
	}
	
	
	
	
	
	/*----------------------------
    	quality-assurance(tab)
	--------------------------- */

	.quality-assurance h1 {
		font-size: 200%;
		margin-bottom: 30px;
	}

	.quality-assurance p {
		line-height: 1.8;
	}

	.quality-assurance .bg-gray ol {
		font-size: 150%;
		line-height: 1.8;
		margin: 40px 0;
	}

	.quality-assurance .col-12 {
	}


	.quality-assurance .col-md-5 p:nth-child(1) {
		font-size: 95%;
	}

	.quality-assurance .col-md-5 p:nth-child(2) {
		font-size: 110%;
		line-height: 2.5;
	}

	.quality-assurance .col-md-5 p:nth-child(2) span {
		font-size: 105%;
		letter-spacing: 0.3rem;
	}

	.quality-assurance h2 {
		font-size: 150%;
		margin-bottom: 10px;
	}

	.quality-assurance h3 {
		font-size: 115%;
		margin: 20px 0 10px;
	}

	.quality-assurance h3:nth-child(3) {
		margin-top: 30px;
	}


	.quality-assurance .bg-white ol {
		font-size: 90%;
		line-height: 1.8;
		margin: 20px 0;
	}

	.txt-sign02 {
	}

	.txt-sign02 span {
	}

	.txt-sign02 img {
	}
	
	
	
	
	
}



