@charset "UTF-8";
/*
Theme Name: LEGALUS
Author: LEGALUS
Author URI: https://legalus.jp/
Version: 1.0
*/

/* html, body */
html {
  font-size: var(--font-size-default);
  scroll-behavior: smooth;
}
:target {
  scroll-margin-top: calc(var(--header-height) + var(--scroll-margin));
}

body {
  background-color: var(--color-background);
  color: var(--color-on-background);
  font-size: 1rem;
  font-family: sans-serif;
  line-height: 1.5;
  letter-spacing: .1em;
}

#top {
  height: 0;
  font-size: 0;
}

/* global */
hr.divide {
  border-style: solid none none none;
  border-top: solid 1px var(--color-separator);
  margin: 1rem 0;
}

div.scrollable {
  overflow: scroll;
}

strong {
  font-weight: bold;
  font-size: 1.1em;
}

span.small {
  font-size: 0.8em;
}
span.big {
  font-size: 1.2em;
}

.align-left {
  text-align: left;
}
.align-center {
  text-align: center;
}
.align-right {
  text-align: right;
}
.align-justify {
  text-align: justify;
}

table th.left,
table td.left {
  text-align: left;
}
table th.center,
table td.center {
  text-align: center;
}
table th.right,
table td.right {
  text-align: right;
}

.office-name {
  font-family: serif;
  font-weight: bold;
}
.office-name.colored {
  color: var(--color-primary-darker);
}

.bg-primary {
  background-color: var(--color-primary);
}
.bg-secondary {
  background-color: var(--color-secondary);
}

div.margin-box.small {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}
div.margin-box.medium {
  margin-top: 1rem;
  margin-bottom: 1rem;
}
div.margin-box.large {
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
}
div.margin-box.x-large {
  margin-top: 2rem;
  margin-bottom: 2rem;
}

/* images */
.bg-img {
  background-repeat: no-repeat;
}
span.bg-img {
  display: inline-block;
}
span.bg-img,
.bg-img-contain {
  background-size: contain;
  background-position: center;
}
.bg-img-cover {
  background-size: cover;
  background-position: center;
}

/* round-border table */
table.round-border {
  border: solid 1px var(--color-primary);
  border-collapse: separate;
  border-radius: var(--round-medium);
  border-spacing: 0;
  overflow: hidden;
}
table.round-border tr th {
  background-color: var(--color-primary-super-pale);
  color: var(--color-on-primary-pale);
  font-weight: bold;
}
table.round-border tr td {
  color: var(--color-on-background);
  background: #fff;
}
table.round-border tr th,
table.round-border tr td {
  border-top: solid 1px var(--color-primary);
  border-left: solid 1px var(--color-primary);
  padding: 0.5rem;
  font-size: 1rem;
}
table.round-border tr:first-child th,
table.round-border tr:first-child td {
  border-top-style: none;
}
table.round-border tr th:first-child,
table.round-border tr td:first-child {
  border-left-style: none;
}

/* table2 */
.table-2 {
  min-width: 500px;
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  background-color: #fff;
}
.table-2 th:first-child {
  border-radius: 5px 0 0 0;
}
.table-2 th:last-child {
  border-radius: 0 5px 0 0;
  border-right: 1px solid var(--color-primary-light);
}
.table-2 th {
  text-align: center;
  color: var(--color-primary-darker);
  background: var(--color-primary-super-pale);
  border-left: 1px solid var(--color-primary-light);
  border-top: 1px solid var(--color-primary-light);
  border-bottom: 1px solid var(--color-primary-light);
  width: 25%;
  padding: .8rem;
  vertical-align: middle;
}
.table-2 tbody th {
  border-top: none;
}
.table-2 tbody th:first-child {
  border-radius: 0%;
}
.table-2 td {
  text-align: center;
  border-left: 1px solid var(--color-primary-light);
  border-bottom: 1px solid var(--color-primary-light);
  border-top: none;
  width: 25%;
  padding: .8rem;
  vertical-align: middle;
}
.table-2 td:last-child {
  border-right: 1px solid var(--color-primary-light);
}

/* notes */
.notes {
  padding: 1rem;
  border-radius: .5rem;
  background-color: var(--color-primary-super-pale);
  margin-top: 1rem;
  text-align: left;
}
.notes p {
  font-size: .9em;
  color: var(--color-primary-darker);
}
.notes ul {
  margin-bottom: 1rem;
}
.notes ul li {
  margin-left: 1rem;
  color: var(--color-primary-darker);
}

/* icon */
i[class|="lf21"] {
  font-size: 1.25rem;
  color: var(--color-primary);
  vertical-align: middle;
}
i[class|="lf21"].large {
  font-size: 2rem;
}
i[class|="lf21"].hidden {
  display: none;
}

