@charset "utf-8";
/*
Theme Name: atozSunfish
Auther: AtoZ service
*/
/*** Google Fontsを利用する ***/
@import url('https://fonts.googleapis.com/css?family=Raleway&display=swap');
/********** 変数 **********/
:root {
  
  --primary-font-size: 16px;
  --header-pc-min-width: 100px;
  --header-pc-max-width: 220px;
  --logo-pc-min-height: 100px;
  --menubar-font-size: 16px; /* 文字サイズ */
  
  --pagetop-companyinfo-height: 70px;
  --menubar-height: 50px;
  --header-height: calc(var(--pagetop-companyinfo-height) + var(--menubar-height));
  
  --primary-color: #0c2a55;
  --second-color: #8db7cf;
  --primary-font-color: whitesmoke;
  --body-bg-color: var(--primary-color);
  --side-margin: 10%;
  --middle-side-margin: calc(10% / 2);
  --min-side-margin: 0%;
  --link-font-color: var(--second-color);
  --link-text-decoration: none;
  --menu-bg-color: rgba(141, 183, 207, 0.8);
  --menu-border-color: var(--primary-font-color);
  --menu-hover-bg-color: rgba(12, 42, 85, 0.8);
  --menu-font-size: 160%;
  --page-title-color: var(--primary-color);
  --page-title-line-color: var(--second-color);
  --heading-font-color: var(--primary-font-color); /* 見出しの文字色 */
  --heading-font-weight: bolder;    /* 見出しの文字の太さ */
  --primary-point-color: var(--second-color);
  --second-point-color: var(--primary-color);
  --section-bg-color: rgba(12,42,85,0.8);
  --section-bg-sub-color: rgba(158,179,105,0.8);
  --section-heading-font-color: var(--second-color);
  --section-heading-font-weight: bolder;
  --section-heading-line-color: var(--primary-color);
}

/********** cssのリセット **********/
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,
blockquote,pre,abbr,address,cite,code,del,dfn,em,img,
ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,
ol,ul,li,fieldset,form,label,legend,table,caption,
tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,
figcaption,figure,footer,header,hgroup,menu,nav,section,
summary,time,mark,audio,video {
  font-size: 100%;
  margin: 0;
  padding: 0;
  vertical-align: baseline;
  border: 0;
  outline: 0;
  background: transparent;
}
body {
  line-height: 1;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
  display: block;
}
nav ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}
a {
  font-size: 100%;
  margin: 0;
  padding: 0;
  vertical-align: baseline;
  background: transparent;
}
ins {
  text-decoration: none;
  color: #000;
  background-color: #ff9;
}
mark {
  font-weight: bold;
  font-style: italic;
  color: #000;
  background-color: #ff9;
}
del {
  text-decoration: line-through;
}
abbr[title],
dfn[title] {
  cursor: help;
  border-bottom: 1px dotted;
}
table {
  border-spacing: 0;
  border-collapse: collapse;
}
hr {
  display: block;
  height: 1px;
  margin: 1em 0;
  padding: 0;
  border: 0;
  border-top: 1px solid #ccc;
}

/********** Google Material icons **********/
.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;  /* 推奨サイズ */
  display: inline-block;
  width: 1em;
  height: 1em;
  line-height: 1;
  text-transform: none;
  /* WebKitブラウザサポート */
  -webkit-font-smoothing: antialiased;
  /* Chrome、Safariサポート */
  text-rendering: optimizeLegibility;
  /* Firefoxサポート */
  -moz-osx-font-smoothing: grayscale;
  /* IEサポート */
  font-feature-settings: 'liga';
}
/* アイコンサイズ */
.material-icons.md-18 { font-size: 18px; }
.material-icons.md-20 { font-size: 20px; }
.material-icons.md-24 { font-size: 24px; }
.material-icons.md-30 { font-size: 30px; }
.material-icons.md-36 { font-size: 36px; }
.material-icons.md-48 { font-size: 48px; }
/* 背景が明るいとき用のアイコン色 */
.material-icons.md-dark { color: rgba(0, 0, 0, 0.54); }
.material-icons.md-dark.md-inactive { color: rgba(0, 0, 0, 0.26); }
/* 背景が暗いとき用のアイコン色 */
.material-icons.md-light { color: rgba(255, 255, 255, 1); }
.material-icons.md-light.md-inactive { color: rgba(255, 255, 255, 0.3); }

