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

.times-color {
	color: #99CC33;
}

h2{
	font-size: 60px;
	font-weight: bold;
	line-height: 0.5;
	padding-top: 8rem;
	padding-bottom: 5rem;
	position: relative;
}
h2::before {
	position: absolute;
	content: url("../img/line.svg");
	top: 38%;
	left: -11%;
	width: 129px;
}
#recruit h2::before {
	content: none;
}

h2 span{
	font-size: 19px;
	color: #1a1a1a;
	letter-spacing: 0.2rem;
}

h3 {
	font-size: 23px;
	font-weight: normal;
}

/*---------------▼header---------------*/
header {
    postion: -webkit-sticky;
    position: sticky;
    top: 0;
	z-index: 100;
	background: #fff;
}

header h1 {
	font-size: 35px;
	font-weight: bold;
	padding: 0.5rem;
}

header h1 span {
	font-size: 14px;
	font-weight: normal;
}

header p {
	text-align: right;
	padding: 0rem;
	display: grid;
    align-items: flex-end;
	font-weight: bold;
}


.header1 {
	border-bottom: 1px solid #333333;
}
.header2 ul {
	margin-bottom: 0px;
}

.header2 ul li {
	display: inline-block;
	font-weight: bold;
}

.header2 ul li a {
	color: #99CC33;
	display: inline-block;
	padding: 1rem 3rem;
}

.header2 ul li:hover {
	background: #99CC33;
    transition: 0.3s;
}

.header2 ul li a:hover {
	color: #ffffff;
}


/*---------------▼MAIN---------------*/
#main {
	position: relative;
}
#main .swiper-slide img {
	width: 100vw;
}
#main p{
	text-align: center;
	color: #FFFFFF;
	font-size: 75px;
	font-size: 7.5rem;
	font-weight: bold;
	line-height: 10rem;
	text-shadow: 0px 0px 6rem #030959;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit-transform: translateY(-50%) translateX(-50%);
	z-index: 2;
}


/*---------------▼SERVICE---------------*/
#service {
	color: #ffffff;
}
#service h3 {
	padding-bottom: 2rem;
}
#service p {
	font-weight: normal;
	line-height: 3.3rem;
	text-align: justify;
}
#service .service-right {
	background-color: #87969e;
	padding: 6rem 4rem;
}
#service .service-left {
	background-color: #86B32D;
	padding: 6rem 4rem;
}

/*---------------▼COMPANY---------------*/
#company .company-profile {
	width: 90%;
	position: relative;
}

#company .company-box {
	background-color: #ffffff;
	box-shadow: 1rem 1rem 2rem -1rem #d9d9d9;
	border-radius: 0.5rem;
	padding: 3rem;
	position: absolute;
	width: 83%;
	top: 90%;
	right: -11%;
}

#company .company-img {
	margin-top: 18rem;
}


/*---------------▼OUTLINE---------------*/
/*
#outline dl {
	font-size: 16px;
	margin-bottom: 0px;
}
#outline dt {
	float: left;
	clear: left;
    width: 13%;
    background-color:#ccf2f4;
    padding:6px 6px 6px 3%;
}
#outline dd {
    padding:6px 6px 6px 16%;
	margin-bottom: 0px;
	border-bottom: 1px solid #a1a1a1;
	background-color: #edfafb;
}
*/
#outline-innar {
	background: rgb(204,242,244);
	background: linear-gradient(90deg, rgba(140,200,31,1) 0%, rgba(241, 250, 207, 1) 100%);
}

#outline table {
	width: 100%;
    margin-top: -28px;
}
#outline tr + tr {
	border-top: 1px solid #a1a1a1;
}
#outline tr th {
	font-weight: normal;
    background-color:#99CC33;
	width: 20%;
}
#outline td {
    background-color:#ECF3CC;
	width: 80%;
}
#outline td,th {
	padding: 8px 5px 8px 5rem ;
}


/*---------------▼HISTORY---------------*/
#history-inner {
	background: rgb(204,242,244);
	background: linear-gradient(90deg, rgba(204,242,244,1) 0%, rgba(237,250,251,1) 100%);
}