/* flex */
.flexbox {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.flexbox img {
  width: 100%;
}
.flexbox .profile-img img {
  display: block;
  width: 70%;
  margin: auto;
}

/* buttons */
div.button-links,
div.button-list {
  white-space: nowrap;
  margin: 0.5rem 0;
}
div.button-list.center,
div.button-links.center {
  text-align: center;
}
div.button-list.center a {
  margin-left: auto;
  margin-right: auto;
}
div.button-links.center a i {
  padding-right: .5rem;
  color: var(--color-primary);
}
div.button-links a,
div.button-list a,
div.button-style,
a.button {
  display: inline-block;
  background-color: #fff;
  border: solid 1px var(--color-primary);
  padding: 0.75rem 1rem;
  color: var(--color-primary);
  text-decoration: none;
  overflow: hidden;
  white-space: nowrap;
  cursor: pointer;
  font-size: 0;
}
div.button-list a {
  display: block;
  text-align: center;
  width: 280px;
}
div.button-links a > span,
div.button-list a > span,
div.button-style > span,
a.button > span {
  display: inline-block;
  vertical-align: middle;
  font-size: 1rem;
  line-height: 1;
  font-weight: bold;
}
div.button-links a.big > span,
div.button-list a.big > span,
div.button-style.big > span,
a.button.big > span {
  font-size: 1.25rem;
}
div.button-links a > span.multi-line,
div.button-list a > span.multi-line,
div.button-style > span.multi-line,
a.button > span.multi-line {
  line-height: 1.5;
}
div.button-links a > span.bg-img,
div.button-list a > span.bg-img,
div.button-style > span.bg-img,
a.button > span.bg-img {
  width: 1.6rem;
  height: 1.6rem;
  margin-right: 0.25rem;
}
div.button-links a > span.bg-img.icon-align-right,
div.button-list a > span.bg-img.icon-align-right,
div.button-style > span.bg-img.icon-align-right,
a.button span.bg-img.icon-align-right {
  margin-right: 0;
  margin-left: 0.25rem;
}
div.button-links a + a,
div.button-style + div.button-style {
  margin-left: 1rem;
}
div.button-list a + a {
  margin-top: 1rem;
}
div.button-links a.disabled,
div.button-list a.disabled,
div.button-style.disabled,
a.button.disabled {
  cursor: not-allowed;
  opacity: var(--opacity-disabled);
}

/* form */
input,
select,
textarea {
  appearance: none;
  -webkit-appearance : none;
  border: solid 1px var(--color-primary);
  border-radius: var(--round-small);
  padding: 0.5rem 0.75rem;
  font-size: 1rem;
  color: var(--color-on-background);
  line-height: 1.5;
}
textarea {
  resize: vertical;
  min-height: 120px;
}
select {
  padding-right: 2rem;
  background-repeat: no-repeat;
  background-size: 1.3rem 1.3rem;
  background-position: right 0.5rem center;
  background-color: transparent;
  background-color: #fff;
}
div.form-block {
  margin: 0.25rem 0 1rem 0;
}
div.form-block label {
  display: block;
  font-size: 1rem;
  font-weight: bold;
  line-height: 1;
  padding: 0.5rem 0;
}
div.form.confirm div.form-block label {
  color: var(--color-primary-darker);
}
div.form-block label span.required {
  color: var(--color-error);
}
div.form-block input,
div.form-block textarea {
  width: 100%;
  background-color: #fff;
}
div.form-block input {
  max-width: 480px;
}
div.form-block textarea {
  max-width: 800px;
  min-height: 240px;
}
div.form-block p.note {
  padding-top: 0.25rem;
}
div.form-block input,
div.form-block select,
div.form-block textarea {
  transition: background-color .3s ease;
}
div.form-block input.error,
div.form-block select.error,
div.form-block textarea.error {
  background-color: #ffdddd;
  animation-duration: 0.2s;
  animation-iteration-count: infinite;
  animation-name: shaking;
  animation-timing-function: linear;
}
div.form-block p.form-input-value {
  padding-left: 1rem;
}
div.form-bottom-block {
  margin: 1rem 0;
}
div.form-bottom-block p.note {
  font-size: 1rem;
  font-weight: bold;
}
div.form-bottom-block p a {
  text-decoration: none;
  color: var(--color-secondary-dark);
}
div.form-block input[type="datetime-local"] {
  text-align: left;
  min-height: 42px;
}
input[type="hidden"] {
  width: 0;
  height: 0;
  padding: 0;
  margin: 0;
}
@keyframes shaking {
  0% {
    transform: translate(0, 0);
  }
  25% {
    transform: translate(-10px, 0);
  }
  50% {
    transform: translate(0, 0);
  }
  75% {
    transform: translate(10px, 0);
  }
  100% {
    transform: translate(0, 0);
  }
}

/* header */
header {
  width: 100%;
  background-color: var(--color-background);
  display: flex;
  position: fixed;
  flex-wrap: nowrap;
  align-items: center;
  z-index: 999;
  left: 0;
  top: 0;
  box-shadow: var(--box-shadow-default);
  font-size: 0;
  height: var(--header-height);
  line-height: 1;
}
header a,
header div.header-menu-btn {
  text-decoration: none;
  color: var(--color-on-background);
  display: inline-block;
}
header div.header-logo {
  padding-left: calc(var(--header-height) / 6);
  flex-grow: 1;
}
header div.header-logo img {
  height: calc(var(--header-height) - 1rem);
  width: auto;
}
header div.header-title {
  text-align: left;
  flex-basis: auto;
  flex-grow: 1; 
}
header div.header-title span {
  font-size: 1.25rem;
  color: var(--color-primary-darker);
}
header div.header-item {
  white-space: nowrap;
  border-right: solid 2px var(--color-primary);
  padding: 0 0.5rem;
}
header div.header-item a,
header div.header-menu-btn {
  text-align: center;
}
header div.header-item p {
  font-size: 0.85rem;
  padding: 0.25rem 0 0.5rem 0;
}
header div.header-item span.english {
  display: block;
  font-size: calc(var(--header-height) * 0.17);
  color: var(--color-primary);
  padding-bottom: 0.25rem;
}
header div.header-item span.bg-img {
  width: 2rem;
  height: 2rem;
}
header div.header-tel p {
  font-size: 0;
}
header div.header-tel p > span {
  display: inline-block;
  vertical-align: middle;
}
header div.header-tel p > span.bg-img {
  width: 1.5rem;
  height: 1.5rem;
}
header div.header-tel p > span.tel-num {
  font-size: 1rem;
  font-weight: bold;
  color: var(--color-primary);
}
header div.header-tel p > span.biz-time {
  font-size: 0.75rem;
  padding-top: 0.3rem;
  color: var(--color-gray-dark);
}
header div.header-menu-btn {
  cursor: pointer;
  border-right-style: none;
}
/* for WP-admin */
body.admin-bar header {
  top: 32px;
}
body.admin-bar #wpadminbar {
  position: fixed !important;
}

