@charset "utf-8";
/*@charset "EUC-JP";*/
/*
Theme Name: atozSunfish
Auther: AtoZ service
*/
/*** Google Fontsを利用する ***/
@import url('https://fonts.googleapis.com/css?family=Raleway&display=swap');
/********** 変数 **********/
:root {
  
  --primary-font-size: 16px;
  --primary-font-size-480: 15px;
  --primary-font-size-print: 14px;
  --header-pc-min-width: 100px;
  --header-pc-max-width: 220px;
  --logo-pc-min-height: 100px;
  --menubar-font-size: 16px; /* 文字サイズ */
  
  --pagetop-companyinfo-height: 70px;
  --pagetop-companyinfo-height-480: 55px;
  --menubar-height: 50px;
  --header-height: calc(var(--pagetop-companyinfo-height) + var(--menubar-height));
  --header-height-480: calc(var(--pagetop-companyinfo-height-480) + 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%;
  --menu-font-size-870: 140%;
  --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(85,160,94,0.8);
  --section-heading-font-color: var(--second-color);
  --section-heading-font-weight: bolder;
  --section-heading-line-color: var(--primary-color);
  --section-heading-font-sub-color: #19b38c;
  --section-heading-font-sub-color: var(--primary-color);

  --cooperation-heavy-color: rgb(77,49,8);
  --cooperation-light-color: rgb(255,193,0);
  --cooperation-bg-color: rgba(128,82,13,0.9);
  --cooperation-bg-point-color: rgba(128,82,13,1);
}

/********** 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);*/
  color: #0c2a55;
  overflow-y: hidden;
  box-sizing: border-box;
  opacity: 0;
  animation: loading 1s 0s 1 forwards;
  pointer-events: none;
}
header {
  pointer-events: auto;
}
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;
}

@keyframes loading {
  from {
    opacity: 0;
    color: #0c2a55;
  }
  to {
    opacity: 1;
    color: var(--primary-font-color);
  }
}
/** スクロールバー **/
::-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);
}
@media screen and (max-width: 480px) {
  html {
    font-size: var(--primary-font-size-480);
  }
  ::-webkit-scrollbar {
    display: none;
  }
  ::-webkit-scrollbar-track {
    display: none;
  }
  ::-webkit-scrollbar-thumb {
    display: none;
  }
}
@media print {
  html {
    font-size: var(--primary-font-size-print);
  }
  body {
    height: auto;
    overflow-y: scroll;
    overflow-x: hidden;
    pointer-events: auto;
  }
}
/********** コンテンツのサイズ指定 **********/
.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);
  }
}

@media print {
  .container {
    height: auto;
    overflow: hidden;
  }
}

/***** 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);
  text-align: end;
}
.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: #0c2a55;
  border-bottom: none;
  animation: loadfont 0.5s 0s 1 forwards;
}
@keyframes loadfont {
  from {
    color: #0c2a55;
  }
  to {
    color: whitesmoke;
  }
}
.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: 870px) {
  .sunfish-nav .sunfish-menu-title {
    font-size: var(--menu-font-size-870);
  }
}
@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) {
  .header-sunfish-nav-wrap {
    height: var(--header-height-480);
  }
  .head-company .logo {
    height: var(--pagetop-companyinfo-height-480);
  }
  .head-company {
    padding: 0 var(--min-side-margin);
    height: var(--pagetop-companyinfo-height-480);
  }
  .sunfish-nav {
    padding: 0 var(--min-side-margin);
  }
  .head-company > div {
    font-size: 100%;
    line-height: 1.5;
  }
}
@media print {
  .header-sunfish-nav-wrap {
    position: relative;
  }
}

/***** 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;
  opacity: 0;
  animation: openpage 1s 0.2s 1 forwards;
  pointer-events: auto;
}
@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 {
    top: calc(var(--header-height-480) + 0.5em);
    height: calc(100% - var(--header-height-480) - 3em);
    padding: 0 var(--min-side-margin);
  }
}
@media print {
  .contents {
    position: relative;
    top: 0;
    bottom: 0;
    height: auto;
    margin: 0;
    overflow: hidden;
  }
}
/***** サイトタイトル *****/
.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;
  pointer-events: auto;
}
.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;
  display: block;
}
.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");
}
.description #container-bg-image0 {
  background-image: url("../images/description-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;
}
@media print {
  .sunfish-top {
    margin-bottom: 0;
  }
}
/*** 章タイトル ***/
.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;
  }
  .section > .description {
    padding: 0;
  }
}
@media print {
  .section:nth-last-of-type(1) {
    margin-bottom: 0;
  }
}