#history table {
	width: 100%;
    margin-top: -28px;
}
/*
#history tr + tr {
	border-top: 1px solid #a1a1a1;
}
*/
#history tr th {
	font-weight: normal;
    background-color:#ccf2f4;
	width: 20%;
}
#history td {
    background-color:#edfafb;
	width: 80%;
}
#history td,th {
	padding: 8px 50px 8px 5rem ;
}
#history table span{
	float: right;
}


/*---------------▼WORKS---------------*/
#works a {
	color: #575757;
}

#works img {
	border: 0.75px solid #adadad;
/*	overflow:hidden; ズームする*/
}
#works a img:hover {
	opacity:0.5;
	transition:0.3s;
/*ズームする
	transform:scale(1.3);
	transition:0.3s;
*/
}
#works .works-list {
	font-size: 20px;
	height: 60%;
	padding: 0rem 8rem 6rem 8rem;
}
#works .works-list span {
	font-size: 13px;
}


/*---------------▼CONTACT---------------*/
#contact {
	overflow: hidden;
}

#contact .contact-box {
	background: #99CC33;
	margin: 0 -500%;
	padding: 0 500%;
}

/* ---------------------- for JavaScript ここから ---------------------- */
form#mail_form dl dt span.required{
	display : inline-block;
	color : #fff;
	line-height : 1;
	margin-right: 0.5rem;
    padding: 0.4rem 0.5rem;
    background-color: #ee6352;
    font-size: 90%;
    border-radius: 3px;
	font-weight: normal;
}
form#mail_form dl dt span.optional{
	display: none;
}
form#mail_form dl dd span.error_blank,
form#mail_form dl dd span.error_format,
form#mail_form dl dd span.error_match{
	display : block;
	color : #ff0000;
	margin-top : 3px;
}
span.loading{
	width : 50px;
	height : 50px;
	border-radius : 50%;
	border-top : 5px solid rgba( 255, 255, 255, 0.2 );
	border-right : 5px solid rgba( 255, 255, 255, 0.2 );
	border-bottom : 5px solid rgba( 255, 255, 255, 0.2 );
	border-left : 5px solid #ffffff;
	-webkit-transform : translateZ( 0 );
	-ms-transform : translateZ( 0 );
	transform : translateZ( 0 );
	-webkit-animation : load-circle 1.0s linear infinite;
	animation : load-circle 1.0s linear infinite;
	position : absolute;
	top : 50%;
	left : 50%;
	margin-top : -25px;
	margin-left : -25px;
}
@-webkit-keyframes load-circle{
	0%{
		-webkit-transform : rotate( 0deg );
		transform : rotate( 0deg );
	}
	100%{
		-webkit-transform : rotate( 360deg );
		transform : rotate( 360deg );
	}
}
@keyframes load-circle{
	0%{
		-webkit-transform : rotate( 0deg );
		transform : rotate( 0deg );
	}
	100%{
		-webkit-transform : rotate( 360deg );
		transform : rotate( 360deg );
	}
}
form#mail_form dt {
    margin-top: 2rem;
    padding-top: 2rem;
}