/* footer */
footer a {
  display: inline-block;
  text-decoration: none;
}
footer div.footer-links {
  background-color: var(--color-primary-pale);
  text-align: center;
  padding: 0.625rem;
}
footer div.footer-links ul {
  list-style: none;
}
footer div.footer-links ul li {
  display: inline-block;
  padding: 0 0.625rem;
}
footer div.footer-links li a {
  color: var(--color-on-primary-pale);
}
footer > div.footer-copyright {
  background-color: var(--color-primary);
  color: var(--color-on-primary);
  font-size: 0.8rem;
  text-align: center;
  padding: 0.5rem 0;
}
footer {
  background: var(--color-background);
  box-shadow: var(--box-shadow-default);
}
footer .footer-contents {
  padding: 0 1rem;
}
footer .footer-contents .inner {
  padding: 1rem 0;
}
footer .footer-contents .inner .footer-logo a {
  display: flex;
  align-items: flex-end;
  justify-content: left;
  width: fit-content;
}
footer .footer-contents .inner .footer-logo a img {
  width: 33%;
  max-width: 130px;
}
footer .footer-contents .inner .footer-logo a .footer-office-name {
  color: var(--color-primary);
  font-size: 1.3rem;
  font-family: serif;
  line-height: 1.2rem;
}
footer .footer-contents .inner .footer-logo a .footer-office-name .english {
  margin-top: 5px;
  font-size: 70%;
  color: var(--color-gray);
}
footer .footer-contents .inner .footer-box {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--color-gray-light);
}
footer .footer-contents .inner .footer-office-info .footer-ttl {
  color: var(--color-primary);
  margin-bottom: 1rem;
  font-size: 1.25rem;
}
footer .footer-contents .inner .footer-office-info .footer-ttl small {
  font-size: .95rem;
  color: #333;
  padding-right: .25rem;
}
footer .footer-contents .inner .footer-office-info .footer-address {
  font-style: normal;
}
footer .footer-contents .inner .footer-office-info .footer-office-tel {
  font-size: 1.1rem;
  color: var(--color-primary-darker);
  font-weight: bold;
  margin: .5rem auto;
}
footer .footer-contents .inner .footer-office-info .footer-office-tel .bg-img {
  width: 1.6rem;
  height: 1.6rem;
  display: inline-block;
  vertical-align: middle;
}
footer .footer-contents .inner .footer-office-info .biz-time {
  color: var(--color-primary);
}
footer .footer-contents .inner .footer-links {
  padding: 2rem .5rem 1rem;
}
footer .footer-contents .inner .footer-links ul {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
}
footer .footer-contents .inner .footer-links ul li {
  list-style: none;
}
footer .footer-contents .inner .footer-links ul li a {
  color: var(--color-primary);
  text-decoration: none;
}

/* Drawer menu */
#drawer-menu {
  display: block;
  position: fixed;
  width: var(--drawer-menu-width);
  top: var(--header-height);
  right: calc((var(--drawer-menu-width) * -1) - 10px);
  background-color: var(--color-background);
  color: var(--color-on-surface);
  z-index: 998;
  box-shadow: var(--box-shadow-default);
  font-size: 0;
  transition: right .3s ease;
}
#drawer-menu.show {
  right: 0;
}
#drawer-menu div.scrollable {
  height: calc(100vh - var(--header-height));
}
#drawer-menu div.office-info {
  padding: 0.25rem;
}
#drawer-menu div.office-info div.office-title {
  text-align: left;
  padding-bottom: 1rem;
  white-space: nowrap;
  text-align: center;
}
#drawer-menu div.office-info div.office-title img,
#drawer-menu div.office-info div.office-title span {
  display: inline-block;
  vertical-align: middle;
}
#drawer-menu div.office-info div.office-title img {
  width: auto;
  height: 4rem;
}
#drawer-menu div.office-info div.office-title span {
  font-size: 1.2rem;
  color: var(--color-primary-darker);
  padding-left: 0.1rem;
}
#drawer-menu div.office-info p {
  margin: 0.15rem 0 0 0;
}
#drawer-menu div.office-info p span {
  display: inline-block;
  vertical-align: middle;
}
#drawer-menu div.office-info p span.bg-img {
  width: 1.6rem;
  height: 1.6rem;
}
#drawer-menu div.office-info p span.tel-num {
  font-size: 1.1rem;
  color: var(--color-primary-darker);
  font-weight: bold;
}
#drawer-menu div.office-info p.biz-time {
  font-size: 0.9rem;
}
#drawer-menu a,
#drawer-menu li.parent > div {
  text-decoration: none;
  color: var(--color-primary-dark);
  font-size: 1rem;
  display: block;
  padding: 0.5rem 0.5rem 0.5rem 0.75rem;
  line-height: 1.5;
  background-repeat: no-repeat;
  background-position: right center;
  background-size: 1rem 1rem;
}
#drawer-menu li.parent > div {
  background-position: right 0.16rem center;
  cursor: pointer;
}
#drawer-menu ul {
  list-style: none;
  border-top: solid 1px var(--color-separator);
}
#drawer-menu ul li {
  font-size: 0;
  padding: 0.25rem;
  border-bottom: solid 1px var(--color-separator);
}
#drawer-menu ul li p {
  font-size: 1rem;
}
#drawer-menu ul li i {
  padding-left: .25rem;
  color: var(--color-primary-darker);
}
main div.contents ul.sitemap span.english,
#drawer-menu ul li span.english {
  display: block;
  font-size: 0.825rem;
  padding: 0.1rem 0 0 0.5rem;
  color: var(--color-primary);
}
#drawer-menu ul li ul {
  margin-left: 1.8rem;
}
#drawer-menu ul li.parent ul {
  display: none;
}
#drawer-menu ul li ul li a {
  padding-left: 0;
}
#drawer-menu ul li ul li:last-child {
  border-bottom-style: none;
}
#drawer-menu ul li.parent.show ul {
  display: block;
}
#drawer-menu ul li.parent ul li,
#drawer-menu ul li.parent ul li a {
  transition-property: opacity,padding;
  transition-duration: .25s;
  transition-timing-function: linear;
  opacity: 1;
}
#drawer-menu ul li.parent.close ul li,
#drawer-menu ul li.parent.close ul li a {
  opacity: 0;
  padding: 0;
}
#drawer-menu div.scrollable > ul {
  margin-bottom: 128px;
}

/* Breadcrumbs */
div.breadcrumbs {
  font-size: 0;
}
div.breadcrumbs.block {
  padding-bottom: 0;
  margin-bottom: 2rem;
}
div.breadcrumbs.block + div.block {
  padding-top: 0;
}
div.breadcrumbs ol {
  list-style: none;
}
div.breadcrumbs ol li {
  display: inline-block;
  vertical-align: middle;
}
div.breadcrumbs ol li a {
  display: inline-block;
  text-decoration: none;
}
div.breadcrumbs ol li:after {
  content: '>';
  padding: 0 0.8rem;
}
div.breadcrumbs ol li:last-child:after {
  content: '';
  padding: 0;
}
div.breadcrumbs ol li:after,
div.breadcrumbs ol li span {
  font-size: 1rem;
  color: var(--color-gray);
  line-height: 1.4;
}

