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

@media (min-width: 768px) {
	/*
	 * CSS Custom property
	 * ========================================================================== */
	:root {
		/* color */
		/* font-famiry */
		/* base layout, base size */
		--section-gutter-base: 0;
		--section-width-base: 720px;
		--section-width-toppage: 720px;
	}

		/*
	 * Utility class
	 * ========================================================================== */

	/*
	 * break point control CSS
	 * ================================================ */
	.hide_tab,
	.hide_tab_inline,
	.show_sp,
	.show_pc,
	.show_sp_inline,
	.show_pc_inline,
	.break_sp,
	.break_pc {
		display: none!important;
	}

	.hide_sp,
	.show_tab {
		display: block!important;
	}

	.break_tab,
	.show_tab_inline {
		display: inline!important;
	}

	/*
	 * Page header
	 * ========================================================================== */

	/*
	 * skip link
	 * -------------------------------------------------------------------------- */

	/*
	 * header main
	 * -------------------------------------------------------------------------- */
	header {
		height: 60px;
	}

	header .header_main {
		padding: 0 32px;
	}

	/*
	 * logo
	 * ================================================ */
	header .inner_header .logo {}

	header .inner_header .logo img {}

	/*
	 * inner header
	 * ================================================ */

	/*
	 * header overlay
	 * ------------------------------------------------ */

	/*
	 * header navigation pannel
	 * ------------------------------------------------ */

	/*
	 * main navigation
	 * ------------------------------------------------ */

	/*
	 * main items
	 * ------------------------ */

	/*
	 * sub category items
	 * ------------------------ */

	/*
	 * icons
	 * ------------------------ */

	/*
	 * footer
	 * ========================================================================== */
	footer .inner_footer {
		margin: 0 auto;
		width: var(--section-width-base);
	}

	/*
	 * Top page css
	 * ========================================================================== */

	/*
	 * top common
	 * -------------------------------------------------------------------------- */
	.top h2 {
		margin-bottom: 32px;
		font-size: 3.2rem;
		line-height: 4rem;
	}

	.top h2 .overhead {
		margin-bottom: 10px;
	}

	.top p {
		font-size: 1.8rem;
	}

	.top section .inner_section {
		margin: 0 auto;
		padding: var(--section-gutter-base);
		width: var(--section-width-toppage);
	}

	/*
	 * hero
	 * -------------------------------------------------------------------------- */
	.hero {
		margin: 64px 0 80px;
		padding: 0 0 0 calc((100% - var(--section-width-toppage)) / 2);
	}

	.hero_title {
		width: 100%;
	}

	.hero_title .overhead {
		margin-bottom: 24px;
		font-size: 4rem;
		line-height: 4.8rem;
	}

	.hero_title .title_text {
		font-size: 1.8rem;
		line-height: 2.4rem;
	}

	.hero_image {
		width: 100%;
	}

	/*
	 * infomation box
	 * -------------------------------------------------------------------------- */
	.top .additional_info {
		margin-bottom: 80px;
	}

	.top .additional_info .inner_section {
		display: flex;
		margin: 0 auto;
		width: var(--section-width-toppage);
	}

	.top .additional_info h2 {
		display: flex;
		align-items: center;
		justify-content: center;
		margin: 0;
		width: 10em;
		text-align: center;
	}

	.top .additional_info dl {
		width: calc(100% - 18rem);
	}

	/*
	 * activity
	 * -------------------------------------------------------------------------- */
	.top .strip_zone .activity {
		padding: 64px 0;
	}

	.top .activity p {
		margin-bottom: 48px;
	}

	.top .activity ul {
		display: flex;
		justify-content: space-between;
		max-width: 680px;
	}

	.top .activity ul li {
		padding: 22px;
		width: 280px;
		background: #fff;
	}

	.top .activity ul li:first-child {
		margin-bottom: 0;
	}

	.top .activity ul li .thumbnail {
		margin-bottom: 24px;
	}

	.top .activity ul li h3 {
		margin-bottom: 24px;
		color: var(--matsushin-red);
		font-size: 1.6rem;
		text-align: center;
	}

	.top .activity ul li span {
		font-size: 1.6rem;
		line-height: 2.4rem;
	}


	/*
	 * work results
	 * -------------------------------------------------------------------------- */
	.top .work_result {
		padding: 0 calc((100% - var(--section-width-toppage)) / 2) 0 0;
	}

	.top .work_result .inner_section {
		display: flex;
		flex-direction: row-reverse;
		padding: 0;
		width: 100%;
	}
	
	.top .work_result .content_box {
		flex: 0 0 280px;
		padding: 48px 0;
	}

	.top .work_result h2 .overhead,
	.top .work_result h2 .title_text {
		padding-left: 32px;
	}

	.top .work_result p,
	.top .work_result .button_area {
		padding-left: 32px;
	}

	.top .work_result .bg_photo {
		flex: 1 1 auto;
		margin-top: 0;
		height:auto;
	}

	/*
	 * technorogy solition
	 * -------------------------------------------------------------------------- */
	.top .tech_solition {
		padding: 64px 0 16px;
	}

	.top .tech_solition .items {
		display: flex;
		flex-wrap: wrap;
		width: 720px;
		max-width: none;
	}

	.top .tech_solition .items li {
		margin: 0 48px 48px 0;
		max-width: 336px;
		transition: opacity 500ms, transform 500ms;
	}
	
	.top .tech_solition .items li:nth-child(2n) {
		margin-right: 0;
		transition: opacity 500ms 200ms, transform 500ms 200ms;
	}

	.top .tech_solition .items li a {
		text-decoration: none;
	}

	.top .tech_solition .items li .thumbnail {
		margin-bottom: 16px;
	}

	/*
	 * Sustainability
	 * -------------------------------------------------------------------------- */
	.top .strip_zone section.sustainability {}

	.top .sustainability .content_box {
		margin-left: auto;
		padding: 30px;
		width: 280px;
		background: rgba(255,255,255,0.8);
	}

	/*
	 * recruit
	 * -------------------------------------------------------------------------- */
	.top .strip_zone section.recruit {
		padding: 0 0 0 calc((100% - var(--section-width-toppage)) / 2);
	}
	.top .recruit .inner_section {
		display: flex;
		padding: 0;
		width: 100%;
	}
	
	.top .recruit .content_box {
		flex: 0 0 280px;
		padding: 48px 0;
	}
	
	.top .recruit  h2 .overhead {}

	.top .recruit h2 .overhead,
	.top .recruit h2 .title_text {
		padding-right: 32px;
	}

	.top .recruit p,
	.top .recruit .button_area {
		padding-right: 32px;
	}

	.top .recruit .bg_photo {
		flex: 1 1 auto;
		margin-top: 0;
		height:auto;
	}

	/*
	 * content pages
	 * ========================================================================== */

	/*
	 * bread crumbs list
	 * -------------------------------------------------------------------------- */
	nav.breadcrumbs {
		display: block;
		padding: 16px 0;
		border-top: solid 1px #d1d1d1;
		border-bottom: solid 1px #d1d1d1;
	}
	
	nav.breadcrumbs ol {
		list-style: none;
		display: flex;
		margin: 0 auto;
		width: var(--section-width-base);
		font-size: 1.4rem;
		line-height: 2rem;
	}

	nav.breadcrumbs li {
		display: flex;
		margin-right: 1em;
	}

	nav.breadcrumbs li::after {
		display: block;
		content: "/";
	}

	nav.breadcrumbs li:last-child {
		margin-right: 0;
	}

	nav.breadcrumbs li:last-child::after {
		display: none;
	}

	nav.breadcrumbs li a,
	nav.breadcrumbs li>span {
		display: block;
		margin-right: 1em;
		color: #333;
		text-decoration: none;
	}

	nav.breadcrumbs li:last-child a,
	nav.breadcrumbs li:last-child>span {
		margin-right: 0;
	}

	nav.breadcrumbs li a:hover {
		color: var(--matsushin-red);
	}

	/*
	 * content page common
	 * -------------------------------------------------------------------------- */
	main {
		margin-bottom: 160px;
	}

	.head {
		padding: 64px 0;
	}

	h1 {
		margin: 0 auto;
		width: var(--section-width-base);
		text-align: left;
	}

	h1 .overhead {
		font-size: 3.6rem;
		line-height: 4.8rem;
	}

	.photo_box .photo_items {
		grid-template-columns: 1fr 1fr;
		padding-bottom: 50px;
	}

	.photo_box .photo_items li:nth-child(2n) {
		transform: translateY(50px);
	}

	/*
	 * lead trext
	 * ------------------------------------------------ */
	.lead {
		margin-bottom: 96px;
		font-size: 2.8rem;
		line-height: 5rem;
		text-align: center;
	}

	/*
	 * Door page
	 * -------------------------------------------------------------------------- */
	.door .door_items {
		display: flex;
		flex-wrap: wrap;
		margin: 0 auto;
		width: 612px;
	}

	.door .door_items li {
		margin-right: 32px;
		width: 288px;
	}
	
	.door .door_items li:nth-child(2n) {
		margin-right: 0;
	}

	/*
	 * corporate infomation pages
	 * ========================================================================== */

	/*
	 * greeting
	 * -------------------------------------------------------------------------- */
	.greeting .greeting_photo {
		display: flex;
		justify-content: space-between;
	}

	.greeting .photo_box {
		margin-bottom: 0;
/*
		margin-right: 48px;
*/
	}

	/*
	 * philosophy
	 * -------------------------------------------------------------------------- */
	section.philosophy {
		margin-bottom: 160px;
	}

	.philosophy .photo_box img {
		margin: 0 auto;
	}

	.philosophy p {
		text-align: center;
	}

	.philosophy .motto ul li {
		text-align: center;
	}

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

	/*
	 * profile data
	 * ------------------------ */
	.profile .data_wrap {
		display: flex;
		justify-content: space-between;
	}

	dl.profile_data {
		width: 344px;
	}

	/*
	 * business license
	 * ------------------------ */
	.license ul li .license_pdf {
		width: 128px;
	}

	.license ul li .license_data {
		margin-left: 32px;
		width: calc(100% - 158px);
	}

	.license ul li .license_data h3 {
		margin-bottom: 8px;
		font-size: 1.6rem;
		line-height: 2.4rem;
	}

	.license ul li .license_data dl {
		display: grid;
		grid-template-columns: max-content 1fr;
		gap: 0.5em 0;
	}

	.license ul li .license_data dl dt {
		grid-column: 1;
		margin: 0;
	}

	.license ul li .license_data dl dt::after {
		display: none;
	}

	.license ul li .license_data dl dd {
		grid-column: 2;
		margin: 0;
		padding-left: 1em;
		text-indent: -1em;
	}
	
	.license ul li .license_data dl dd::before {
		display: inline;
		content: "：";
	}

	/*
	 * Access
	 * -------------------------------------------------------------------------- */
	.access_item {
		padding: 32px;
	}
	
	.access_item .office_infomation {
		display: flex;
		justify-content: space-between;
	}

	.access_item .office_data,
	.access_item .office_map {
		margin-bottom: 0;
		width: 310px;
	}

	/*
	 * gallery
	 * ------------------------ */
	.access_item .gallery ul.items {
		display: flex;
		flex-wrap: wrap;
	}

	.access_item .gallery ul.items li {
		margin: 0 32px 32px 0;
		width: 310px;
	}

	.access_item .gallery ul.items li:nth-child(2n) {
		margin-right: 0;
	}
	
	.access_item .gallery ul.items li img {
		margin-bottom: 8px;
	}

	.access_item .gallery ul.items li span {
		font-size: 1.4rem;
	}

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

	/*
	 * item: line and marker
	 * ------------------------ */
	.chronology {
		list-style: none;
	}

	.chronology li {
		padding: 0 32px 64px;
		width: 361px;
		box-sizing: border-box;
	}
	
	.chronology li:nth-child(odd) {
		border-left: none;
		border-right: solid 2px;
		border-color: var(--matushin-blue);
		border-color: #00f;
		text-align: right;
	}
	
	.chronology li:nth-child(even) {
		margin-left: auto;
		text-align: left;
	}

	.chronology li:nth-child(odd) h2::before {
		right: -39px;
		left: auto;
	}

	.chronology li:nth-child(even) h2::before {
		left: -39px;
		right: auto;
	}

	/*
	 * item: data
	 * ------------------------ */
	.chronology dl {
		font-size: 1.6rem;
		line-height: 2.4rem;
	}

	.chronology dl dt {
		font-weight: bold;
	}

	/*
	 * activity news
	 * -------------------------------------------------------------------------- */
	.activity_news ul.event_items {
		flex-direction: row;
		align-items: stretch;
	}

	.activity_news ul.event_items li {
		margin: 0 16px 16px 0;
		width: 226px;
	}

	.activity_news ul.event_items li:nth-child(3n) {
		margin-right: 0;
	}

	.activity_news .backnumber ul.items {
		display: flex;
		flex-wrap: wrap;
	}

	.activity_news .backnumber ul.items li {
		margin: 0 24px 24px 0;
	}

	/*
	 * Client, Manufacture Company list
	 * -------------------------------------------------------------------------- */

	/*
	 * Society
	 * -------------------------------------------------------------------------- */
	.society .inner_section {
		display: flex;
		justify-content: space-between;
	}
	
	.society .strip_zone .inner_section {
		flex-direction: row-reverse;
	}

	.society .content_box,
	.society .photo_box {
		width: 320px;
	}

	/*
	 * technology / Solution
	 * ========================================================================== */
	.technology .inner_section {
		display: flex;
		justify-content: space-between;
	}
	
	.technology .strip_zone .inner_section {
		flex-direction: row-reverse;
	}

	.technology .content_box,
	.technology .photo_box {
		width: 320px;
	}

	/*
	 * e\equipment items
	 * ------------------------ */
	.technology.equipment .inner_section {
		flex-direction: row-reverse;
	}

	.technology.equipment section:nth-child(2n) .inner_section {
		flex-direction: row;
	}
	
	.technology.equipment .photo_box {
		margin-bottom: 0;
		width: 360px;
	}

	
	.technology.equipment .content_box {
		margin-bottom: 0;
		width: 320px;
	}

	/*
	 * Qualified person
	 * ------------------------ */
	.technology.qualified_person .inner_section {
		display: block;
		width: 640px!important;
	}
	
	.technology.qualified_person table {
		margin: 0 auto;
	}

	.technology.qualified_person table th,
	.technology.qualified_person table td {
		padding: 10px 16px 14px;
	}


	/*
	 * work results
	 * ========================================================================== */
	.work_result .result_items {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 48px 24px;
	}


	.work_result .result_items li {
		margin-bottom: 0;
	}

	.work_result .result_items li:nth-child(2n) {
		transform: translateY(64px);
	}

	/*
	 * sustainability
	 * ========================================================================== */
	.sustainability .inner_section {
		display: flex;
		justify-content: space-between;
	}
	
	.sustainability .strip_zone .inner_section {
		flex-direction: row-reverse;
	}

	.sustainability .content_box,
	.sustainability .photo_box {
		width: 320px;
	}

	/*
	 * Inquiry
	 * ========================================================================== */
	.inquiry .inner_section {
		max-width: 720px;
	}
	
	.inquiry .form_item {}

	.inquiry form h2 {}

	.inquiry .required-item {}

	.inquiry strong.confirm {}

	.inquiry form .sample {}

	.inquiry .privacy_agreement {}

	.inquiry .checkbox_area {}

	.inquiry label.privacy {}

	input[type="text"],
	input[type="tel"],
	input[type="email"],
	textarea {}

	input#postal {
		width: 8em;
	}

	input#tel,
	input#fax {
		width: 12em;
	}

	/*
	 * other inquiry items
	 * ------------------------------------------------ */
	.other_inquiry_items .flex_wrapper {
		display: flex;
		align-items: stretch;
		justify-content: space-between;
	}
	.other_inquiry_items .item {
		margin-bottom: 0;
		width: 336px;
	}

	.other_inquiry_items .item .nolink,
	.other_inquiry_items .item a {
		height: 100%;
	}


	.other_inquiry_items .item a {}

	.other_inquiry_items .item a:hover,
	.other_inquiry_items .item a:focus {}

	.other_inquiry_items .item p {}

	.other_inquiry_items .item .number {
		margin-top: auto;
	}