/********** サイト全体の基準となるCSS **********/
html {
  font-size: var(--primary-font-size);
}
body {
  position: relative;
  width: 100%;
  height: 100vh;
  min-height: 100vh;
  padding: 0;
  margin: 0;
  background-color: var(--body-bg-color);
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; /* フォント */
  line-height: 2;
  color: var(--primary-font-color);
  overflow-y: hidden;
  box-sizing: border-box;
}
h1, h2, h3, h4, h5, h6 {
  color: var(--heading-font-color);
  font-weight: var(--heading-font-weight);
}
a {
  color: var(--link-font-color);
  text-decoration: var(--link-text-decoration);
}
a:hover {
  color: whitesmoke;
}
a[href$=".pdf"]::before {
  display: none;
  position: relative;
  bottom: -0.1em;
  right: 0.2em;
  background-color: rgba(245, 245, 245, 1);
  font-family: 'Material Icons';
  font-size: 1.1em;
  color: rgba(232, 68, 68, 0.9);
  content: "picture_as_pdf";
}
img {
  max-width: 100%;
  height: auto;
}
ul, ol {
  list-style: none;
}
/** スクロールバー **/
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  border-radius: 8px;
  box-shadow: inset 0 0 6px rgba(102,102,102,0.7);
}
::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background-color: rgba(153,153,153,0.5);
  box-shadow: 0 0 0 1px rgba(51,51,51,0.7);
}

/********** コンテンツのサイズ指定 **********/
.header-inner,
.container,
.footer-inner {
  box-sizing: border-box;
  max-width: 100vw;
}
/**/
.container {
  min-height: inherit;
  height: calc(100vh - 2em);
}
@media screen and (max-width: 480px) {
  .sunfish-toppage {
    background-color: #87995A;
    min-height: inherit;
    height: calc(100vh - 2em);
  }
}