/* Pagenation */
nav.pagination {
  display: block;
  margin: 1rem 0 2rem 0;
}
nav.pagination div.nav-links {
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
}
nav.pagination div.nav-links .page-numbers {
  display: block;
  width: 2.5rem;
  height: 2.5rem;
  line-height: 2.5rem;
  text-align: center;
  /* border-radius: 50%; */
  text-decoration: none;
  font-size: 1rem;
  overflow: hidden;
  box-shadow: var(--box-shadow-default);
  margin: 0 0.25rem;
  color: var(--color-primary-darker);
}
nav.pagination div.nav-links a.page-numbers.prev,
nav.pagination div.nav-links a.page-numbers.next {
  font-weight: bold;
}
nav.pagination div.nav-links .page-numbers:first-child {
  margin-left: 0;
}
nav.pagination div.nav-links .page-numbers:last-child {
  margin-right: 0;
}
nav.pagination div.nav-links span.current {
  background-color: var(--color-primary-darker);
  color: var(--color-on-primary);
  box-shadow: none;
}
nav.pagination div.nav-links span.dots {
  box-shadow: none;
}

/* category-tags */
div.category-tags {
  display: block;
  font-size: 0;
}
div.category-tags > span {
  display: inline-block;
  vertical-align: middle;
  font-size: 1rem;
  background-color: var(--color-secondary-light);
  line-height: 1;
  padding: 0.5rem 0.825rem;
  text-decoration: none;
  color: var(--color-on-primary);
  margin: 0.4rem;
}

/* sns share */
div.sns-share-box {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-content: center;
  font-size: 0;
  background-color: var(--color-secondary-light);
  border-radius: var(--round-medium);
  margin: 0.5rem auto;
}
div.sns-share-box span {
  display: inline-block;
  vertical-align: middle;
}
div.sns-share-box span.bg-img {
  width: 1.6rem;
  height: 1.6rem;
}
div.sns-share-box span.sns-title {
  font-size: 1rem;
  color: var(--color-on-background);
  margin-left: 0.5rem;
  display: none;
}
div.sns-share-box > a {
  display: inline-block;
  border-style: solid;
  border-width: 1px;
  border-radius: 50%;
  background-color: #ffffff;
  padding: 0.2rem 0.6rem;
  cursor: pointer;
  white-space: nowrap;
  margin: 0.5rem;
  text-decoration: none;
}
div.sns-share-box a i[class|="lf21"] {
  font-size: 1.5rem;
}
div.sns-share-box a.sns-twitter {
  border-color: rgb(0, 0, 0);
}
div.sns-share-box a.sns-facebook {
  border-color: rgb(23,120,242);
}
div.sns-share-box a.sns-hatena {
  border-color: rgb(5,163,222);
}
div.sns-share-box a.sns-line {
  border-color: rgb(6,199,85);
}
div.sns-share-box a.sns-copy {
  border-color: rgb(115,115,115);
}
div.sns-share-box a.sns-copy i[class|="lf21"] {
  color: #737373;
}

/* main */
main {
  padding-top: var(--header-height);
  padding-bottom: calc(var(--bottom-float-show) + 60px);
  text-align: center;
}
main .limit-contents-width {
  max-width: var(--max-content-width);
  margin-left: auto;
  margin-right: auto;
}

/* main: h */
main h1,
main h2,
main h3,
main h4,
main h5,
main h6 {
  font-weight: bold;
  color: var(--color-primary-darker);
  margin: 1rem 0 1rem 0;
}
main h2,
main h3,
main h4,
main h5,
main h6 {
  border-color: var(--color-primary-light);
}
main h3,
main h4,
main h5,
main h6 {
  border-style: none none solid none;
  padding: 2px 4px 6px 4px;
  margin-left: 0.5rem;
}
main div.contents + h3 {
  margin-top: 2rem;
}
main h4,
main h5,
main h6 {
  font-size: 1rem;
  border-width: 0 0 1px 0;
}

/* main: post-contents */
main div.contents.post-contents h2,
main div.contents.post-contents h3,
main div.contents.post-contents h4,
main div.contents.post-contents h5,
main div.contents.post-contents h6 {
  margin-left: 0;
}
main div.contents.post-contents ul,
main div.contents.post-contents ol {
  margin-left: 1.5rem;
}
main div.contents.post-contents ul li,
main div.contents.post-contents ol li {
  padding: 0.2rem 0;
}
main div.contents.post-contents p,
main div.contents.post-contents ul,
main div.contents.post-contents ol,
main div.contents.post-contents figure {
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
}
main div.contents.post-contents table,
main div.contents.post-contents table th,
main div.contents.post-contents table td {
  border: solid 1px var(--color-primary);
  color: var(--color-on-background);
}
main div.contents.post-contents table th,
main div.contents.post-contents table tfoot td {
  background-color: var(--color-primary-pale);
  color: var(--color-on-primary-pale);
}
main div.contents.post-contents table th {
  font-weight: bold;
}

/* post-list-item, post-last-update */
main div.post-thumbnail {
  font-size: 0;
}
main div.post-thumbnail > img,
main div.post-thumbnail.no-image {
  overflow: hidden;
  object-fit: cover;
}
main ul.post-list div.post-thumbnail {
  margin-bottom: 0.5rem;
}
main ul.post-list div.post-thumbnail img {
  width: 100%;
  height: auto;
  border: 2px solid var(--color-primary);
}
main ul.post-list div.post-thumbnail.no-image {
  background-image: url(./assets/images/common/ogp-no-image_300px.webp);
  background-size: cover;
  width: 150px;
  height: 79px;
}
main div.post-list-item div.post-item-last-updated {
  font-size: 0.9rem;
  color: var(--color-primary);
}
main div.post-list-item div.post-item-title {
  font-size: 1rem;
  font-weight: bold;
}
main div.post-last-updated {
  text-align: right;
  font-size: 1rem;
  color: var(--color-primary);
}

/* figure */
main figure.large-image {
  display: block;
  margin: 0.5rem 0;
  padding: 0;
}
main figure.large-image > img {
  width: auto;
  height: auto;
  max-width: 100%;
  border-radius: var(--round-medium);
  overflow: hidden;
  border: solid 1px var(--color-gray-light);
}
main figure figcaption {
  padding: 0.5rem 0 0.75rem 0;
}
main figure.wp-block-table.is-style-stripes {
  border-bottom-style: none;
}
main figure.wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
  background-color: rgba(160, 160, 160, 0.1);
}

