#mainimage {
position: relative;
background-image: url("../image/top/mainimage.jpg");
background-size: cover;
background-position: center center;
display: grid;
place-content: center;
height: 250px;
}
#mainimage h1 {
margin: 0 0 0 20vw;
}
#mainimage h1 img {
width: 100%;
}
#top {
margin: 0px auto 0 auto;
width: 100%;
text-align: left;
}
#top h3 {
font-size: 20px;
line-height: 1.2em;
font-family: source-han-sans-jp-variable, sans-serif;
font-variation-settings: "wght" 350;
padding: 0em 0 0em 0.7em;
position: relative;
}
#top h3:before {
content: "";
background-color: #039d85;
width: 5px;
height: 6vw;
padding: 0;
display: block;
position: absolute;
left: 0;
top: 2px;
}

#service {
margin: 30px auto 0 auto;
width: 92%;
text-align: left;
}
#service ul {
margin: 20px auto 0 auto;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
#service ul li {
width: 48%;
transition: all .3s ease-out;
margin-bottom: 20px;
}
#service ul li a {
display: block;
text-decoration: none;
color: #686868;
box-sizing: border-box;
}
#service ul li img {
width: 100%;
height: auto;
box-sizing: border-box;
border: 1px solid #cccccc;
}
#service ul li h4 {
font-family: source-han-sans-jp-variable, sans-serif;
font-variation-settings: "wght" 700;
color: #000;
font-size: clamp(1rem, 0.864rem + 0.68vw, 1.375rem);
line-height: 1.5em;
padding: 0.5em 0 0.7em 0;
}
#service ul li p {
font-family: source-han-sans-jp-variable, sans-serif;
font-variation-settings: "wght" 500;
font-size: clamp(0.75rem, 0.659rem + 0.45vw, 1rem);
line-height: 1.5em;
}
#service ul li a:hover,
#service ul li a:hover h4{
text-decoration: underline;
color: #039d85;
}

#news {
background-color: #f7f7f7;
margin: 20px auto 0 auto;
}
#news .body {
width: 92%;
text-align: left;
margin: 0px auto 0 auto;
padding: 30px 0 40px 0;
}
#news .body dl {
font-family: source-han-sans-jp-variable, sans-serif;
font-variation-settings: "wght" 500;
font-size: 16px;
line-height: 1.2em;
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
align-items: center;
padding: 2em 0 1em 0;
}
#news .body dt {
color: #686868;
width: 100%;
margin-bottom: 0.3em;
}
#news .body dd {
color: #494949;
margin-bottom: 1.5em;
}
#news .body dd a {
text-decoration: none;
color: #494949;
}
#news .body dd a:hover {
text-decoration: underline;
color: #222BD0;;
}
#news .body .type1,
#news .body .type2,
#news .body .type3 {
font-size: 12px;
line-height: 1em;
background-color: #039d85;
color: #FFF;
display: inline-block;
position: relative;
padding: 0.1em 0.8em 0.3em 0.8em;
margin-left: 1em;
top: -2px;
}
#news .body .type1 {
background-color: #039d85;
}
#news .body .type2 {
background-color: #888888;
}
#news .body .type3 {
background-color: #36A2CA;
}

#news p.bt {
font-family: source-han-sans-jp-variable, sans-serif;
font-variation-settings: "wght" 350;
font-style: normal;
font-size: 16px;
line-height: 1.3em;
width: 80%;
margin: 0px auto 0 auto;
height: auto;
}
#news p.bt a {
color: #FFF;
background-color: #039d85;
display: block;
text-align: center;
text-decoration: none;
padding: 0.6em 0 0.7em 0;
position: relative;
}
#news p.bt a:after {
content: '';
box-sizing: border-box;
display: inline-block;
position: absolute;
width: 10px;
height: 10px;
border-style: solid;
border-width: 3px 3px 0 0;
border-color: #aaaaaa;
transform: rotate(45deg);
top: 38%;
right: 4%;
}
#news p.bt a:hover {
background-color: #5a5755;
}
#news p.bt a:hover:after {
right: 3%;
border-color: #FFF;
}

#aboutus {
margin: 30px auto 0 auto;
width: 92%;
text-align: left;
}
#aboutus ul {
margin: 20px auto 0 auto;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
#aboutus ul li {
width: 48%;
text-align: center;
position: relative;
transition: all .3s ease-out;
background-size: cover;
overflow: hidden;
display: block;
margin-bottom: 20px;
}
#aboutus ul li a {
font-size: clamp(0.875rem, 0.716rem + 0.8vw, 1.313rem);
line-height: 1.5em;
color: #FFF;
text-decoration: none;
height: 30vw;
display: grid;
place-content: center;
position: relative;
z-index: 15;
overflow: hidden;
background-position: center center;
}
#aboutus ul li.bt1 {
background-image: url("../image/top/aboutus_p1.jpg");
}
#aboutus ul li.bt2 {
background-image: url("../image/top/aboutus_p2.jpg");
}