/***** nav *****/
.header-sunfish-nav-wrap {
  position: fixed;
  top: 0px;
  left: 0px;
  z-index: 100;
  width: 100vw;
  height: var(--header-height);
}
.head-company {
  display: flex;
  width: 100%;
  height: var(--pagetop-companyinfo-height);
  padding: 0 var(--side-margin);
  background-color: var(--menu-bg-color);
  background-clip: content-box;
  box-sizing: border-box;
}
.head-company a {
  display: flex;
}
.head-company .logo {
  width: auto;
  height: var(--pagetop-companyinfo-height);
  margin: 0;
  padding-left: 0.5em;
  line-height: 1em;
}
.head-company .name {
  align-self: center;
  font-size: 110%;
  color: var(--primary-font-color);
  line-height: 1.8em;
}
.head-company > div {
  padding: 0 0.5em;
  margin-left: auto;
  align-self: flex-end;
  font-size: 120%;
  color: var(--primary-color);
}
.sunfish-nav {
  width: 100%;
  height: var(--menubar-height);
  padding: 0 var(--side-margin);
  background-color: var(--menu-bg-color);
  background-clip: content-box;
  box-sizing: border-box;
}
.sunfish-nav ul {
  display: flex;
  width: 100%;
  height: 100%;
  justify-content: space-around;
}
.sunfish-nav .sunfish-menu-item {
  position: relative;
  width: 20%;
  font-size: 1rem;
  border-right: 1.5px solid var(--menu-border-color);
}
.sunfish-nav .sunfish-menu-item:nth-last-child(1) {
  border-right: none;
}
.sunfish-nav .sunfish-linkmenu {
  width: 100%;
  height: 100%;
  text-decoration: none;
  color: whitesmoke;
  border-bottom: 1px solid whitesmoke;
  border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  border-bottom: none;
}
.sunfish-menu-item:hover {
  background-color: var(--menu-hover-bg-color);
}
.sunfish-nav .sunfish-menu-icon {
  display: none;
}
.sunfish-nav .sunfish-menu-title {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  font-size: var(--menu-font-size);
}
@media screen and (max-width: 768px) {
  .head-company {
    padding: 0 var(--middle-side-margin);
  }
  .sunfish-nav {
    padding: 0 var(--middle-side-margin);
  }
  .sunfish-nav .sunfish-linkmenu {
    display: flex;
    flex-flow: column;
  }
  .sunfish-nav .sunfish-menu-icon {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .sunfish-nav .sunfish-menu-icon i {
    display: block;
    width: 2em;
    padding-top: 0.1em;
    text-align: center;
    align-self: center;
  }
  .sunfish-nav .sunfish-menu-title {
    width: auto;
    align-self: center;
    font-size: 75%;
    transform: translateY(-0.3em);
  }
}
@media screen and (max-width: 480px) {
  .head-company {
    padding: 0 var(--min-side-margin);
  }
  .sunfish-nav {
    padding: 0 var(--min-side-margin);
  }
}

/***** contents *****/
.contents {
  position: fixed;
  top: calc(var(--header-height) + 0.5em);
  bottom: 2em;
  width: 100%;
  max-width: 100%;
  height: calc(100% - 80px - 3em);
  height: calc(100% - var(--header-height) - 3em);
  padding: 0 var(--side-margin);
  margin: 0 0 1.5rem;
  overflow-x: hidden;
  overflow-y: scroll;
  scroll-behavior: smooth;
  box-sizing: border-box;
  animation: openpage 1s 0s 1 forwards;
}
@keyframes openpage {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@media screen and (max-width: 768px) {
  .contents {
    padding: 0 var(--middle-side-margin);
  }
}
@media screen and (max-width: 480px) {
  .contents {
    padding: 0 var(--min-side-margin);
  }
}

/***** サイトタイトル *****/
.site-title-wrap {
  text-align: left;
  display: none; /*非表示化*/
}
	
/*タイトルを文字列にする場合*/
.site-title a {
  font-size: 2.4rem;
  font-weight: bold;
  line-height: 1;
  display: inline-block;
  text-decoration: none;
  color: #000;
}

/***** ヘッダーメニュー *****/
.header-inner {
  position: relative;
}
@media screen and (max-width: 768px) {

}
@media screen and (max-width: 480px) {

}
/***** ページトップへ *****/
.toPagetop a {
  display: none;
  position: fixed;
  bottom: 3em;
  right: 3%;
  line-height: 3em;
  width: 3em;
  border-radius: 50%;
  text-decoration: none;
  text-align: center;
  background-color: rgba(141, 183, 207, 0.7);
  color: whitesmoke;
}
.toPagetop i {
  transform: translateY(0.3em);
}
.toPagetop a:hover {
  background-color: rgba(141, 183, 207, 1);
}
@media screen and (max-width: 768px) {
  
}
@media screen and (max-width: 480px) {
  
}

/***** フッターメニュー *****/
.footer {
/*  background-color: #23282d;*/
  position: fixed;
  bottom: 0;
  width: 100vw;
  height: 2em;
}
.footer-nav,
.copyright {
  text-align: right;
  padding-right: 1.5em;
}
.copyright {
  font-family: 'Raleway';
}
.footer-nav {
  font-size: 0;
  margin-bottom: 3rem;
}
.footer-nav li {
  font-size: 1rem;
  display: inline-block;
  margin-right: 1.5rem;
}
.footer-nav li a {
  text-decoration: none;
  color: #fff;
}
.footer-nav li a:hover {
  opacity: .6;
}
.copyright p {
  font-size: 1rem;
  color: #fff;
}
@media screen and (max-width: 768px) {
  .footer-nav {
    margin-bottom: 1.5rem;
  }
  .footer-nav ul {
    text-align: left;
  }
  .footer-nav li {
    width: 48%;
    margin-right: 4%;
    margin-bottom: 1rem;
    text-align: center;
  }
  .footer-nav li:nth-of-type(2n) {
    margin-right: 0;
  }
}
@media screen and (max-width: 480px) {
  .copyright {
    padding-right: 0.5em;
  }
}

/***** 背景画像 *****/
.container-bg-image {
  min-height: 100vh;
  width: 100vw;
  overflow: hidden;
  position: fixed;
  top: 0;
  left: 0;
}
.container-bg-image-child {
  width: 100%;
  height: 100%;
  position: absolute;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  left: 0;
  top: 0;
}
/*#container-bg-image0 {
    background-image: url("../images/aboutus-background1.jpg");
}*/
.aboutus #container-bg-image0 {
    background-image: url("../images/aboutus-background1.jpg");
}
.contactus #container-bg-image0 {
    background-image: url("../images/contactus-background1.jpg");
}
.job #container-bg-image0 {
    background-image: url("../images/job-background2.jpg");
}
.permits #container-bg-image0 {
    background-image: url("../images/permits-background1.jpg");
}
.bg-loading {
  visibility: hidden;
}
.bg-image-is-show {
  animation: fadeIn 3s linear;
  animation-fill-mode: forwards;
}
@keyframes fadeIn {
  0% {
    opacity: 0;
    transform: scale(1);
  }
  100% {
    opacity: 1;
    transform: scale(1.05);
  }
}
.bg-image-is-keep {
  animation: zoomUp 3s linear;
  animation-fill-mode: forwards;
}
@keyframes zoomUp {
  0% {
    opacity: 1;
    transform: scale(1.05);
  }
  100% {
    opacity: 1;
    transform: scale(1.1);
  }
}
.bg-image-is-hide {
  animation: fadeOut 3s;
  animation-fill-mode: forwards;
}
@keyframes fadeOut {
  0% {
    opacity: 1;
    transform: scale(1.1);
  }
  100% {
    opacity: 0;
    transform: scale(1.1);
  }
}
@media screen and (max-width: 768px) {
  
}
@media screen and (max-width: 480px) {
  
}