/* top */
main div.top-mv {
  position: relative;
  width: 100vw;
  height: calc(100vw * 0.6667);
  max-height: calc(100vh - var(--header-height));
}
main div.top-mv img.top-mv-img,
main div.top-mv div.top-mv-contents {
  position: absolute;
  left: 0;
  width: 100%;
}
main div.top-mv img.top-mv-img {
  top: 0;
  height: 100%;
  border-radius: 0 0 var(--round-medium) var(--round-medium);
  overflow: hidden;
  opacity: 0;
  transition: opacity 2s ease;
  object-fit: cover;
}
main div.top-mv div.top-mv-contents {
  transition: opacity .75s ease;
}
main div.top-mv.focus-mv div.top-mv-contents {
  opacity: 0;
}
main div.top-mv img.top-mv-img.show {
  opacity: 1;
}
main .top-mv-box {
  text-shadow: #ffffff 0 0 3px;
  background-color: rgba(255, 255, 255, 0.6);
  border-radius: var(--round-small);
  padding: 0.5rem;
  max-width: 800px;
  margin: 0 auto;
}
main div.top-mv h1 {
  font-size: 1.3rem;
  margin: 0.5rem auto;
  line-height: 1;
}
main div.top-mv-text {
  font-size: 1rem;
  line-height: 1.5;
  text-align: justify;
}
main > div.top-mv-text {
  padding: 0.5rem 1rem;
}
main div.top-mv-contents.bottom {
  bottom: 1rem;
}
main div.top-mv-buttons {
  margin-top: 0.5rem;
}
main div.top-mv-thumbs {
  background-color: rgba(127, 127, 127, 0.15);
  border-radius: var(--round-medium);
  margin: 0.5rem auto;
  overflow: scroll;
  text-align: center;
}
main div.top-mv-thumbs div.thumbs-box {
  white-space: nowrap;
}
main div.top-mv-thumbs img {
  width: auto;
  height: 64px;
  margin: 0.5rem;
  cursor: pointer;
  border-radius: var(--round-small);
  border: solid 1px #ffffff;
}
main div.top-mv-thumbs img.selected {
  outline: solid 3px var(--color-primary);
}

/* main: section-block */
main div.section-block {
  margin: 2rem 0;
  padding: 1.25rem;
  color: var(--color-on-background);
  text-align: center;
}
main div.section-block.colored {
  background-color: var(--color-surface-dark);
  margin-top: 3rem;
  padding: 2.5rem 1.25rem;
}
main div.section-block.no-margin {
  margin: 0;
}
main div.section-block.no-padding {
  padding: 0 1.25rem;
}
main div.section-style {
  margin-top: 1rem;
  text-align: center;
}
main div.section-style h2,
main div.section-block h2,
main div.section-block h3 {
  display: inline-block;
  font-weight: bold;
  color: var(--color-primary-darker);
}
main div.section-style h2,
main div.section-block h2 {
  font-size: 1.2rem;
  padding: 0 1rem 0.5rem 1rem;
  margin: 2rem 0 1.25rem 0;
  border-style: none none solid none;
  border-width: 2px;
  border-color: var(--color-separator);
}
main div.section-block h3 {
  font-size: 1rem;
  padding: 0;
  margin: 0 0 1.25rem 0;
  border-style: none;
}
main div.section-block div.tile-2row,
main div.section-block div.tile-free-row {
  display: flex;
  flex-wrap: wrap;
  padding-bottom: 0;
}
main div.section-block div.tile-2row {
  justify-content: space-between;
}
main div.section-block div.tile-2row.center {
  justify-content: space-around;
}
main div.section-block div.tile-free-row {
  justify-content: space-between;
}
main div.section-block div.tile-2row > * {
  display: block;
  width: 49%;
  margin-bottom: 1.25rem;
}
main div.section-block div.tile-free-row > * {
  display: block;
  margin: 0 0.25rem 1.25rem 0.25rem;
}
main div.section-block hr {
  border-style: solid none none none;
  border-width: 2px;
  border-color: var(--color-separator);
  margin: 1rem 0;
}

/* main: card,tag */
main div.card,
main a.card,
main div.tag,
main a.tag {
  background-color: var(--color-surface);
  color: var(--color-on-surface);
  text-decoration: none;
}
main div.card,
main a.card {
  border-radius: var(--round-medium);
}
main div.tag,
main a.tag {
  border-radius: 1.5rem;
  font-size: 0;
  padding: 0.825rem;
}
main div.card div.card-title,
main a.card div.card-title,
main div.tag span.tag-name,
main a.tag span.tag-name {
  font-size: 1.1rem;
  color: var(--color-primary-darker);
  font-weight: bold;
}
main div.card div.card-title,
main a.card div.card-title {
  text-align: center;
  padding: 1rem 0 0 0;
}
main div.tag > span,
main a.tag > span {
  display: inline-block;
  vertical-align: middle;
  line-height: 1;
}
main div.tag span.tag-color,
main a.tag span.tag-color {
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  margin: 0;
}
main div.tag span.tag-name,
main a.tag span.tag-name {
  margin: 0 0.25rem 0 0.5rem;
}
main div.card div.card-contents,
main a.card div.card-contents {
  padding: 1rem 1.5rem;
}
main div.card div.card-contents > p,
main a.card div.card-contents > p {
  font-size: 1rem;
  text-align: justify;
  color: var(--color-on-surface);
  line-height: 1.7;
  text-indent: 1rem;
}
main div.card div.card-contents > p + p,
main a.card div.card-contents > p + p {
  margin-top: 0.75rem;
}
main div.card.no-border,
main a.card.no-border {
  border-style: none;
}
main div.card div.card-contents-link {
  text-align: center;
  padding: 0.5rem 0;
  font-size: 1rem;
}
main div.card div.card-contents-link a {
  text-decoration: none;
  color: var(--color-secondary);
}
main div.card:target,
main a.card:target,
main div.card.focus,
main a.card.focus {
  border: solid 2px var(--color-primary);
  background-color: var(--color-primary-super-pale);
}

/* main: block */
main div.block {
  padding: 1rem;
  max-width: var(--max-content-width);
  margin: 0 auto;
  font-size: 1rem;
  text-align: left;
}
main div.block.eyecatch {
  padding: 0;
  font-size: 0;
  text-align: center;
}
main div.block.eyecatch > img {
  width: auto;
  height: auto;
  max-width: 100vw;
  max-height: 100vh;
  overflow: hidden;
}
main div.block.eyecatch.small {
  margin: 1rem 0;
}
main div.block.eyecatch.small > img {
  width: calc(100% - 2rem);
  max-width: 480px;
  border: 2px solid var(--color-primary);
}
main div.block p {
  line-height: 1.5;
}