form#mail_form dd:last-child{
	padding-bottom: 2rem;
}
form#mail_form input[type="text"],
form#mail_form input[type="email"],
form#mail_form input[type="tel"],
form#mail_form textarea{
	width : 100%;
	padding : 0.5rem 1rem;
	border : 1px solid #cccccc;
	border-radius : 3px;
	background : #efefef;
	-webkit-appearance : none;
	font-size : 18px;
	margin-top : 5px;
}
form#mail_form input[type="text"]:focus,
form#mail_form input[type="email"]:focus,
form#mail_form input[type="tel"]:focus,
form#mail_form textarea:focus{
	border : 1px solid #595858;
	background-color: #ededed;
}
form#mail_form ul li input[type="radio"],
form#mail_form ul li input[type="checkbox"]{
	margin-right : 10px;
	margin-top : 7px;
}
form#mail_form ul li:first-child input[type="radio"],
form#mail_form ul li:first-child input[type="checkbox"]{
	margin-top : 0px;
}
form#mail_form select{
	font-size : 100%;
	margin-top : 5px;
}
form#mail_form textarea{
	display : block;
	width : 100%;
	max-width : 100%;
	height : 266px;
	padding : 1rem;
	resize : vertical;
	border : 1px solid #cccccc;
	border-radius : 3px;
	background : #efefef;
	-webkit-appearance : none;
	font-size : 100%;
	font-family : inherit;
}
form#mail_form ul{
	list-style-type : none;
}
form#mail_form ul li label:hover{
	cursor : pointer;
}
form#mail_form input#postal{
	width: 30%;
}
form#mail_form input#postal + a{
	display : inline-block;
	padding : 5px 15px;
	background : #004ea2;
	border-radius : 3px;
	color : #ffffff;
	font-family : inherit;
	text-decoration : none;
	border: solid 1px #004ea2;
	font-size: 18px;
	font-size: 1.8rem;
	font-weight: bold;
}
form#mail_form input#postal + a:hover{
	background : #ffffff;
	color: #004ea2;
	border: solid 1px #fff;
	transition:0.3s;
}
form#mail_form ul.kind-list li{
	display: inline-block;
	min-width: 40%;
}
form#mail_form p#form_submit{
	width : 90%;
	margin : 0 auto;
	padding : 30px 0 60px 0;
}
form#mail_form input[type="button"]{
	padding : 20px 30px;
	font-weight: bold;
	font-size: 20px;
	font-size: 2rem;
	vertical-align : middle;
	line-height : 1;
	border: 1px solid #004ea2;
	background : #004ea2;
	border-radius : 0.5rem;
	color : #ffffff;
	-webkit-appearance : none;
}
form#mail_form input[type="button"]:hover{
	cursor : pointer;
	background : #ffffff;
	color: #004ea2;
	border: 1px solid #004ea2;
	transition:0.3s;
}

form#mail_form input[type="text"], form#mail_form input[type="email"], form#mail_form input[type="tel"], form#mail_form textarea {
    background-color: #ffffff;
}

/*-----------ここまで-----------*/
#privacypolicy {
	border: solid 0.7px #000;
	padding: 3rem;
	width: 90%;
	margin-top: 2rem;
	background-color: #fff;
    margin: 1rem auto;
}

#privacypolicy p:nth-of-type(1) {
	font-size: 20px;
	font-size: 2rem;
	color: #3f3c37;
	font-weight: bold;
}

#privacypolicy p:nth-of-type(2) {
	font-size: 16px;
	font-size: 1.6rem;
	color: #3f3c37;
}

.google-map {
	height: 20em;
}


/*---------------▼RECRUIT---------------*/
#recruit {
	color: #ffffff;
	text-align: center;
	background : url("../img/recruit.jpg") no-repeat center;
	background-size: cover;
    height: 36rem;
}
#recruit span {
	color: #FFFFFF;
}
#recruit a {
	font-size: 20px;
	color: #ffffff;
}

#recruit a::before {
	font-family: "Font Awesome 5 Free";
	content: "\f0e0";
}
#recruit a:hover {
	opacity:0.5;
	transition:0.3s;
}

/*---------------▼footer---------------*/
footer div.container {
	padding: 7rem;
}
footer div.container span {
	font-size: 32px;
	font-weight: bold;
}
.copyright {
	font-size: 14px;
    text-align: center;
	border-top: solid #000000 1px;
	padding: 1rem;
}




/* ↓　lg 幅以下の時に反映される設定　↓ */
@media only screen and (max-width: 1199px) {
h2{
	padding-left: 5rem;
	}
h2::before {
	left: -9%;
}
/*---------------▼header---------------*/
/*---------------▼MAIN---------------*/
#main p {
	font-size: 7rem;
	line-height: 8rem;
}
/*---------------▼SERVICE---------------*/
#service .service-right {
	padding: 3rem 4rem;
}
#service .service-left {
	padding: 3rem 4rem;
}

/*---------------▼COMPANY---------------*/
#company .company-box {
	width: 100%;
	top: 90%;
	right: -11%;
}
/*---------------▼OUTLINE---------------*/
/*---------------▼HISTORY---------------*/
#history tr th {
	width: 25%;
}
/*---------------▼WORKS---------------*/
/*---------------▼CONTACT---------------*/
/*---------------▼footer---------------*/
}
	

