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

@media (min-width: 1160px) {
	/*
	 * CSS Custom property
	 * ========================================================================== */
	:root {
		/* color */
		/* font-famiry */
		/* base layout, base size */
		--section-margin-base: 128px;
		--section-width-base: 1100px;
		--section-width-toppage: 1100px;
	}

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

	/*
	 * break point control CSS
	 * ================================================ */
	.hide_pc,
	.hide_pc_inline,
	.show_sp,
	.show_tab,
	.show_sp_inline,
	.show_tab_inline,
	.break_sp,
	.break_tab {
		display: none!important;
	}

	.show_pc {
		display: block!important;
	}

	.break_pc,
	.show_pc_inline {
		display: inline!important;
	}

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

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

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

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

	header .inner_header {
		overflow: visible;
	}

	header .header_main {
		display: flex;
		justify-content: space-between;
		padding-left: calc((100% - 1100px) / 2);
		padding-right: calc((100% - 1100px) / 2);
	}

	/*
	 * inner header
	 * ================================================ */
	header .inner_header .logo {
		width: 260px;
		height: 120px;
	}

	header .inner_header .logo img {
		height: 60px;
	}

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

	/*
	 * burger trigger
	 * ------------------------------------------------ */
	header .trigger {
		display: none;
	}

	/*
	 * header overlay
	 * ------------------------------------------------ */
	header .overlay {
		opacity: 0;
		visibility: hidden;
	}

	/*
	 * header navigation pannel
	 * ------------------------------------------------ */
	header .navPanel {
		display: block;
		position: static;
		visibility: visible;
		opacity: 1;
		padding: 0;
		width: 100%;
		max-width: 100%;
		overflow: visible;
	}

	/*
	 * main navigation
	 * ------------------------------------------------ */
	header .navPanel .nav_wrapper {
		padding: 0;
		overflow: visible;
	}

	/*
	 * main items
	 * ------------------------ */
	header .navPanel ul {
		display: flex;
		padding: 0;
		width: 100%;
		height: 100%;
		border: none;
	}

	header .navPanel ul li {
		display: flex;
		align-items: stretch;
		border: none;
	}

	header .navPanel ul li.subitem {
		display: none;
	}

	header .navPanel ul li a {
		display: flex;
		align-items: center;
		height: 100%;
		padding: 0 10px;
	}

	header .navPanel ul.nav_items>li:hover>a::before,
	header .navPanel ul.nav_items>li.group:hover .boss a::before,
	header .navPanel ul.nav_items>li>a:focus::before,
	header .navPanel ul.nav_items>li.group .boss a:focus::before {
		display: block;
		content: "";
		position: absolute;
		top: auto;
		bottom: 0;
		left: 0;
		right: 0;
		margin: 0 auto;
		width: 3em;
		height: 8px;
		background: var(--matsushin-blue);
	}

	header .navPanel ul li span.arrow,
	header .navPanel ul li span.button,
	header .navPanel ul li span.outer {
		display: none;
	}

	/*
	 * sub category items
	 * ------------------------ */
	header .navPanel ul li.group .subcate {
		display: block;
		visibility: hidden;
		opacity: 0;
		position: absolute;
		top: 100%;
		left: 0;
		padding: 32px 0 16px;
		border-bottom: solid 1px #fff;
		background: var(--matsushin-blue);
		transition: all 200ms;
	}

	header .navPanel ul li.group:hover .subcate {
		visibility: visible;
		opacity: 1;
	}

	header .navPanel ul li .subcate ul.sub_items {
		flex-wrap: wrap;
		margin: 0 auto;
		width: 996px;
	}

	header .navPanel ul li .subcate ul.sub_items li {
		margin: 0 16px 16px 0;
		width: 320px;
		border: none;
		text-align: center;
	}

	header .navPanel ul li .subcate ul.sub_items li:nth-child(3n) {
		margin-right: 0;
	}

	header .navPanel ul li .subcate ul.sub_items li a {
		display: flex;
		padding: 0;
		width: 100%;
		text-align: left;
		background: #fff;
	}

	header .navPanel ul li .subcate ul.sub_items li a .thumbnail {
		display: block;
		margin-right: 16px;
		width: 120px;
		height: 96px;
		background: var(--accent-gray-dark);
		flex-shrink: 1;
		overflow: hidden;
	}

	header .navPanel ul li .subcate ul.sub_items li a:hover {
		color: var(--matsushin-blue);
	}

	header .navPanel ul li .subcate ul.sub_items li a .thumbnail img {
		transition: all 200ms;
	}

	header .navPanel ul li .subcate ul.sub_items li a:hover .thumbnail img {
		transform: scale(1.3);
	}

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

	/*
	 * footer
	 * ========================================================================== */
	footer {
		padding: 32px 0;
	}

	footer .inner_footer {
		display: flex;
		flex-direction: row-reverse;
		justify-content: space-between;
		padding: 0;
	}

	footer nav {
		display: block;
	}

	footer nav ul {
		display: flex;
	}

	footer nav ul li {
		margin-left: 2em;
		font-size: 1.4rem;
	}

	footer nav a {
		color: #fff;
		text-decoration: none;
	}

	footer nav a:hover {
		color: #fff;
		text-decoration: underline;
	}

	/*
	 * Java Scriipt CSS
	 * ========================================================================== */

	/*
	 * colorbox
	 * ------------------------------------------------ */
	#cboxOverlay {
		background: #fff!important;
	}

	#cboxLoadedContent {
		border: solid 1px #666;
	}

	#cboxLoadedContent video {
		display: block;
		height: auto;
		width: auto;
		max-width: none;
		max-height: 80vh;
	}

	@media screen and (orientation: portrait) {
		#cboxLoadedContent video {
			max-width: 80vw;
			max-height: none;
		}
	}

	/*
	 * buttons css
	 * ------------------------ */
	#cboxPrevious,
	#cboxNext,
	#cboxSlideshow,
	#cboxClose {}

	#cboxWrapper #cboxContent {
		margin: 40px 40px 0;
	}

	#cboxWrapper #cboxPrevious,
	#cboxWrapper #cboxNext,
	#cboxWrapper #cboxClose {}

	#cboxWrapper #cboxPrevious,
	#cboxWrapper #cboxNext {
		top: 0;
	}

	#cboxWrapper #cboxPrevious {
		top: 0;
		left: -40px;
		right: auto;
		height: 100%;
	}

	#cboxWrapper #cboxNext {
		top: 0;
		left: auto;
		right: -40px;
		height: 100%;
	}

	#cboxWrapper #cboxPrevious::after,
	#cboxWrapper #cboxNext::after,
	#cboxWrapper #cboxClose:after {
		display:block;
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		transition: all 500ms 0s ease;
		background: var(--matsushin-blue);
	}

	#cboxWrapper #cboxPrevious:hover::after,
	#cboxWrapper #cboxNext:hover::after,
	#cboxWrapper #cboxClose:hover:after {
		background: var(--matsushin-red);
	}

	#cboxWrapper #cboxClose::after {
		-webkit-mask: url("../images/js/colorbox/close.svg") no-repeat center / contain;
	}

	#cboxWrapper #cboxPrevious::after {
		-webkit-mask: url("../images/js/colorbox/preview.svg") no-repeat center / contain;
	}

	#cboxWrapper #cboxNext::after {
		-webkit-mask: url("../images/js/colorbox/next.svg") no-repeat center / contain;
	}

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

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

	/*
	 * hero
	 * -------------------------------------------------------------------------- */
	.hero {
		margin: 80px 0;
	}

	.hero_title {
		margin-bottom: 80px;
	}

	.hero_title .overhead {
		margin-bottom: 40px;
		font-size: 7.2rem;
		line-height: 8.8rem;
	}

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

	/*
	 * infomation box
	 * -------------------------------------------------------------------------- */
	.top .additional_info h2 {
		width: 280px;
	}

	.top .additional_info dl {
		width: calc(100% - 280px);
	}

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

	.top .activity .content_box {
		display: flex;
		justify-content: space-between;
	}

	.top .activity p {
		margin-bottom: 0;
		width: 320px;
		line-height: 4.8rem;
	}

	.top .activity ul {
		margin: 0;
		width: 680px;
		max-width: 100%;
	}

	.top .activity ul li {
		padding-bottom: 48px;
	}

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

	/*
	 * work results
	 * -------------------------------------------------------------------------- */
	.top .work_result .content_box {
		flex: 0 0 480px;
		padding: 128px 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 .button_area {
		margin: 0;
	}

	/*
	 * technorogy solition
	 * -------------------------------------------------------------------------- */
	.top .tech_solition {
		padding: 128px 0 80px;
	}

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

	.top .tech_solition .items {
		margin: 0 auto;
	}

	.top .tech_solition .items li {
		margin: 0 46px 48px 0;
		max-width: 336px;
	}

	.top .tech_solition .items li:nth-child(2n) {
		margin-right: 46px;
	}

	.top .tech_solition .items li:nth-child(3n) {
		margin-right: 0;
		transition: opacity 500ms 400ms, transform 500ms 400ms;
	}

	.top .tech_solition .items li:nth-child(3n+1) {
		transition: opacity 500ms 0ms, transform 500ms 0ms;
	}

	.top .tech_solition .items li:nth-child(3n+2) {
		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 {
		padding: 160px 0;
	}

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

	.top .sustainability h2 .overhead,
	.top .sustainability h2 .title_text,
	.top .sustainability p,
	.top .sustainability .button_area {
		padding-left: 24px;
		padding-right: 24px;
	}

	.top .sustainability .button_area {
		justify-content: flex-start;
	}

	.top .sustainability .button_area {
		margin: 0;
		padding: 0;
	}

	/*
	 * recruit
	 * -------------------------------------------------------------------------- */
	.top .recruit .inner_section {
		display: flex;
		width: 100%;
	}

	.top .recruit .content_box {
		flex: 0 0 480px;
		padding: 48px 0;
	}

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

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

	.top .recruit .button_area {
		margin: 0;
	}

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

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

	/*
	 * content page common
	 * -------------------------------------------------------------------------- */
	.head {
		margin-bottom: 128px;
		padding: 100px 0;
	}

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

	h1 .overhead {
		font-size: 6rem;
		line-height: 9rem;
	}

	h1 .title_text {
		line-height: 4rem;
	}

	h2 {
		font-size: 3.2rem;
		line-height: 4.8rem;
	}

	/*
	 * lead trext
	 * ------------------------------------------------ */
	.lead {
		margin-bottom: 180px;
	}

	/*
	 * Door page
	 * -------------------------------------------------------------------------- */
	.door .door_items {
		width: 1256px;
	}

	.door .door_items li {
		margin-bottom: 64px;
	}

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

	.door .door_items li:nth-child(3n) {
		margin-right: 0;
	}

	.door .door_items li .thumbnail {
		position: relative;
	}

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

	/*
	 * greeting
	 * -------------------------------------------------------------------------- */
	.greeting .greeting_text,
	.greeting .greeting_photo {
		margin: 0 auto 80px;
		width: 980px;
	}

	.greeting .greeting_photo .photo_box {
		flex-shrink: 1;
		flex-grow: 1;
	}


	.greeting .greeting_photo .photo_box img {
		margin: 0 auto;
	}

	.greeting .signature {}

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

	.philosophy p {
		font-size: 2rem;
		line-height: 4rem;
	}

	.philosophy .motto ul li {
		font-size: 3.2rem;
		line-height: 6.4rem;
	}

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

	/*
	 * profile data
	 * ------------------------ */
	dl.profile_data {
		width: 526px;
	}

	/*
	 * business license
	 * ------------------------ */
	.license ul {
		display: flex;
		justify-content: space-between;
	}

	.license ul li {
		margin: 0;
		padding: 0;
		width: 526px;
		border: 0;
	}

	.license ul li .license_pdf {
		width: 128px;
	}

	/*
	 * Access
	 * -------------------------------------------------------------------------- */
	.access_item {
		margin-bottom: 80px;
	}

	.access_item .office_infomation {
		margin-bottom: 48px;
	}

	.access_item .office_data {
		margin-right: 32px;
		width: 400px;
	}

	.access_item .office_map {
		flex: 1 1 auto;
		width: auto;
	}

	.access_item .photo_box {}

	.access_item h2 {}

	.access_item dl.address {
		display: grid;
		grid-template-columns: max-content 1fr;
		gap: 0.5em 1em;
	}

	.access_item dl.address dt,
	.access_item dl.address dd {
		margin:0;
	}

	/*
	 * gallery
	 * ------------------------ */
	.access_item .gallery ul.items li {
		margin-right: 24px;
		width: 334px;
	}

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

	.access_item .gallery ul.items li:nth-child(3n) {
		margin-right: 0;
	}

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

	/*
	 * item: line and marker
	 * ------------------------ */
	.chronology {
		list-style: none;
		margin: 0 auto;
		max-width: 1100px;
	}

	.chronology li {
		padding: 0 64px 64px;
		width: 551px
	}

	.chronology li:first-child {
		border-image: linear-gradient(to bottom, transparent 0%, transparent 2.4rem, var(--matsushin-blue) 1.2rem) 1;
	}

	.chronology h2::before {
		top: calc(2.4rem - 6px);
		width: 16px;
		height: 16px;
	}

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

	.chronology li:nth-child(even) h2::before {
		left: -73px;
	}
	/*
	 * item: data
	 * ------------------------ */
	.chronology dl {
		font-size: 1.8rem;
		line-height: 2.8rem;
	}

	.chronology dl dt {
		margin-bottom: 4px;
		font-size: 2rem;
	}

	.chronology dl dd {
		margin-bottom: 8px;
	}

	/*
	 * activity news
	 * -------------------------------------------------------------------------- */
	.activity_news ul.event_items li {
		margin: 0 24px 24px 0;
		width: 306px;
	}

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

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

	/*
	 * Client, Manufacture Company list
	 * -------------------------------------------------------------------------- */
	.client .items,
	.manufacture .items {
		grid-template-columns: 1fr 1fr 1fr;
	}

	/*
	 * Society
	 * -------------------------------------------------------------------------- */
	.society .inner_section {}

	.society .strip_zone .inner_section {}

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

	/*
	 * technology / Solution
	 * ========================================================================== */
	.technology .inner_section {}

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

	/*
	 * e\equipment items
	 * ------------------------ */	
	.technology.equipment .photo_box {
		margin-bottom: 0;
		width: 640px;
	}


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

	/*
	 * work results
	 * ========================================================================== */
	.work_result .result_items {
		gap: 80px 64px;
	}

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

	/*
	 * sustainability
	 * ========================================================================== */
	.sustainability .content_box,
	.sustainability .photo_box {
		width: 512px;
	}


	/*
	 * Inquiry
	 * ========================================================================== */

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

	/*
	 * Sub content common
	 * -------------------------------------------------------------------------- */

	/*
	 * privacy policy
	 * -------------------------------------------------------------------------- */

	/*
	 * Site map
	 * -------------------------------------------------------------------------- */
	.sitemap .inner_main>div {
		width: 512px;
	}

	.sitemap section {
		width: 334px;
	}

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

	.sitemap section:nth-child(3n) {
		margin-right: 0;
	}

}