/* main: contents */
main div.contents {
  padding-left: 1rem;
}
main div.contents.no-indent {
  padding-left: 0;
}
main div.contents + div.contents {
  margin-top: 1rem;
}
main div.contents.box + div.contents.box {
  margin-top: 2.5rem;
}
main div.contents.text p {
  line-height: 1.7;
  font-size: 1rem;
}
main div.contents.text p.br {
  height: 0.75rem;
  font-size: 0.5rem;
}
main div.contents.text.p-margin p + p {
  margin-top: 0.75rem;
}
main div.contents.list ul,
main div.contents.list ol {
  margin-left: 1.5rem;
}
main div.contents.list ul {
  list-style: disc;
}
main div.contents.list ul li,
main div.contents.list ol li {
  padding: 0.25rem 0;
  font-size: 1rem;
  line-height: 1.5;
}
main div.contents.list ol.order-list > li {
  background-repeat: no-repeat;
  background-size: 1.5rem 1.5rem;
  background-position: left 0.5rem bottom;
  padding-bottom: 1.4rem;
}
main div.contents.list ol.order-list > li:last-child {
  background-image: none;
  padding-bottom: 0.25rem;
}
main div.contents.list div.additional {
  margin-top: 1rem;
  padding-left: 1.5rem;
}
main div.contents.post-contents a,
main div.contents.faq a,
main div.contents.text p a,
main div.contents.list ul li a,
main div.contents.list ol li a {
  text-decoration: none;
  font-weight: bold;
  color: var(--color-secondary);
}
main div.contents p.tel-info span,
main div.contents ul.link-list span {
  display: inline-block;
  vertical-align: middle;
}
main div.contents p.tel-info span {
  font-size: 1.2rem;
}
main div.contents p.tel-info span.bg-img,
main div.contents ul.link-list span.bg-img {
  width: 1.5rem;
  height: 1.5rem;
  margin-right: 0.4rem;
}
main div.contents ul.link-list,
main div.contents ul.link-list li ul {
  list-style: none;
}
main div.contents ul.link-list li {
  padding: 0.25rem 0;
}
main div.contents ul.link-list li ul {
  margin-left: 1.8rem;
}
main div.contents ul.link-list a {
  display: block;
  text-decoration: none;
  color: var(--color-secondary-dark);
  font-size: 1rem;
  padding: 0.5rem 0;
}
main div.contents div.map-wrapper {
  font-size: 0;
  margin-bottom: 2rem;
}
main div.contents div.map-wrapper iframe {
  width: 100%;
  overflow: hidden;
  border: solid 1px var(--color-primary-light);
}
main div.contents.form div.error-info {
  padding: 1rem;
  border: solid 2px var(--color-effect);
  border-radius: var(--round-medium);
  margin: 1rem 0;
}
main div.contents.form div.error-info p {
  font-weight: bold;
  font-size: 1.1rem;
  color: var(--color-error);
}
main div.contents.image-with-text {
  display: flex;
  margin-bottom: 1rem;
}
main div.contents.image-with-text div.image-box {
  font-size: 0;
}
main div.contents.image-with-text div.image-box img {
  box-shadow: var(--box-shadow-default);
  width: 100%;
  max-width: 280px;
}
main div.contents.image-with-text div.text-box {
  flex: 1;
  padding: 0 0 1rem 1rem;
  border-bottom: solid 1px var(--color-primary-light);
}
main div.contents.cta {
  margin-top: 1rem;
}
main div.contents ul.note,
main div.contents div.note {
  display: block;
  overflow: hidden;
  border: solid 1px var(--color-primary-light);
  background-color: var(--color-primary-pale);
  color: var(--color-on-primary-pale);
  padding: 0.75rem 1rem;
}
main div.contents ul.note {
  list-style: none;
}
main div.contents ul.note > li {
  margin: 0;
  padding: 0.25rem;
}
main div.contents div.info {
  padding-top: 0.5rem;
}
main div.contents ul + div.info {
  padding-left: 1.5rem;
}
main div.contents p.caption {
  margin-bottom: 0.25rem;
}
main div.contents.faq dl {
  padding-left: 1rem;
}
main div.contents.faq dl dt,
main div.contents.faq dl dd,
main div.contents.def dl dt,
main div.contents.def dl dd {
  display: block;
  line-height: 1.6;
}
main div.contents.faq dl dt {
  font-size: 1.1rem;
  font-weight: bold;
}
main div.contents.faq dl dt:before {
  content: 'Q';
  margin: 0 0.4rem 0 -1.3rem;
  color: var(--color-primary);
}
main div.contents.faq dl dd {
  padding: 0.25rem 0 0.5rem 1.4rem;
}
main div.contents.faq dl dd:before {
  content: 'A';
  margin: 0 0.4rem 0 -1.3rem;
  color: var(--color-primary);
  font-weight: bold;
}
main div.contents.def dl dt {
  font-weight: bold;
  color: var(--color-primary);
  opacity: 0.9;
}
main div.contents.def dl dd {
  padding: 0 0 0.75rem 1rem;
}
main div.contents.def dl dd:last-child {
  padding-bottom: 0.25rem;
}
main div.contents.table-no-border table {
  border-collapse: collapse;
  border-style: none;
}
main div.contents.table-no-border table th,
main div.contents.table-no-border table td {
  font-size: 1rem;
  padding: 0.25rem;
  border-style: none;
}
main div.contents.table-no-border table th {
  font-weight: bold;
  padding-right: 0.5rem;
}
main div.contents.images img {
  margin: 0.4rem;
}
main div.contents.images img.clickable {
  cursor: pointer;
  box-shadow: var(--box-shadow-default);
}

/* main: list */
main ul.history,
main ul.post-list {
  list-style: none;
  margin-bottom: 0.5rem;
}
main ul.history a,
main ul.post-list a {
  text-decoration: none;
  color: var(--color-on-background);
  font-size: 1rem;
  display: block;
  padding: 0.25rem 1.5rem 0.25rem 0;
  background-position: center right;
  background-size: 1rem 1rem;
  line-height: 1.7;
}
main ul.post-list a {
  padding: 0;
  transition: ease .5s;
}
main ul.history li,
main ul.post-list li {
  padding: 0.5rem 0;
  border-bottom: solid 1px var(--color-separator);
}
main ul.history li:last-child {
  border-bottom-style: none;
}
main ul.history dl {
  display: flex;
  flex-wrap: nowrap;
}
main ul.history dl dt,
main ul.history dl dd {
  display: block;
  line-height: 2;
}
main ul.history dl dt {
  font-weight: bold;
  white-space: nowrap;
  width: 120px;
  text-align: right;
  color: var(--color-primary);
}
main ul.history.short dl dt {
  width: 130px;
  text-align: left;
}
main ul.history dl dd {
  flex: 1;
  padding-left: 1rem;
  text-align: left;
}
main ul.category-list a {
  color: var(--color-primary-darker);
}

