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

@media screen and (max-width:736px) {
	html, body {
		min-width: 0;
		width: 100%;
		height: 100%;
		-webkit-text-size-adjust : 100%;
	}

	img {
		max-width: 100% !important;
		height: auto;
	}

	.is-sp {
		display: inherit;
	}
	
	.is-pc {
		display: none;
	}
	
	a[href^="tel:"] {
		pointer-events: auto;
	}
	
	input[type="submit"] {
	  appearance: none;
	  -webkit-appearance: none;
	}
	
	.inner {
		box-sizing: border-box;
		max-width: 100%;
		width: 92%;
		margin: 0 auto;
	}
	
	
	header,
	header.is-show{display: none;}
	
	.sp-nav {
		background: #787878;
		padding: 2rem;
		align-items: center;
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		z-index: 1000 !important;
	}
	
	.sp-nav h1 {width: 60%;}
	.sp-nav h1 img {vertical-align: middle;}
	
	/*-----------------------------

	main-fv

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

	#main-fv {
	  position: relative;
	  width: 100vw;
	  height: 80vh;
	  overflow: hidden;
	  opacity: 0;
	  animation: fadeIn 2s forwards;
	}
	
	

	#main-fv .main-logo img,
	#main-fv .main-ttl img,
	#main-fv .main-txt img,
	#main-fv .line01 img,
	#main-fv .line02 img,
	#main-fv .line03 img{
	  width: 100%;
	  height: 80vh;
	  background-size: cover;
	  background-position: center;
	  background-repeat: no-repeat;
	}
	
	#main-fv .top-bt {
		width: 50%;
		position: absolute;
		bottom: 16%;
	}

	
	h2.ttl {
		font-size: 1.6rem;
		font-weight: 700;
		text-align: center;
	}

	ul.top-service {
		flex-wrap: wrap;
		align-items: center;
		margin-top: -5rem;
	}

	ul.top-service li {
		position: relative;
		width: 100%;
		max-width: 100%;
		min-height: 100%;
		margin-bottom: 2rem;
		padding: 2rem 1rem 3rem;
		background-image: none;
		background-color: #e0e2e4;
	}
	
	ul.top-service li h2 {
		width: 90%;
		font-size: 1.6rem;
		font-weight: bold;
		padding: 1rem 0 0.5rem;
		margin: 0 auto 1.7rem;
	}

	ul.top-service li .service-inner .service-name, 
	ul.top-service li .service-inner .service-img {
		width: 50%;
		max-width: 50%;
		text-align: center;
	}
	
	ul.top-service li .service-inner .service-name {padding: 0 3rem;}
	ul.top-service li:nth-child(3) h2  {
		border-bottom: 1.7px solid #ffbe00; 
		width: 90%;
		margin: 0 auto 1.7rem;
	}
	
	/*ul.top-service li:last-child {background: none;}*/
	.top-numbers {
		background: url("../img/page/top/bg.jpg") no-repeat center;
		background-size: cover;
		padding: 5rem 0;
	}

	.top-numbers h2 {padding-top: 0;}
	.top-numbers .ttl-line {margin-bottom: 3rem;}

	.top-numbers .inner {
		box-sizing: border-box;
		max-width: 1090px;
		width: 100%;
		margin: 0 auto;
	}


	.ttl-line {text-align: center;}

	.top-numbers {position: relative; margin-top: 5rem;}
	.top-numbers .left {
		position: absolute;
		bottom: 0;
		left: 0;
	}
	.top-numbers ul.numbers-list {
		padding: 0 3rem;
		display: grid;
		grid-template-columns: repeat(1, 1fr);
		gap: 1rem;
		text-align: center;
		border-right: none;
		position: relative;
		z-index: 2;
	}

	.top-numbers ul.numbers-list li {
		border-left: none;
		padding: 3rem 0;
		background-color: rgba(255, 255, 255, 0.7);
	}
	
	.top-numbers ul.numbers-list li .numbers-icon {min-height: 71px;}
	.top-numbers ul.numbers-list li:nth-child(2) .numbers-icon,
	.top-numbers ul.numbers-list li:nth-child(3) .numbers-icon{padding-top: 1rem;}
	.top-numbers ul.numbers-list li h3 {
		font-size: 1.8rem;
		font-weight: 500;
		padding-top: 1rem;
	}

	.top-numbers ul.numbers-list li p {
		font-size: 1.6rem;
		margin-top: -1rem;
		font-weight: 600;
		letter-spacing: 0;
	}

	.top-numbers ul.numbers-list .num-txt {
		font-size: 3.2rem;
		font-weight: bold;
	}
	
	.top-numbers ul.numbers-list .num-txt span.num {
		font-size: 4.8rem;
		font-weight: 500;
	}	
	
	ul.top-link {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 0;
	}
	
	ul.top-link li h3 {
		width: 101px;
		height: 81px;
		font-size: 1.2rem;
	}
	
	
	/*-----------------------------

	main-page

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

	#main-page {
		padding: 13rem 3rem 0;
	}

	#main-page h2 {margin-bottom: 1rem;}	
	
	/*-----------------------------

	company

	------------------------------*/
	.company {margin-top: 5rem;}
	table.company-table {
		width: 100%; 
		margin-bottom: 5rem;
	}

	table.company-table td, 
	table.company-table th {
		width: 100%;
		display: block;
		font-size: 1.4rem;
		text-align: left;
		line-height: 2;
		padding: 2rem;
	}
	
	table.company-table th br {display: none;}
	table.company-table td .graph-img {padding: 1rem;}
	
	/*-----------------------------

	message

	------------------------------*/
	.message-top {
		margin: 5rem auto;
		padding: 3rem;
		position: inherit;
		flex-wrap: wrap;
		justify-content: flex-end;
	}

	.message-top .message-txt {
		width: 100%;
		position: inherit;
		top: 0;
		left: 0;
		order: 2;
	}

	.message-top h2 {
		font-size: 2.4rem;
		text-align: center;
	}

	.message-top p {
		color: #000;
		text-align: center;
		margin: 1rem 0 0;
		width: 100%;
		font-size: 1.6rem;
		padding: 0;
		border-bottom: 1px solid #fff;
		line-height: 1.2;
		font-weight: 600;
		letter-spacing: 0.2rem;
	}

	.message-top p span {
		font-size: 2.8rem;
		padding-top: 0.5rem;
	}

	.message-top .message-img {
		order: 1;
		margin-bottom: 1rem;
	}

	
	.message-list {margin-bottom: 5rem;}
	.message-list ul {}
	.message-list ul li {}
	.message-list ul li + li {margin-top: 2rem;}

	.message-list ul li h2 {
		position: relative;
		z-index: 2;
		font-size: 1.6rem;
		min-height: 199px;
		padding: 2rem 0 0;
		letter-spacing: 0;
		background-size: 100%;
	}

	.message-list ul li .message-txtarea {
		margin-left: auto;
		width: 100%;
		padding: 5rem 0 4rem;
		background-size: 100% 100%;
		margin-top: -10rem;
	}

	.message-list ul li .message-txtarea p {
		width: 100%;
		padding: 0 2rem;
		margin-left: auto;
		font-size: 1.4rem;
		line-height: 1.8;
		letter-spacing: 0;
	}

	.message-list ul li .message-txtarea p + p {margin-top: 2rem;}
	
	/*-----------------------------

	sdgs

	------------------------------*/
	.sdgs {margin-top: 5rem;}

	.sdgs-top {
		padding: 3rem;
		background: #c6f3d9;
		margin-bottom: 5rem;
	}

	.sdgs-top p {
		font-size: 1.8rem;
		font-weight: 500;
		line-height: 1.6;
	}

	.sdgs-img {
		text-align: center;
		margin-bottom: 5rem;
	}

	h2.sdgs-ttl {
		font-size: 1.8rem;
		padding: 0.3rem 0;

	}
	ul.sdgs-list {margin-bottom: 5rem;}
	ul.sdgs-list li + li {margin-top: 3rem;}

	ul.sdgs-list li .sdgs-list-img {margin-bottom: 3rem;}
	ul.sdgs-list li h3 {
		color: #00bcaf;
		font-size: 1.6rem;
		font-weight: 600;
		margin-bottom: 0.5rem;
	}
	
	ul.sdgs-list li p {
		font-size: 1.3rem;
		line-height: 1.8;
	}

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

	activity

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

	.activity-top {
		margin: 5rem auto;
		padding: 2rem;
	}

	.activity-top p {
		font-size: 1.6rem;
		line-height: 1.8;
		text-align: center;
		letter-spacing: 0;
	}
	
	.activity-list {margin-bottom: 5rem;}
	.activity-list ul li .activity-item {
		display: flex;
		flex-wrap: wrap;
	}

	.activity-list ul li .activity-img {
		flex: 0 0 100%;
		border: 1px solid #e35d00;
	}

	.activity-list ul li .activity-img img {
		width: 100%;
		height: auto;
		display: block;
	}

	.activity-list ul li .activity-txt {
		flex: 1;
		font-size: 1.8rem;
		letter-spacing: 0;
		font-weight: 600;
		line-height: 1.6;
		background-size: cover;
		margin-top: 0;
	}

	.activity-list ul li .activity-txt p {
		min-height: inherit;
		border-bottom: 1px solid #e35d00;
		padding: 3rem !important;
		letter-spacing: 0;
	}

	.activity-list ul li .activity-txt p.txt01 {padding-top: 0;}
	.activity-list ul li .activity-txt p.txt02 {padding-top: 0;}
	

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

	footer

	------------------------------*/
	footer {
		background-size: auto 50%;
		background-position: bottom right;
		padding: 3rem;
	}
	
	footer .footer-inner {
		flex-wrap: wrap;
	}

	footer .footer-logo {
		width: 100%;
		margin: 0 auto;
		text-align: center;
		position: relative;
		z-index: 10 !important;
	}

	footer .f-logo {
		display: block;		
		width: 60%;
		max-width: 60%;
		margin: 0 auto;
	}

	footer .footer-info {
		width: 100rem;
		max-width: 100rem;
		padding: 3rem 0 0 0;
	}
	
	footer .footer-info .footer-company {
		font-size: 1.6rem;
		text-align: center;
	}

	footer .footer-info .footer-address {
		font-size: 1.4rem;
		font-weight: 600;
		line-height: 1.6;
		letter-spacing: 0.1rem;
		text-align: center;
		margin-bottom: 3rem;
	}

	footer ul.footer-nav {
		width: 100rem;
		max-width: 100rem;
	}
	footer ul.footer-nav {flex-wrap: wrap;}
	footer ul.footer-nav li {
		width: 100%;
		display: block;
	}
	
	footer ul.footer-nav li a {
		font-size: 1.4rem;
		font-weight: bold;
		display: block;
		padding: 2rem;
		border-bottom: 1px solid #fff;
	}

	
	
	
	
	



}