/***** 共通 *****/
.page-description {
  width: 100%;
  margin-bottom: 3em;
}
/*** タイトル ***/
.sunfish-top {
  width: 100%;
  font-family: 'Raleway';
  border-bottom-width: 1.5px;
  border-bottom-style: solid;
  border-bottom-color: var(--page-title-line-color);
  display: flex;
  align-items: baseline;
  color: var(--page-title-color);
  letter-spacing: 0.5em;
  margin-bottom: 2.5em;
}
.sunfish-title {
  font-size: 250%; /* 文字サイズ */
  width: 70%;
  padding: 0;
  margin-bottom: 0;
}
.sunfish-subtitle {
  font-size: 150%; /* 文字サイズ */
  width: 30%;
  margin-bottom: 0;
  text-align: right;
  font-weight: normal;
  color: var(--page-title-line-color); /* 文字色 */
  letter-spacing: 0.3em;
}
/*** 章タイトル ***/
.section {
  width: 95%;
  width: calc(100% - 0.5em);
  padding-left: 0.5em;
  padding-right: 0.5em;
  margin-bottom: 3em;
  background-color: var(--section-bg-color);
  border-radius: 0.5em;
}
.section > .title {
  margin-right: 0.5em;
  font-size: 120%;
  border-bottom-width: 1.5px;
  border-bottom-style: solid;
  border-bottom-color: var(--section-heading-line-color);
  color: var(--section-heading-font-color);
  font-weight: var(--section-heading-font-weight);
}
.section > .description {
  padding-left: 0.5em;
}
@media screen and (max-width: 768px){
  .sunfish-top {
    margin-bottom: 2.5em;
  }
  .sunfish-title {
    width: 60%;
  }
  .sunfish-subtitle {
    width: 40%;
  }
}
@media screen and (max-width: 480px) {
  .sunfish-top {
    font-size: 80%;
    margin: 0 0.5em 2em;
  }
  .sunfish-subtitle {
    letter-spacing: 3px;
  }
  .page-description {
    margin-bottom: 2em;
  }
}

/***** index *****/
.page-description {
  word-break: normal; /* 折り返し */
}
.description-top {
  margin-bottom: 1em;
  text-align: center;
  font-size: 200%;
  font-weight: bold;
  color: var(--primary-point-color);
}
.description-top .first {
  color: cornflowerblue;
}
.description-top .second {
  color: forestgreen;
}
.description-top .third {
  color: darksalmon;
}
.description-contents {
  
}
.description-content {
  width: 100%;
  height: auto;
  margin: 0 0 1.0em 0;
  background-color: rgba(12, 42, 85,0.8);
  border-radius: 0.7em;
}
.description-content h2{
  width: 95%;
  width: calc(100% - 1em);
  color: whitesmoke;
  font-size: 130%;
  text-align: center;
  padding: 0 0.5em;
}
.description-content div{
  width: 95%;
  width: calc(100% - 1em);
  height: auto;
  padding: 0 0.5em;
}
.description-content-notes {
  padding: 0 0.5em;
  font-size: 90%;
  line-height: 1.5em;
}
@media screen and (max-width: 768px) {
  
}
@media screen and (max-width: 480px) {
  
}