/***** 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: var(--primary-color);
}
.description-top .second {
  color: rgb(34,125,68);
}
.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: #0c2a55;
  font-size: 130%;
  text-align: center;
  padding: 0 0.5em;
  animation: loadfont 1s 0.2s 1 forwards;
}
.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) {
  .description-top {
    font-size: 150%;
  }
  .description-content h2{
    font-size: 120%;
  }
}
/*** ご挨拶 ***/
.greeting .title {
  letter-spacing: 0.5em;
  text-align: center;
}
.greeting-contents p {
  padding-right: 0.5em;
}
.greeting-contents p:nth-last-of-type(1) {
  text-align: end;
}
@media screen and (max-width: 768px) {
  
}
@media screen and (max-width: 480px) {
  
}

/*** 特殊清掃 ***/
.new-business {
  background-color: var(--cooperation-bg-color);
}
.new-business .title {
  letter-spacing: 0.5em;
  text-align: center;
  color: var(--cooperation-light-color);
  border-bottom-color: var(--cooperation-heavy-color);
}
.business-contents p {
  padding-right: 0.5em;
}
.business-contents p:nth-of-type(1) {
  padding-top: 0.5em;
  padding-bottom: 0.5em;
  text-align: center;
}
.business-contents > span {
  padding-top: 0.5em;
  padding-bottom: 0.5em;
}
.business-contents a.link_to_description {
  position: relative;
  display: inline-flex;
  align-items: center;
  color: var(--cooperation-light-color);
}
.business-contents a.link_to_description p {
  display: inline-block;
  padding: 0;
  text-decoration-color: #fe7f4c;
  text-decoration-line: underline;
  text-decoration-color: var(--cooperation-heavy-color);
}
.business-contents a.link_to_description:hover {
  color: var(--primary-font-color);
}
@media screen and (max-width: 1100px) {
  .business-contents p:nth-of-type(1) {
    text-align: start;
  }
}
@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;
  width: 5em;
}
.news .label {
  margin-right: 2em;
}
/* 一旦非表示 */
.news .label {
  display: none;
}
.news .text {
  
}
@media screen and (max-width: 768px) {
  
}
@media screen and (max-width: 480px) {
  
}
@media print {
  .news {
    margin-bottom: 0;
  }
}

/***** 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){
  border-bottom: none;
}
.company-info .value > div > div:nth-child(1) {
  width: 6em;
}
.company-info .value > div > div:nth-child(2) {
  width: calc(100% - 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: 0.5em;
}
.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 .key {
    width: 6.5em;
  }
  .company-info .value > div {
    display: block;
  }
  .company-info .value > div > div:nth-child(2) {
    width: auto;
  }
}
/*** 沿革 ***/
.company-history ul {
}
.company-history li {
  display: flex;
  align-items: baseline;
  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;
  font-size: 93%;
}
.company-history .date p.sameYear {
  opacity: 0;
}
.company-history .date p:nth-child(1){
  width: 4.2rem;
  text-align: end;
}
.company-history .date p:nth-child(2){
  width: 2.5rem;
  text-align: end;
}
@media screen and (max-width: 768px) {
  
}
@media screen and (max-width: 480px) {
  .company-history .date {
    margin-right: 0.5em;
  }
}
/*** 営業種目 ***/
.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_3
,.works .work_4 
,.works .work_5 
,.works .work_6 
,.works .work_7 {
  width: 165%;
}
.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;
}
.work a.link_to_description {
  position: relative;
  display: inline-flex;
  align-items: center;
  color: var(--primary-font-color);
  color: #b3b3b3;
  color: var(--cooperation-light-color);
}
.work a.link_to_description p {
  text-decoration-color: #fe7f4c;
  text-decoration-line: underline;
  text-decoration-color: var(--cooperation-heavy-color);
  display: inline-block;
}
.work a.link_to_description:hover {
  color: #fe7f4c;
  color: var(--primary-font-color);
}
.work a.link_to_description:hover p {
  
}
.work a.link_to_description:hover .material-icons.md-light {

}
.works > .note {
  margin-top: 0.5em;
  border-top: 1px solid whitesmoke;
}
@media screen and (max-width: 768px) {
  .works .work {
    padding: 0;
  }
}
@media screen and (max-width: 480px) {
  .works .work h3 {
    font-size: 100%;
  }
  .works > .image {
    position: initial;
    width: auto;
    padding: 0 0.5em;
  }
  .works >.wrapper {
    width: auto;
  }
  .works .work_3
  ,.works .work_4 
  ,.works .work_5 
  ,.works .work_6 
  ,.works .work_7 {
    width: auto;
  }
  .works .work > div {
    padding-left: 0.1em;
  }
}
/*** 加盟団体 ***/
.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;
}
.vehicles > .wrapper > span {
  display: flex;
  width: 50%;
}
.vehicle {
  width: 33%;
  width: calc(100% / 3);
  padding: 0 1%;
  border-right: 1px solid whitesmoke;
  border-bottom: 1px solid whitesmoke;
}
.vehicles > .wrapper > span:nth-last-of-type(1) .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;
}
.vehicle > h3 {
  text-align: center;
  height: 4em;
  font-size: 85%;
}
.vehicles > .wrapper:nth-last-of-type(1) .vehicle > h3 {
  height: auto;
}
.vehicle img {
  width: 100%;
  height: auto;
}
.vehicle > p {
  text-align: center;
}
@media screen and (max-width: 768px) {
  
}
@media screen and (max-width: 480px) {
  .vehicles > .wrapper {
    flex-direction: column;
  }
  .vehicles > .wrapper > span {
    width: 100%;
  }
}
@media print {
  .vehicle > h3 {
    font-size: 80%;
  }
}
/***** 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) {
  .municipality ul {
    padding: 0;
  }
  .municipality li {
    padding: 0;
    margin: 0;
    flex-direction: column;
  }
  .municipality .link {
    padding: 0;
    margin: 0;
    width: auto;
    border-right: none;
  }
  .municipality .date {
    width: auto;
    justify-content: flex-end;
  }
  .municipality .date p:nth-child(1) {
    width: auto;
  }
  .municipality .date p:nth-child(2) {
    padding: 0;
  }
}
/***** お問い合わせ *****/
.contactus .section {
  background-color: var(--section-bg-sub-color);
}
.contactus .section > .title {
  color: var(--section-heading-font-sub-color);
}