/* main: lawyer-box */
main div.lawyer-box {
  display: table;
  width: auto;
  margin: 1.25rem auto;
  font-size: 0;
}
main div.lawyer-box.left {
  margin: 1.25rem 0;
}
main div.lawyer-box.with-memo {
  margin-bottom: 0.25rem;
}
main div.lawyer-box > div {
  display: table-cell;
  vertical-align: middle;
  text-align: left;
}
main div.lawyer-box > div.lawyer-img {
  padding-right: 1rem;
}
main div.lawyer-box > div.lawyer-img img {
  width: 86px;
  height: 86px;
  border: solid 1px var(--color-gray-light);
  border-radius: 50%;
  overflow: hidden;
}
main div.lawyer-box > div.lawyer-title {
  padding-right: 0.5rem;
  font-size: 0.825rem;
}
main div.lawyer-box > div.lawyer-info {
  text-align: left;
  width: auto;
}
main div.lawyer-box ruby.lawyer-sei,
main div.lawyer-box ruby.lawyer-mei {
  font-size: 1.4rem;
  font-weight: bold;
}
main div.lawyer-box ruby.lawyer-sei {
  margin-right: 0.4rem;
}
main div.lawyer-box div.english {
  font-size: 0.825rem;
  padding-left: 0.25rem;
  color: var(--color-secondary);
}
main div.lawyer-box + div.lawyer-memo {
  font-size: 0.825rem;
  margin-bottom: 1.25rem;
}

/* main: lawyer-img */
main div.lawyer-img {
  position: relative;
}
main div.lawyer-img > div.lawyer-img img {
  width: 100%;
  height: auto;
  max-width: 512px;
  max-height: 512px;
  border-radius: var(--round-medium);
  overflow: hidden;
  box-shadow: var(--box-shadow-default);
}
main div.lawyer-img > div.lawyer-info {
  position: absolute;
  top: 0.825rem;
  left: 0.825rem;
  background-color: rgba(0, 0, 0, 0.5);
  padding: 0.5rem;
  border-radius: var(--round-small);
  color: #ffffff;
}
main div.lawyer-img ruby.lawyer-sei,
main div.lawyer-img ruby.lawyer-mei {
  font-size: 1.1rem;
  font-weight: bold;
}
main div.lawyer-img ruby.lawyer-sei {
  margin-right: 0.25rem;
}
main div.lawyer-img span.lawyer-title {
  display: inline-block;
  margin-left: 0.25rem;
  font-size: 0.75rem;
}
main div.lawyer-img div.english {
  font-size: 0.825rem;
  padding-left: 0.2rem;
}

/* service-item */
main .card.service-item {
  position: relative;
  margin-top: 70px;
}
main .service-visual {
  width: 140px;
  height: 140px;
  border-radius: 50%;
  box-shadow: var(--box-shadow-default);
  overflow: hidden;
  background-size: cover;
}
main .card.service-item .service-visual {
  position: absolute;
  top: 0;
  left: 50%;
  text-align: center;
  z-index: 1;
  margin-top: -70px;
  margin-left: -70px;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  align-content: center;
}
main .service-visual > span {
  font-size: 1.3rem;
  font-weight: bold;
  color: #ffffff;
  text-shadow: #000000 0 0 4px;
}
main .card.service-item div.service-children {
  margin-top: calc(70px - 1rem);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}
main .card.service-item div.service-children > span {
  display: inline-block;
  width: 49%;
  margin-top: 0.5rem;
  font-size: 1.1rem;
  font-weight: bold;
  color: var(--color-gray);
}
main .service-visual.divorce {
  background-image: url(./assets/images/services/divorce-mini.webp);
}
main .service-visual.inheritance {
  background-image: url(./assets/images/services/inheritance-mini.webp);
}
main .service-visual.real-estate {
  background-image: url(./assets/images/services/real-estate-mini.webp);
}
main .service-visual.corporate-legal {
  background-image: url(./assets/images/services/corporate-legal-mini.webp);
}

/* to Top */
a.to-top-button {
  display: block;
  position: fixed;
  right: -60px;
  bottom: var(--bottom-float-show);
  z-index: 5;
  transition-property: right, bottom;
  transition-timing-function: ease;
  transition-duration: .3s;
  cursor: pointer;
  text-decoration: none;
}
a.to-top-button.show {
  right: 10px;
}
a.to-top-button i.icon-top {
  width: 56px;
  height: 56px;
  background-size: 58% 58%;
  border-radius: 50%;
  background-color: var(--color-primary);
  box-shadow: var(--box-shadow-default);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-on-primary);
  font-size: 2rem;
}

/* dialog, float-msgbox */
div.dialog,
div.lu-float-msgbox {
  position: fixed;
  z-index: 9999;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  box-shadow: var(--box-shadow-default);
  border-radius: var(--round-large);
}
div.dialog {
  display: none;
  min-width: 50vw;
  min-height: 200px;
  max-width: 100vw;
  max-height: 100vh;
  transition-timing-function: ease;
}
div.lu-float-msgbox {
  background-color: rgba(0, 0, 0, 0.6);
  padding: 1.5rem;
  border: solid 1px #ffffff;
  font-size: 1.25rem;
  color: #ffffff;
  white-space: pre-wrap;
  max-width: 80vw;
  min-width: 280px;
  opacity: 0;
  transition: opacity .5s ease;
}
div.dialog.ready {
  display: block;
  opacity: 0;
  transition: opacity .5s, transform .5s;
  transform-origin: center center;
  transform: translate(-50%, -50%) scale(0.5, 0.5);
}
div.dialog.ready.show {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1, 1);
}
div.dialog div.dialog-close {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  width: 50px;
  height: 50px;
  box-shadow: var(--box-shadow-default);
  background-color: rgba(255, 255, 255, 0.8);
  background-position: center center;
  background-size: 75% 75%;
  border-radius: 50%;
  border: solid 1px #cccccc;
  cursor: pointer;
  z-index: 10;
}