/*** what's news ***/
.news {
  width: 95%;
  width: calc(100% - 0.5em);
  padding-left: 0.5em;
  margin-bottom: 3em;
}
.news .title {
  font-size: 120%;
  border-bottom-width: 1.5px;
  border-bottom-style: solid;
  border-bottom-color: var(--primary-point-color);
}
.news ul {
  height: 8em;
  overflow-y: scroll;
}
.news li {
  display: flex;
  margin-top: 0.5em;
  border-bottom: 1px solid whitesmoke;
}
.news .day {
  margin-right: 2em;
}
.news .label {
  margin-right: 2em;
}
/* 一旦非表示 */
.news .label {
  display: none;
}
.news .text {
  
}
@media screen and (max-width: 768px) {
  
}
@media screen and (max-width: 480px) {
  
}

/***** about us *****/
.aboutus .toPagetop a {
  display: block;
}
/*** 会社概要 ***/
.company-info ul {
  
}
.company-info li {
  display: flex;
  margin-top: 0.5em;
  margin-right: 0.5em;
  border-bottom: 1px solid whitesmoke;
}
.company-info li:nth-last-of-type(1) {
  border-bottom: none;
}
.company-info .key {
  width: 7.5em;
  padding-left: 0.5em;
  padding-right: 0.5em;
  border-right: 1px solid whitesmoke;
}
.company-info .value {
  width: 100%;
  padding-left: 0.5em;
}
.company-info .value > div {
  display: flex;
  border-bottom: 1px solid whitesmoke;
}
.company-info .value > div:nth-last-child(1){
  display: flex;
  border-bottom: none;
}
.company-info .value > div > div:nth-child(1) {
  width: 6em;
}
.company-info .value .address {
  display: flex;
}
.company-info .value .address p{
  margin-right: 1em;
}
.company-info .value .number {
  display: flex;
}
.company-info .value li {
  display: list-item;
  margin: 0 0 0 1.5em;
  border-bottom: none;
}
.company-info .value .number p{
  margin-right: 1em;
}
.company-info .value .number p:nth-child(1)::after{
  content: "　/";
}
@media screen and (max-width: 768px) {
  .company-info .value .address {
    display: block;
  }
  .company-info .value .number {
    display: block;
  }
  .company-info .value .number p:nth-child(1)::after{
    content: "";
  }
}
@media screen and (max-width: 480px) {
  .company-info .value > div {
    display: block;
  }
}
/*** 沿革 ***/
.company-history ul {
}
.company-history li {
  display: flex;
  padding-left: 0.5em;
  margin-top: 0.5em;
  margin-right: 0.5em;
  border-bottom: 1px solid whitesmoke;
}
.company-history li:nth-last-of-type(1) {
  border-bottom: none;
}
.company-history .date {
  display: flex;
  margin-right: 2em;
}
.company-history .date p:nth-child(1){
  width: 3.5em;
}
.company-history .date p:nth-child(2){
  width: 2.5em;
  text-align: end;
}
@media screen and (max-width: 768px) {
  
}
@media screen and (max-width: 480px) {
  
}
/*** 営業種目 ***/
.works {
  position: relative;
}
.works > .description {
  padding-left: 0.5em;
}
.works > .image {
  position: absolute;
  top: 3em;
  right: 0.5em;
  width: 38%;
}
.works > .image img {
  width: 100%;
  height: auto;
}
.works > .image p {
  text-align: end;
  font-size: 0.8em;
  font-family: '游ゴシック';
}
.works >.wrapper {
  width: 60%;
}
.works .work {
  padding-left: 0.5em;
}
.works .work h3{
  padding-top: 0.5em;
  color: whitesmoke;
  font-size: 120%;
  font-weight: normal;
}
.works .work h3::before {
  content: "■";
  color: var(--primary-point-color);
}
.works .work > div {
  padding-left: 1.2em;
  color: #b3b3b3;
}
.works > .note {
  margin-top: 0.5em;
  border-top: 1px solid whitesmoke;
}
@media screen and (max-width: 768px) {
  
}
@media screen and (max-width: 480px) {
  
}
/*** 加盟団体 ***/
.memberOrganization > ul {
  padding-left: 0.5em;
  padding-right: 0.5em;
}
@media screen and (max-width: 768px) {
  
}
@media screen and (max-width: 480px) {
  
}
/*** 株主 ***/
.shareholders > ul {
  padding-left: 0.5em;
  padding-right: 0.5em;
}
@media screen and (max-width: 768px) {
  
}
@media screen and (max-width: 480px) {
  
}
/*** 役員 ***/
.officer > ul {
  padding-left: 0.5em;
  padding-right: 0.5em;
}
@media screen and (max-width: 768px) {
  
}
@media screen and (max-width: 480px) {
  
}
/*** 保有車両 ***/
.vehicles > .wrapper {
  display: flex;
  width: 100%;
  margin-top: 0.5em;
}
.vehicle {
  width: 16%;
  width: calc(100% / 6);
  padding: 0 1%;
  border-right: 1px solid whitesmoke;
  border-bottom: 1px solid whitesmoke;
}
.vehicle:nth-last-child(1)
,.vehicle_9
,.vehicle_10
,.vehicle_11 {
  border-right: none;
}
.vehicles > .wrapper:nth-last-of-type(1) .vehicle {
  border-bottom: none;
}
.vehicles > .wrapper:nth-of-type(1) .vehicle h3 {
  height: 4em;
}
.vehicle > h3 {
  text-align: center;
}
.vehicle img {
  width: 100%;
  height: auto;
}
.vehicle > p {
  text-align: center;
}
@media screen and (max-width: 768px) {
  
}
@media screen and (max-width: 480px) {
  
}