.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 .table-content h3 {
  width: 49em;
  margin: 1em auto 0.5em;
  color: var(--section-heading-font-sub-color);
}
.form form {
  width: 45em;
  padding: 0 2em;
  margin: 1em auto;
  border: 1.5px solid var(--second-point-color);
  line-height: 2.5;
}
.form .telinfo {
  display: flex;
  width: 49em;
  margin: 0 auto;
}
.form .telinfo p:nth-of-type(1) {
  padding-right: 0.5em;
}
.form-contents ul {
  display: flex;
  padding-top: 0.5em;
  flex-direction: column;
}
.form-contents li {
  vertical-align: top;
}
.form-contents li .required {
  padding: 0 0.5em;
  margin-right: 0.5em;
  background-color: orangered;
  font-size: 95%;
  border-radius: 0.5em;
}
.form-contents li input[type="text"]
,.form-contents li textarea {
  width: 95%;
}
.form-contents li input[type="text"] {
  height: 1.5em;
}
.form .submit {
  text-align: center;
}
@media screen and (max-width: 1050px) {
  .form form {
    width: auto;
    padding: 0 0.5em;
  }
  .form-contents li {
    padding-top: 0.5em;
  }
  .form-contents li p {
    padding: 0 1em;
  }
  .form-contents td input[type="text"]
  ,.form-contents td textarea {
    width: 95%;
  }
  .form-contents li input[type="text"]
  ,.form-contents li textarea {
    width: 95%;
  }
  .form .telinfo {
    width: auto;
  }
}
@media screen and (max-width: 768px) {
  .form-contents {
    line-height: normal;
  }
  .form-contents li p {
    padding: 0 0.5em;
  }
}
@media screen and (max-width: 480px) {
  .form form {
    width: auto;
    padding: 0 0.5em;
  }
  .form-contents li {
    padding-top: 0.5em;
  }
  .form-contents li p {
    padding: 0;
  }
  .form-contents td input[type="text"]
  ,.form-contents td textarea {
    width: 95%;
  }
  .form-contents li input[type="text"]
  ,.form-contents li textarea {
    width: 95%;
  }
  .form .telinfo {
    width: auto;
  }
}
/*** アクセス ***/
.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(--section-heading-font-sub-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) {
  .access .offices {
    flex-direction: column;
  }
  .access .office {
    width: auto;
    border-right: none;
  }
  .access .office h3 {
    padding: 0;
    font-size: 100%;
  }
  .access .office .address {
    padding: 0;
  }
}
@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);*/
  width : 200px;
}
.job .contents-logo img{
  width: 100%;
  height: auto;
  object-fit: contain;
}
.job .page-description {
  width: calc(100% - 200px);
  font-size: 200%;
  margin-bottom: 1em;
}
@media screen and (max-width: 768px) {
  
}
@media screen and (max-width: 480px) {
  .job-wrapper {
    flex-direction: column;
  }
  .job .contents-logo {
    width: 30%;
    height: auto;
    margin-right: 0.5em;
    align-self: flex-end;
    transform: translateY(-1em);
  }
  .job .page-description {
    width: auto;
    font-size: 110%;
    margin: 0;
  }
}
@media print {
  .job .contents-logo {
    display: none;
  }
  .job .page-description {
    width: 100%;
    margin-bottom: 0;
  }
}