/* dialog-img-viewer */
div.dialog-img-viewer {
  background-color: rgba(255, 255, 255, 0.9);
  font-size: 0;
  padding: 0;
  overflow: hidden;
  width: calc(100vw - 1rem);
  /* max-width: var(--max-content-width); */
}
div.dialog-img-viewer div.img-box {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  width: 100%;
  height: calc(85vh - 100px);
  max-height: calc((100vw - 1rem) * 0.6667);
}
div.dialog-img-viewer div.thumbs-box {
  width: 100%;
  overflow: scroll;
  white-space: nowrap;
  text-align: center;
  padding: 0.25rem;
}
div.dialog-img-viewer div.thumbs-box img {
  height: 64px;
  width: auto;
  margin: 0.5rem;
  border: solid 1px #ffffff;
  border-radius: var(--round-small);
  box-shadow: var(--box-shadow-default);
  cursor: pointer;
}
div.dialog-img-viewer div.thumbs-box img.selected {
  outline: solid 3px var(--color-primary);
}

/* Shadow */
#shadow {
  display: none;
  position: fixed;
  top: var(--header-height);
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.05);
  z-index: 990;
}
body.shadow #shadow {
  display: block;
}
body.shadow.all #shadow {
  z-index: 9990;
  top: 0;
  background-color: rgba(0, 0, 0, 0.15);
}
body.shadow main,
body.shadow footer,
body.shadow .shadow-blur,
body.shadow.all header,
body.shadow.all #drawer-menu {
  filter: blur(6px);
}

.lf21-close {
  display: none;
}
body.shadow .lf21-menu {
  display: none;
}
body.shadow .lf21-close {
  display: block;
}

/* for WP-admin */
@media screen and (max-width: 782px) {
  body.admin-bar header {
    top: 46px;
  }
}

/* for SmartPhone or Phablet */
@media screen and (max-width: 1023px) {
  .sp-hidden {
    display: none !important;
  }
  main div.section-block div.tile-2row.tile-sp {
    justify-content: space-around;
  }
  main div.section-block div.tile-2row.tile-sp > * {
    width: 98%;
  }
  main ul.history dl {
    flex-wrap: wrap;
  }
  main ul.history dl dt,
  main ul.history.short dl dt {
    width: 100%;
    text-align: left;
  }
  main ul.history dl dt br {
    display: none;
  }
  main ul.history dl dd {
    padding-top: 0.25rem;
  }
  main div.contents div.map-wrapper iframe {
    height: 320px;
  }
  main div.contents.image-with-text {
    flex-wrap: wrap;
  }
  main div.contents.image-with-text div.image-box {
    width: 100%;
  }
  main div.contents.image-with-text div.text-box {
    width: 100%;
    padding: 1rem 0;
  }
}

/* for Phablet */
@media screen and (min-width: 480px) {
  header div.header-title span {
    font-size: calc(var(--header-height) * 0.3);
  }
  main .top-mv-box {
    padding: 1rem;
  }
  main div.top-mv h1 {
    font-size: 1.5rem;
    margin: 0.625rem auto;
  }
  main div.lawyer-box > div.lawyer-img img {
    width: 128px;
    height: 128px;
  }
  main div.contents div.map-wrapper iframe {
    height: 400px;
  }
}

/* for PC */
@media screen and (min-height: 933px) {
  main div.top-mv {
    max-height: calc(var(--max-content-width) * 0.6667);
  }
}
@media screen and (min-width: 1024px) {
  :root {
    --header-height: 80px;
  }
  .pc-hidden {
    display: none !important;
  }
  main div.top-mv h1 {
    font-size: 2rem;
    margin: 1rem auto;
  }
  main div.contents div.map-wrapper iframe {
    height: 480px;
  }
  div.sns-share-box > a {
    border-radius: var(--round-small);
  }
  div.sns-share-box span.sns-title {
    display: inline-block;
  }
  main div.post-list-item {
    display: flex;
    flex-direction: column;
  }
  main div.post-list-item div.post-item-info {
    margin-left: 0.825rem;
  }
  nav.pagination div.nav-links .page-numbers {
    width: 3rem;
    height: 3rem;
    line-height: 3rem;
    margin: 0 0.33rem;
  }
  div.dialog-img-viewer {
    width: calc(100vw - 4rem);
  }
  div.dialog-img-viewer div.img-box {
    max-height: calc((100vw - 4rem) * 0.6667);
  }
  /* hover */
  a.hover-opacity {
    transition: opacity .3s ease;
  }
  a.to-top-button:hover,
  a.hover-opacity:hover {
    opacity: var(--opacity-hover);
  }
  header div.header-item a,
  header div.header-menu-btn,
  #drawer-menu a,
  #drawer-menu li.parent > div {
    transition: background-color .3s ease;
  }
  header div.header-item a:hover,
  header div.header-menu-btn:hover,
  #drawer-menu a:hover,
  #drawer-menu li.parent > div:hover {
    background-color: var(--color-primary-super-pale);
  }
  div.breadcrumbs ol li a:hover span,
  footer div.footer-links a:hover,
  main ul.history a:hover dt,
  main ul.history a:hover dd,
  main div.contents.list ul li a:hover,
  main div.contents ul.link-list a:hover span,
  main div.contents.post-contents a:hover,
  main div.contents.faq a:hover,
  main div.contents.text p a:hover,
  main div.card div.card-contents-link a:hover,
  main ul.post-list a:hover div.post-item-title,
  main ul.category-list a:hover span,
  div.form-bottom-block p a:hover {
    text-decoration: underline;
  }
  main ul.post-list#column-list a:hover {
    transform: scale(1.025);
  }
  
  main a.service-item .service-visual,
  main a div.lawyer-img img,
  main div.top-mv-thumbs img,
  div.dialog-img-viewer div.thumbs-box img,
  div.dialog div.dialog-close,
  main div.contents.images img.clickable {
    transition: transform .3s ease;
  }
  main a.service-item:hover .service-visual,
  main a:hover div.lawyer-img img,
  main div.top-mv-thumbs img:hover,
  div.dialog-img-viewer div.thumbs-box img:hover,
  div.dialog div.dialog-close:hover,
  main div.contents.images img.clickable:hover {
    transform: scale(1.1, 1.1);
  }
  /* focus */
  div.button-style:focus {
    outline: solid 3px var(--color-primary);
  }
}