/* ↓　md 幅以下の時に反映される設定　↓ */
@media only screen and (max-width: 991px) {
h2::before {
	left: -12%;
}
/*---------------▼header---------------*/
/*---------------▼MAIN---------------*/
/*---------------▼SERVICE---------------*/
#service h3 {
	padding-bottom: 1rem;
	font-size: 22px;
	}
#service p {
	line-height: 2.5rem;
}
#service .service-right {
	padding: 2rem 4rem;
}
#service .service-left {
	padding: 2rem 4rem;
}
/*---------------▼COMPANY---------------*/
#company .company-box {
	width: 105%;
}

/*---------------▼OUTLINE---------------*/
#outline table {
    margin-top: -24px;
}
/*---------------▼HISTORY---------------*/
#history table {
	width: 100%;
    margin-top: -25px;
}
#history td,th {
	padding: 8px 25px 8px 2rem ;
}
/*---------------▼WORKS---------------*/
/*---------------▼CONTACT---------------*/
/*---------------▼footer---------------*/
}


/* ↓　sm 幅以下の時に反映される設定　↓ */
@media only screen and (max-width: 767px) {
h2{
	padding-left: 0rem;
}
h2::before {
	content: none;
}
/*---------------▼header---------------*/
.header1 {
	border-bottom: none;
}
/*---------------▼MAIN---------------*/
#main .swiper-slide img {
	height: 350px;
}
#main .swiper-slide img {
	width: 100%;
	object-fit: cover;
}

#main p{
	font-size: 4rem;
	line-height: 5rem;
	text-shadow: 0px 0px 2rem #030959;
}
/*---------------▼SERVICE---------------*/
#service p {
	line-height: 3rem;
}
#service .service-right {
	padding: 4rem 4rem;
}
#service .service-left {
	padding: 4rem 4rem;
}
/*---------------▼COMPANY---------------*/
#company .company-img {
	margin-top: 26rem;
}
#company .company-img ul li {
	padding: 0.8rem;
}

/*---------------▼OUTLINE---------------*/
/*---------------▼HISTORY---------------*/

/*---------------▼WORKS---------------*/
/*---------------▼CONTACT---------------*/
#privacypolicy {
	line-height: 2.5rem;
	font-size: 1.5rem;
}
/*---------------▼footer---------------*/
footer div.container {
	padding: 4rem 2rem;
	line-height: 2.5rem;
	font-size: 1.5rem;
}
footer div.container span {
	font-size: 20px;
}
}



/* ↓　col 幅以下の時に反映される設定　↓ */
@media only screen and (max-width: 575px) {
header {
    position: static;
}
/*---------------▼SERVICE---------------*/
#service p {
	line-height: 2.5rem;
	font-size: 1.5rem;
	}
#service .service-right {
	background-color: #87969e;
	padding: 4rem 2rem;
}
#service .service-left {
	background-color: #99CC33;
	padding: 4rem 2rem;
}
	
/*---------------▼COMPANY---------------*/
#company .company-img {
	margin-top: 29rem;
}
#company ul li {
	line-height: 2.5rem;
	font-size: 1.5rem;
}

/*---------------▼OUTLINE---------------*/
table tr th,
table tr td {
    display: block!important;
    width: 100%!important;
    padding-left: 1rem!important;
}
/*---------------▼HISTORY---------------*/
    #history {
        overflow-x: hidden;
    }
#history table span{
	float: none;
}	
/*---------------▼WORKS---------------*/
#works .works-list {
		padding: 0rem 2rem 4rem 2rem;
}
	
/*---------------▼CONTACT---------------*/
#contact dd {
	margin-bottom: -2.5rem!important;
}

/*---------------▼footer---------------*/	
	
}

@media only screen and (max-width: 420px) {
header h1 {
	font-size: 32px;
}
/*---------------▼MAIN---------------*/
#main p{
	color: #FFFFFF;
	font-size: 4rem;
	font-weight: bold;
	line-height: 5rem;
	text-shadow: 0px 0px 2rem #030959;
}
/*---------------▼COMPANY---------------*/
#company .company-img {
	margin-top: 29rem;
}
/*---------------▼OUTLINE---------------*/
#outline-innar {
	background: #fff;
}
/*---------------▼HISTORY---------------*/
#history-inner {
	background: #fff;
}
}