.job-info ul {
  padding-left: 0.5em;
  padding-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::before {
  content: "■";
  color: var(--primary-point-color)
}
.job-info .key {
  width: 6rem;
}
.job-info .value {
  padding-right: 0.5em;
  padding-left: 0.5em;
}
@media screen and (max-width: 768px) {
  
}
@media screen and (max-width: 480px) {
  .job-info ul {
    padding-left: 0;
  }
  .job-info li {
    padding: 0;
    margin: 0;
    border-bottom: none;
    flex-direction: column;
  }
  .job-info .key {
    border-right: none;
  }
  .job-info .value {
    padding: 0;
    padding-left: 1em;
  }
}

/*** 問合せ先 ***/
.job-contact div {
  padding-left: 0.5em;
}@media screen and (max-width: 768px) {
  
}
@media screen and (max-width: 480px) {
  
}
/***** 特殊清掃 *****/
.description .sunfish-top {
  color: var(--cooperation-heavy-color);
  border-bottom-color: var(--cooperation-light-color);
}
.description .page-description {
  color: var(--cooperation-heavy-color);
}
.description .section {
  background-color: var(--cooperation-bg-color);
}
.description .section > .title {
  color: var(--cooperation-light-color);
  border-bottom-color: var(--cooperation-heavy-color);
}
.description .section > .description {
  padding-top: 0.5em;
  padding-bottom: 0.5em;
}
@media screen and (max-width: 768px) {
  
}
@media screen and (max-width: 480px) {
  
}
@media screen and (max-width: 400px) {
  .section > .description {
    padding-left: 0;
  }
}
/*** description-beginning ***/
.description-beginning ol {
  padding-left: 2.5em;
  list-style: decimal;
}
.description-beginning ul > li {
  display: flex;
}
.description-beginning ul > li:before {
  content: '・';
  padding-right: 0.3em;
  padding-left: 1em;
}
@media screen and (max-width: 768px) {
  
}
@media screen and (max-width: 480px) {
  
}
/*** description-cooperation ***/
.description-cooperation {
  
}
#cooperation-images {
  position: relative;
  padding: 1.5em 0;
}
#cooperation-images.imageFixed {
  position: fixed;
  background-color: var(--cooperation-bg-point-color);
}
#cooperation-images ul#normally.imageFixed {
  animation: opacity1 1s 0s 1 forwards;
}
#cooperation-images ul#cooperation.imageFixed {
  animation: opacity0 1s 0s 1 forwards;
}
#cooperation-images ul#normally.animation
,#cooperation-images ul#cooperation.animation {
  /*animation: opacityChange1 infinite forwards;*/
  animation: opacityChange3 infinite forwards;
}
#cooperation-images ul#normally.animation {
  animation-direction: alternate;
  /*animation-duration: 3.75s;*/
  animation-duration: 2.35s;
}
#cooperation-images ul#cooperation.animation {
  animation-direction: alternate-reverse;
  /*animation-duration: 3.75s;*/
  animation-duration: 2.35s;
}
/*
#cooperation-images ul#normally.animation {
  animation: opacity 1.5s 0s infinite alternate forwards ;
  animation: opacityChange2 3s 0s infinite alternate forwards ;
  animation: opacityChange1 3.75s 0s infinite alternate forwards ;
}
#cooperation-images ul#cooperation.animation {
  animation: opacity 1.5s 0s infinite alternate-reverse forwards ;
  animation: opacityChange2 3s 0s infinite alternate-reverse forwards ;
  animation: opacityChange1 3.75s 0s infinite alternate-reverse forwards ;
}*/
/* 1.5s 0.75s 1.5s */
@keyframes opacityChange1 {
  0% {
    opacity: 0;
  }
  40% {
    opacity: 0;
  }
  60% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
/* 1.125s 0.75s 1.125s */
@keyframes opacityChange2 {
  0% {
    opacity: 0;
  }
  37.5% {
    opacity: 0;
  }
  62.5% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}

/* 0.8s 0.75s 0.8s */
@keyframes opacityChange3 {
  0% {
    opacity: 0;
  }
  34% {
    opacity: 0;
  }
  66% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
/* 1.4s 0.75s 1.4s */
@keyframes opacityChange4 {
  0% {
    opacity: 0;
  }
  39.5% {
    opacity: 0;
  }
  60.5% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@keyframes opacity {
  0% {
    opacity: 0;
  }
  25% {
    opacity: 0;
  }
  75% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@keyframes opacity0 {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes opacity1 {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
#cooperation-images ul {
  display: flex;
  justify-content: space-between;
  margin: 0 1.5em 1.5em;
}
#cooperation-images ul.commission {
  margin-bottom: 0;
}
#cooperation-images ul#cooperation {
  position: absolute;
  bottom: 1.5em;
  width: calc(100% - 3em);
  opacity: 0;
}
#cooperation-images li {
  width: calc(100% / 4 - 1em);
  font-size: 105%;
  text-align: center;
  border: solid 1px;
}
#cooperation-images ul.process li {
  padding: 1.5em 0;
}
#cooperation-images ul.commission li {
  padding: 0.8em 0;
}
#cooperation-images ul.process li:nth-of-type(1) {
  background-color: rgb(179,121,129);
  background-color: rgb(207,140,149);
}
#cooperation-images ul.process li:nth-of-type(2) {
  background-color: rgb(121,158,179);
  background-color: rgb(121,158,179);
}
#cooperation-images ul.process li:nth-of-type(3)
,#cooperation-images ul.process li:nth-of-type(4) {
  background-color: rgb(179,171,121);
  background-color: rgb(207,198,140);
}
#cooperation-images ul.commission li:nth-of-type(1) {
  background-color: rgb(207,140,149);
}
#cooperation-images ul.commission li:nth-of-type(2) {
  background-color: rgb(121,158,179);
}
#cooperation-images ul.commission li:nth-of-type(3) {
  width: calc((100% / 4 - 1em) * 2 + 1.3em);
  background-color: rgb(207,198,140);
}
#cooperation-images ul#normally li {
  
}
#cooperation-images ul#cooperation li {
  width: 100%;
  background: linear-gradient(0.25turn, #3f87a6, #ebf8e1, #f69d3c);
  background: linear-gradient(to right, rgb(207,140,149) 15%, rgb(141,183,207) 35%, rgb(207,198,140) 60%, rgb(207,198,140) 100%);
}
.cooperation-company h3 {
  font-weight: normal;
  font-size: 110%;
}
.cooperation-company h3:before {
  content: '■';
  color: var(--cooperation-light-color);
}
.cooperation-company div {
  padding-left: 1.1em;
}
@media screen and (max-width: 940px) {
  #cooperation-images li {
    font-size: 90%;
  }
}
@media screen and (max-width: 810px) {
  #cooperation-images ul {
    margin: 0 0.5em 1em;
  }
  #cooperation-images ul#cooperation {
    width: calc(100% - 1em);
  }
  #cooperation-images li {
    width : calc(100% / 4 - 0.5em);
  }
  #cooperation-images ul.commission li:nth-of-type(3) {
    width: calc((100% / 4 - 0.5em) * 2 + 0.6em);
  }
}
@media screen and (max-width: 768px) {
  
}
@media screen and (max-width: 660px) {
  #cooperation-images li{
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 2.2em;
    line-height: 1.5;
  }
  #cooperation-images li span {
    display: inline-block;
  }
}
@media screen and (max-width: 480px) {
  #cooperation-images {
    padding: 1em 0;
  }
  #cooperation-images ul#cooperation {
    bottom: 1em;
    width: 100%;
  }
  #cooperation-images ul {
    margin: 0 0em 1em;
  }
}
/*** description-mind ***/
#description-mind {
  position: relative;
}
#mind-images {
  position: relative;
  padding: 1.5em 0;
}