/***** permits *****/
.permits .toPagetop a {
  display: block;
}
.permits article {
  text-rendering: optimizeLegibility;
  font-kerning: normal;               
  font-variant-ligatures: common-ligatures contextual;
  font-feature-settings: "kern", "liga", "clig", "calt";
}
.permit-list > .description {
  padding-left: 0.5em;
  padding-right: 0.5em;
}
.permit {
  margin-top: 1em;
}
.permit h3 {
  padding-left: 0.5em;
  padding-right: 0.5em;
  margin-top: 1.5em;
  border-left: 2.5px solid var(--primary-point-color);
  border-bottom: 1px solid whitesmoke;
}
.permit .municipality {
  padding-left: 0.5em;
  padding-right: 0.5em;
}
.permit .municipality h4 {
  margin-top: 1em;
  color: var(--primary-font-color);
}
.permit .municipality h4::before {
  content: "■ ";
  color: var(--section-heading-font-color);
}
.municipality ul {
  padding-left: 0.5em;
  padding-right: 0.5em;
}
.municipality li {
  display: flex;
  padding-left: 0.5em;
  padding-right: 0.5em;
  margin-top: 0.5em;
  border-bottom: 1px solid whitesmoke;
}
.municipality .link {
  width: 70%;
  padding-right: 0.5em;
  margin-right: 0.5em;
  border-right: 1px solid whitesmoke;
}
.municipality .link img {
  width: 1.7em;
  transform: translateY(0.4em);
}
.municipality .date {
  display: flex;
  width: 7.5em;
  margin-right: 0.5em;
}
.municipality .date p:nth-child(1){
  width: 4.5em;
}
.municipality .date p:nth-child(2){
  width: 2.5em;
  padding-right: 0.5em;
  text-align: end;
}
@media screen and (max-width: 768px) {
  
}
@media screen and (max-width: 480px) {
  
}
/***** お問い合わせ *****/
.contactus .section {
  background-color: var(--section-bg-sub-color);
}/*
.contactus {
  color: var(--second-point-color);
}
.contactus .section > .title {
  color: var(--section-heading-font-color);
}
.contactus .sunfish-nav .sunfish-linkmenu {
  color: var(--second-point-color);
}*/
.contactus .section > .title {
  color: darkslategrey;
}