/*
 * buttons
 * ------------------------ */
.mfp_buttons {
	flex-direction: row;
	align-content: stretch;
}

.mfp_buttons button {}

.mfp_buttons button#mfp_button_send {}

.mfp_buttons button:hover,
.mfp_buttons button:focus {}

.mfp_buttons button:active {}

/*
 * MFP - mail form pro 4 CSS
 * -------------------------------------------------------------------------- */

/*
 * comfirmation css
 * ------------------------ */
div#mfp_phase_confirm_inner {}

/* all elements */
.mfp_element_all {}

/* inner area css */
div#mfp_phase_confirm_inner h4 {}

/* overlay */
div#mfp_overlay {}

div#mfp_overlay_inner {}

div#mfp_overlay_background {}

div#mfp_loading_screen {}

div#mfp_loading {}

/* hidden item */
#mfp_hidden {}

/*error message*/
.mfp_err {}

.problem {}






	/*
	 * 
	 * ========================================================================== */

	/*
	 * 
	 * -------------------------------------------------------------------------- */

	/*
	 * 
	 * ================================================ */

	/*
	 * 
	 * ------------------------------------------------ */


	/*
	 * 
	 * ------------------------ */

	/*
	 * Sub COntent Page
	 * ========================================================================== */

	/*
	 * Sub content common
	 * -------------------------------------------------------------------------- */
	.subcontent .head h1 {
		justify-content: flex-start;
		font-size: 3.2rem;
	}

	/*
	 * privacy policy
	 * -------------------------------------------------------------------------- */
	.privacy .inner_section {
		width: var(--section-width-base);
	}

	/*
	 * Site map
	 * -------------------------------------------------------------------------- */
	.sitemap .inner_main {
		display: flex;
		flex-wrap: wrap;
		width: var(--section-width-base);
	}

	.sitemap section {
		width: 336px;
		margin-right: 48px;
	}
	
	.sitemap section:nth-child(2n) {
		margin-right: 0;
	}

}