#mind-images ul#mind-normally.animation
,#mind-images ul#mind-cooperation.animation
,#mind-images ul.process li:nth-of-type(1) {
/*  animation: opacityChange1 infinite forwards;*/
  animation: opacityChange3 infinite forwards;
}
#mind-images ul#mind-normally.animation {
  animation-direction: alternate;
/*  animation-duration: 3.75s;*/
  animation-duration: 2.35s;
}
#mind-images ul#mind-cooperation.animation {
  animation-direction: alternate-reverse;
/*  animation-duration: 3.75s;*/
  animation-duration: 2.35s;
}
#mind-images ul.process li:nth-of-type(1) {
  animation-direction: alternate-reverse;
/*  animation-duration: 3.75s;*/
  animation-duration: 2.35s;
}
/*
#mind-images ul#mind-normally.animation {
  animation: opacity 1.5s 0s infinite alternate forwards ;
  animation: opacityChange2 3s 0s infinite alternate forwards ;
  animation: opacityChange1 3.75s 0s infinite alternate forwards ;
}
#mind-images ul#mind-cooperation.animation {
  animation: opacity 1.5s 0s infinite alternate-reverse forwards ;
  animation: opacityChange2 3s 0s infinite alternate-reverse forwards ;
  animation: opacityChange1 3.75s 0s infinite alternate-reverse forwards ;
}*/
#mind-images ul {
  display: flex;
  justify-content: space-between;
  margin: 0 1.5em 1.5em;
}
#mind-images ul.commission {
  margin-bottom: 0;
}
#mind-images ul#mind-cooperation {
  position: absolute;
  bottom: 1.5em;
  width: calc(100% - 3em);
  opacity: 0;
}
#mind-images li {
  width: calc(100% / 3 - 1em);
  padding: 1.5em 0;
  font-size: 105%;
  text-align: center;
  border: solid 1px;
}
#mind-images ul#mind-normally li:nth-of-type(1) {
  background-color: transparent;
  opacity: 0;
}
#mind-images ul.process li {
  padding: 1.5em 0;
}
#mind-images ul.commission li {
  padding: 0.8em 0;
}
#mind-images li:nth-of-type(1) {
  background-color: rgb(149,207,140);
}
#mind-images li:nth-of-type(2) {
  background-color: rgb(207,140,149);
}
#mind-images li:nth-of-type(3) {
  background-color: rgb(121,158,179);
}/*
#mind-images ul.process li:nth-of-type(1)::after {
  content: '';
  position: absolute;
  border: dotted ;
  width: calc(100% - 6px);
  height: calc(100% - 6px);
  top: 2px;
  left: 2px;
}*/
#mind-images ul#mind-cooperation li {
  width: 100%;
  background: linear-gradient(to right, rgb(149,207,140) 20%, rgb(207,140,149) 40%, rgb(207,140,149) 60%, rgb(141,183,207) 80%);
}
@media screen and (max-width: 940px) {
  #mind-images li {
    font-size: 90%;
  }
}
@media screen and (max-width: 810px) {
  #mind-images ul {
    margin: 0 0.5em 1em;
  }
  #mind-images ul#mind-cooperation {
    width: calc(100% - 1em);
  }
  #mind-images li {
    width : calc(100% / 3 - 0.5em);
  }
}
@media screen and (max-width: 768px) {
  
}
@media screen and (max-width: 660px) {
  #mind-images li {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 2.2em;
    line-height: 1.5;
  }
  #mind-images li span {
    display: inline-block;
  }
}
@media screen and (max-width: 480px) {
  #mind-images {
    padding: 1em 0;
  }
  #mind-images ul#mind-cooperation {
    bottom: 1em;
    width: 100%;
  }
  #mind-images ul {
    margin: 0 0em 1em;
  }
}
/***** cooperation-link *****/
.cooperation-link ul {
  display: flex;
  justify-content: center;
}
.cooperation-link li {
  width: calc((100% / 5) * 2);
  margin-right: 1em;
  text-align: center;
  background-color: whitesmoke;
  border: 3px #069 solid;
  line-height: 3;
}
.cooperation-link li:nth-last-of-type(1) {
  margin-right: 0;
}
.cooperation-link li:hover {
  opacity: 0.9;
}
.cooperation-link li a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  color: #069;
}
.cooperation-link li a > p {
  padding: 1em 0;
  line-height: 1.8;
}
@media screen and (max-width: 1024px) {
  .cooperation-link li {
    width: 50%;
  }
  .cooperation-link li span {
    display: inline-block;
    line-height: 2;
  }
}
@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);
}
@page {
  margin: 1em;
}
@media print {
  .gradation-lower {
    display: none;
  }
}