.contactus .sunfish-nav .sunfish-menu-item:hover .sunfish-linkmenu {
  color: whitesmoke;
}
.contactus .page-description p {
  font-size: 120%;
}
/*** フォーム ***/
.form table {
  width: 100%;
}
.form-contents {
  table-layout: fixed;
  line-height: 2.5;
}
.form td h3 {
  width: 49em;
  margin: 1em auto 0.5em;
  color: darkslategrey;
}
.form form {
  width: 45em;
  padding: 0 2em;
  margin: 1em auto;
  border: 1.5px solid var(--second-point-color);
}
.form .telinfo {
  display: flex;
  width: 49em;
  margin: 0 auto;
}
.form .telinfo p:nth-of-type(1) {
  padding-right: 0.5em;
}
/*.form-contents th:nth-of-type(1) {
  width: 30%;
}
.form-contents th:nth-of-type(2) {
  width: 70%;
}*/
.form-contents tr {
  display: flex;
  padding-top: 0.5em;
  flex-direction: column;
}
.form-contents td {
  vertical-align: top;
}
.form-contents td .required {
  padding: 0 0.5em;
  margin-right: 0.5em;
  background-color: orangered;
  font-size: 95%;
  border-radius: 0.5em;
}
.form-contents td input[type="text"]
,.form-contents td textarea {
  width: 95%;
}
.form-contents td input[type="text"] {
  height: 1.5em;
}
.form .submit {
  text-align: center;
}
@media screen and (max-width: 768px) {
  
}
@media screen and (max-width: 480px) {
  
}
/*** アクセス ***/
.access .offices {
  display: flex;
  width: 98%;
  width: calc(100% - 1em);
  padding: 1em 0.5em;
}
.access .office {
  width: 50%;
  width: calc(100% / 2);
  text-align: center;
  border-right: 1.5px solid var(--second-point-color);
}
.access .office:nth-last-child(1) {
  border-right: none;
}
.access .office h3 {
  padding: 0 1em;
  color: var(--second-point-color);
  font-size: 110%;
  font-weight: normal;
  text-align: start;
}
.access .office .address {
  padding: 0 1em;
  text-align: start;
  line-height: 1.5;
}
@media screen and (max-width: 768px) {
  
}
@media screen and (max-width: 480px) {
  
}
/*** Eメール ***/
.emailinfo div {
  padding-left: 0.5em;
}
@media screen and (max-width: 768px) {
  
}
@media screen and (max-width: 480px) {
  .telinfo .offices {
    display: block;
  }
  .telinfo .office {
    display: flex;
    width: 100%;
    border-right: none;
    border-bottom: 1.5px solid whitesmoke;
  }
  .telinfo .office:nth-last-child(1) {
    border-bottom: none;
  }
  .telinfo .office h3 {
    width: 6em;
    text-align: left;
    font-size: 100%;
  }
  .telinfo .office li {
    text-align: left;
  }
  .telinfo .office h3 {
    
  }
}
/***** 求人情報 *****/
.job-wrapper {
  display: flex;
  width: 100%;
}
.job .contents-logo {
  height: var(--pagetop-companyinfo-height);
}
.job .contents-logo img{
  width: auto;
  height: 100%;
  object-fit: contain;
}
.job .page-description {
  font-size: 200%;
  margin-bottom: 1em;
}
.job-info ul {
  padding-left: 0.5em;
  padding-right: 0.5em;
}
.job-info li {
  padding-left: 0.5em;
  margin-right: 0.5em;
}
.job-info li {
  display: flex;
  padding-left: 0.5em;
  margin-right: 0.5em;
  margin-top: 0.5em;
  border-bottom: 1px solid whitesmoke;
}
.job-info li:nth-last-of-type(1) {
  border-bottom: none;
}
.job-info .key {
  width: 6rem;
  border-right: 1px solid whitesmoke;
}
.job-info .value {
  padding-right: 0.5em;
  padding-left: 0.5em;
}

/*** 問合せ先 ***/
.job-contact div {
  padding-left: 0.5em;
}
@media screen and (max-width: 768px) {
  
}
@media screen and (max-width: 480px) {
  
}
/***** gradation-lower *****/
.gradation-lower {
  position: fixed;
  bottom: 0;
  width: 100%;
  pointer-events: none;
}
.gradation-lower img {
  width: 100%;
  vertical-align: bottom;
  transform: translateY(1px);
}