@charset "UTF-8";
/* =====================================
reset
------------------------------------- */
* {
  margin: 0;
  border: none;
  padding: 0;
}

@font-face {
  font-family: "YuGothicRedifined";
  font-weight: normal;
  src: local("YuGothic-Medium"), local("Yu Gothic Medium"), local("YuGothic-Regular");
}

@font-face {
  font-family: "YuGothicRedifined";
  font-weight: bold;
  src: local("YuGothic-Bold"), local("Yu Gothic");
}

/* =====================================
base
------------------------------------- */
*,
*:before,
*:after {
  box-sizing: border-box;
}

*:before,
*:after {
  text-decoration: inherit;
  vertical-align: inherit;
}

html {
  position: relative;
  overflow-y: scroll;
  background-color: #fff;
  color: #333;
  font-size: 10px;
  font-family: Arial, Helvetica, YuGothicRedifined, YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  line-height: 2;
  font-size: 1.6em;
  letter-spacing: -.00001em;
  word-wrap: break-word;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary,
svg {
  display: block;
}

button,
input,
optgroup,
select,
textarea {
  color: inherit;
  font: inherit;
  text-shadow: inherit;
}

input[type="submit"],
input[type="button"],
input[type="image"],
input[type="reset"],
input[type="radio"],
input[type="checkbox"],
button,
select,
option,
label {
  cursor: pointer;
}

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

table {
  border-collapse: collapse;
}

h1,
h2,
h3,
h4,
h5,
h6,
th,
dt {
  font-weight: normal;
}

ul,
ol {
  list-style: none;
}

img {
  vertical-align: top;
  max-width: 100%;
  height: auto;
  border: none;
}

table {
  word-break: break-all;
}

table img {
  max-width: inherit;
}

strong,
em,
b,
i {
  font-style: normal;
}

strong,
em,
b {
  font-weight: bold;
}

strong {
  color: #cc0030;
}

h1,
h2,
h3,
h4,
h5,
h6,
small {
  font-size: 100%;
}

a {
  color: #08107b;
  text-decoration: none;
}

a:visited {
  color: #73077a;
}

a:hover, a:focus, a:active {
  text-decoration: underline;
}

/* =====================================
extend
------------------------------------- */
#header > .header-inner::after, .header-item::after, .breadcrumb > ol::after, .lyt-img-02::after, [class*="hdg-section"]::after, .list-anchor-01::after, .form-search .form-search-option > dd > ul::after {
  content: "";
  display: block;
  clear: both;
}

.lyt-medicaltown-01 > .hdg, .lyt-medicaltown-01 > .content-outer > .content-inner, .lyt-medicaltown-02 > .inner, .lyt-product-01 > .inner, .lyt-notice-01, .lyt-top-01 > .inner, .lyt-top-03, .lyt-top-04 .area-hdg, .lyt-top-04 .area-news > .inner, .lyt-top-05 > .panel > a > span, .lyt-brand-01, .lyt-brand-02 > .hdg, .lyt-brand-02 > .content-outer > .content-inner, .lyt-brand-03 > .inner, .lyt-brand-04 > .inner, #brand-connection > .section > .inner {
  max-width: 1170px;
  margin: 0 auto;
  padding-left: 30px;
  padding-right: 30px;
}

#header > .header-inner, #nav-global .submenu > .submenu-inner, .breadcrumb > ol, #footer > .footer-inner, #main .area-content > .area-content-inner, .nav-local-01, .hdg-page-01 > span {
  max-width: 1110px;
  margin: 0 auto;
}

.header-search, .header-search > .header-search-input > .header-search-input-inner, #nav-global > ul, #nav-global .submenu .submenu-box, #nav-global .submenu .list-link, .footer-link-01, .lyt-col-01, .lyt-col-01.col-equalize > .col, .lyt-col-02, .lyt-img-03, .lyt-calendar-01 > .calendar, .lyt-csr-01, .lyt-csr-01 > .message, .lyt-csr-01 > .message a, .lyt-csr-01 > .activity > dd ul, .lyt-csr-01 > .activity > dd ul > li, .lyt-csr-01 > .activity a, .lyt-mainvisual-01 > .inner, .lyt-mainvisual-01 > .inner > .area > .ui, .lyt-top-01 .area-hdg, .lyt-top-02, .lyt-top-04 .area-hdg, .lyt-top-05, .box-related-01, .box-related-01 > li > .link .img, .box-notice-01, .box-stockinfo-01, .pgh-notice-01 > small, .pgh-topmessage-01 strong, .pgh-topmessage-02 strong, .list-link-01.col2, .list-link-01.col3, .list-link-01.col4, .list-bullet-01.col2, .list-bullet-01.col3, .list-bullet-01.col4, .list-define-01, .list-person-01, .list-person-01 > li, .list-step-01, .list-brand-01, .list-brand-01 > li > a, .nav-btn-01, .nav-btn-01 > *, .nav-index-01, .nav-index-01 > li.recruit-new, .nav-index-01 > li.recruit-new > div, .nav-index-01 > li.recruit-new > div > div, .nav-index-01 > li.alternate, .nav-index-02, .nav-index-02 > li, .nav-index-04, .nav-index-04 > li, .nav-index-05, .nav-index-07, .nav-tab-01, .nav-tab-01 > li, .nav-pager-01, .nav-pager-01 > li > ul, .nav-search-01, .nav-search-01 > .select, .nav-search-01 .list ul, .form-search .form-search-ui, .form-search .form-search-ui .form-search-input, .form-lyt-01 > li, #brand-connection > .hdg, #brand-connection > .section > .inner > .body, #brand-connection > .sns {
  display: -webkit-flex;
  display: flex;
}

#nav-global > ul, #nav-global .submenu .list-link, .footer-link-01, .lyt-col-01, .lyt-col-02, .lyt-img-03, .lyt-calendar-01 > .calendar, .lyt-mainvisual-01 > .inner, .box-related-01, .box-notice-01, .pgh-topmessage-01 strong, .pgh-topmessage-02 strong, .list-link-01.col2, .list-link-01.col3, .list-link-01.col4, .list-bullet-01.col2, .list-bullet-01.col3, .list-bullet-01.col4, .list-define-01, .list-person-01, .list-brand-01, .nav-btn-01, .nav-index-01, .nav-index-02, .nav-index-04, .nav-index-05, .nav-index-07, .nav-tab-01, .nav-pager-01 > li > ul, .nav-search-01 {
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}

#nav-global > ul > li, #nav-global .submenu .submenu-box > .col1, .lyt-csr-01 > .col, .lyt-csr-01 > .activity > dd ul > li, .lyt-csr-01 > .activity a, .lyt-mainvisual-01 > .inner > .area:nth-child(2), .lyt-mainvisual-01 > .inner > .area:nth-child(3), .lyt-mainvisual-01.col3 > .inner > .area:nth-child(1), .lyt-mainvisual-01.col3 > .inner > .area:nth-child(2), .lyt-mainvisual-01.col3 > .inner > .area:nth-child(3), .lyt-top-02 > .panel, .lyt-top-05 > .panel, .box-notice-01 > dd, .box-stockinfo-01 > .embed, .pgh-notice-01 > small > .text, .list-step-01 > li, .list-brand-01::after, .nav-index-01 > li.alternate > .link, .nav-index-02 > li > a,
.nav-index-02 > li > span, .nav-index-04 > li > a, .nav-index-04.col3::after, .nav-tab-01 > li > a, .form-lyt-01 > li > div, #brand-connection > .section > .inner > .body > .text {
  -webkit-flex: 1 1 0%;
  flex: 1 1 0%;
}

#nav-global .submenu .submenu-box > .col2 {
  -webkit-flex: 2 1 0%;
  flex: 2 1 0%;
}

#nav-global .submenu .submenu-box > .col3 {
  -webkit-flex: 3 1 0%;
  flex: 3 1 0%;
}

.lyt-img-03, .lyt-csr-01 > .activity a, .lyt-mainvisual-01 > .inner > .area > .ui, .box-related-01 > li > .link .img, .list-brand-01 > li > a, .nav-btn-01, .nav-index-01 > li.recruit-new > div > div, .nav-pager-01, .nav-pager-01 > li > ul, .nav-search-01, .form-search .form-search-ui, #brand-connection > .hdg, #brand-connection > .sns {
  -webkit-justify-content: center;
  justify-content: center;
}

.lyt-calendar-01 > .calendar, .lyt-top-01 .area-hdg, .lyt-top-04 .area-hdg, .box-notice-01, .list-define-01, .list-brand-01, .nav-index-01, .nav-index-02, .nav-index-05, .nav-index-07 {
  -webkit-justify-content: space-between;
  justify-content: space-between;
}

.lyt-img-03, .lyt-csr-01 > .message a, .lyt-csr-01 > .activity > dd ul, .lyt-csr-01 > .activity a, .lyt-top-01 .area-hdg, .lyt-top-04 .area-hdg, .box-related-01 > li > .link .img, .box-stockinfo-01, .list-brand-01 > li > a, #brand-connection > .hdg, #brand-connection > .sns {
  -webkit-align-items: center;
  align-items: center;
}

#nav-global .submenu .close span::before, #nav-global .submenu .close span::after, #nav-global .submenu .submenu-top a::after, #nav-global .submenu .list-link > li a::before, #nav-global .submenu .list-btn > li a::after, #nav-global .submenu .link-panel > span::after, .footer-pagetop > a::before, .footer-link-01 a::before, .lyt-csr-01 > .message a span::after, .lyt-csr-01 > .activity a > span::after, .lyt-top-01 .area-link > ul > li > a::after, .lyt-top-02 > .panel > a > span::after, .lyt-top-05 > .panel > a > span > span::after, .box-related-01 > li > a.link .text::before, .hdg-section-01 > a.link::after, .list-link-01 > li > a::before, .list-bullet-01 > li::before, .list-anchor-01 > li > a::before, .list-news-01 > li > a.link > .text::after, .list-toggle-01 > li > button.ui[aria-expanded]::after, .link-text-01::before, .link-banner-01 .link::before, .nav-btn-01 a::after,
.nav-btn-01 button::after, .nav-btn-02::after, .nav-index-01 > li > a.link > .text > span::after, .nav-index-01 > li.recruit-new > a > span b::after, .nav-index-02 > li > a > .link > span::after, .nav-index-03 > a.img-link > .link::before, .nav-index-04 > li > a::after, .nav-index-05 > li > a.link > .text > span::after, .nav-index-06 > dd > ul > li > a::after,
.nav-index-06 > dd > ol > li > a::after, .nav-pager-01 > li.prev > a::before, .nav-pager-01 > li.next > a::before, .nav-search-01 .list ul > li > a::before, #modal-next::before,
#modal-prev::before, #modal-close::before, #brand-connection > .hdg button::after {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

#nav-global .submenu .close span::after, .list-faq-01 > li > b[role="button"]::after, .form-search .form-search-ui .form-search-option-ui button::after, #modal-close::after {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.header-search > .label label span, .footer-pagetop > a > span, .lyt-calendar-01 > .calendar > li table th span b,
.lyt-calendar-01 > .calendar > li table td span b, .lyt-mainvisual-01 > .inner > .area > .ui > li > button > span,
.lyt-mainvisual-01 > .inner > .area > .ui > li > button > em, .list-toggle-01 > li > button.ui span, .list-faq-01 > li > b > .label, .nav-pager-01 a > span, #modal-next > span,
#modal-prev > span {
  position: absolute;
  top: -999em;
  left: -999em;
}

[lang="ja"] #nav-global, [lang="ja"] .box-content-01 > .hdg,
[lang="ja"] .box-highlight-01 > .hdg,
[lang="ja"] .box-light-01 > .hdg, [lang="ja"] .box-policy-01 .hdg, [lang="ja"] .hdg-page-01 > span > span, [lang="ja"] [class*="hdg-section"], [lang="ja"] [class*="hdg-section"] > .hdg, [lang="ja"] .hdg-categorytop-01 > .hdg, [lang="ja"] .pgh-lead-01, [lang="ja"] .pgh-lead-02, [lang="ja"] .pgh-topmessage-01, [lang="ja"] .pgh-topmessage-02, [lang="ja"] #brand-connection > .hdg, [lang="ja"] #brand-connection > .hdg button, [lang="ja"] #brand-connection > .section > .inner > .hdg,
[lang="ja"] #brand-connection > .section > .inner > .lead {
  font-feature-settings: "kern", "palt";
  letter-spacing: .0625em;
}

/* =====================================
structure
------------------------------------- */
/* ===========================
page
--------------------------- */
#page {
  position: relative;
  overflow: hidden;
}

/* ===========================
header
--------------------------- */
#header {
  position: relative;
  padding: 0 30px;
  border-bottom: 1px solid #d6d6d6;
}

#header > .header-inner {
  line-height: 1;
  padding: 20px 0;
}

@media only screen and (max-width: 768px) {
  #header {
    padding: 0;
    border-bottom: none;
  }
  #header > .header-inner {
    padding: 0;
  }
}

.header-logo {
  float: left;
  width: 170px;
  margin: 0 12px 0 0;
}

.header-logo > a {
  display: block;
}

@media only screen and (max-width: 768px) {
  .header-logo {
    position: absolute;
    top: 16px;
    left: 14px;
    float: none;
    width: 128px;
  }
}

.header-slogan {
  float: left;
  width: 170px;
  margin: 9px 24px 0 0;
}

@media only screen and (max-width: 768px) {
  .header-slogan {
    display: none;
  }
}

.header-item {
  float: right;
}

@media only screen and (max-width: 768px) {
  .header-item {
    float: none;
  }
}

.header-language {
  float: left;
  margin-bottom: 0;
  padding-top: .5em;
  color: #666;
  font-size: 1.4rem;
}

.header-language > a {
  display: inline-block;
}

.header-language > a > img {
  vertical-align: middle;
  opacity: .5;
  -webkit-transition: opacity .2s;
  transition: opacity .2s;
}

.header-language > a:hover > img, .header-language > a:focus > img, .header-language > a:active > img {
  opacity: 1;
}

.header-language > span {
  display: inline-block;
  margin-left: 5px;
}

@media only screen and (max-width: 768px) {
  .header-language {
    float: none;
    padding-top: 0;
    padding-right: 72px;
    text-align: right;
  }
  .header-language > a {
    display: inline-block;
    padding: 1.14286em 0;
  }
  .no-search .header-language {
    padding-right: 16px;
  }
}

.header-search {
  float: left;
  margin-left: 24px;
}

.header-search > .label {
  overflow: hidden;
}

.header-search > .label label {
  position: relative;
  display: block;
  width: 38px;
  height: 38px;
  background-color: #f2f2f2;
}

.header-search > .label label::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 14px;
  height: 14px;
  background-image: url(/shared/images/icon-loupe-01.png);
  background-size: cover;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.header-search > .header-search-input {
  -webkit-transition: height .2s;
  transition: height .2s;
  will-change: height;
}

.header-search > .header-search-input > .header-search-input-inner .input,
.header-search > .header-search-input > .header-search-input-inner .submit {
  height: 38px;
  background-color: #f2f2f2;
}

.header-search > .header-search-input > .header-search-input-inner .input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  position: relative;
  width: 167px;
  border-radius: 0;
  line-height: 2.375;
}

.header-search > .header-search-input > .header-search-input-inner .submit {
  width: 50px;
  line-height: 2.71429;
  color: #666;
  font-size: 1.4rem;
  text-align: center;
  -webkit-transition: background-color .2s;
  transition: background-color .2s;
  will-change: background-color;
}

.header-search > .header-search-input > .header-search-input-inner .submit:hover, .header-search > .header-search-input > .header-search-input-inner .submit:focus, .header-search > .header-search-input > .header-search-input-inner .submit:active {
  background-color: #e6e6e6;
}

@media only screen and (max-width: 845px) {
  .header-search {
    margin-left: 16px;
  }
  .header-search > .header-search-input > .header-search-input-inner .input {
    width: 117px;
  }
}

@media only screen and (max-width: 768px) {
  .header-search {
    position: relative;
    display: block;
    float: none;
    margin-left: 0;
  }
  .header-search > .label {
    position: absolute;
    top: -56px;
    right: 0;
  }
  .header-search > .label label {
    width: 56px;
    height: 56px;
  }
  .header-search > .header-search-input {
    height: 0;
    overflow: hidden;
  }
  .header-search > .header-search-input > .header-search-input-inner .input,
  .header-search > .header-search-input > .header-search-input-inner .submit {
    height: 40px;
  }
  .header-search > .header-search-input > .header-search-input-inner .input {
    -webkit-flex: 1;
    flex: 1;
    width: auto;
    line-height: 2.5;
    padding-left: 8px;
  }
  .header-search > .header-search-input > .header-search-input-inner .submit {
    width: 56px;
    line-height: 2.85714;
  }
  .header-search.opened > .header-search-input {
    height: 40px;
  }
  .static .header-search > .header-search-input {
    height: auto !important;
  }
}

#nav-global {
  margin-left: -1px;
  margin-right: -1px;
}

#nav-global > ul {
  max-width: 1112px;
  margin: 0 auto;
}

#nav-global > ul > li {
  padding: 0 1px;
}

#nav-global > ul > li > a {
  position: relative;
  display: block;
  line-height: 1.15;
  padding: .9375em 8px;
  background-color: #fff;
  color: #000;
  font-weight: bold;
  text-align: center;
  white-space: nowrap;
  -webkit-transition: background-color .2s, color .2s;
  transition: background-color .2s, color .2s;
  will-change: background-color, color;
}

#nav-global > ul > li > a::after {
  position: absolute;
  left: 0;
  right: 0;
  display: block;
  -webkit-transition: background-color .2s, bottom .2s;
  transition: background-color .2s, bottom .2s;
  will-change: background-color, bottom;
}

#nav-global > ul > li > a:hover, #nav-global > ul > li > a:focus, #nav-global > ul > li > a:active {
  background-color: #777;
  color: #fff;
  text-decoration: none;
}

#nav-global > ul > li > a.current {
  color: #08107b;
}

#nav-global > ul > li > a.current::after {
  content: "";
  bottom: 0;
  height: 4px;
  background-color: #20256b;
  opacity: 1;
  -webkit-transition: opacity .2s;
  transition: opacity .2s;
}

#nav-global > ul > li > a.current:hover, #nav-global > ul > li > a.current:focus, #nav-global > ul > li > a.current:active {
  color: #fff;
}

#nav-global > ul > li > a.current:hover::after, #nav-global > ul > li > a.current:focus::after, #nav-global > ul > li > a.current:active::after {
  opacity: 0;
}

#nav-global > ul > li > a[aria-expanded="true"] {
  color: #fff;
  background-color: #292929;
}

#nav-global > ul > li > a[aria-expanded="true"]::after {
  content: "";
  bottom: -2px;
  height: 2px;
  background-color: #292929;
  -webkit-transition: background-color .2s;
  transition: background-color .2s;
  will-change: background-color;
}

#nav-global > ul > li > a[aria-expanded="true"]:hover {
  background-color: #777;
}

#nav-global > ul > li > a[aria-expanded="true"]:hover::after {
  background-color: #777;
}

#nav-global > ul > li > a[aria-expanded="true"]:focus, #nav-global > ul > li > a[aria-expanded="true"]:active {
  background-color: #292929;
}

#nav-global > ul > li > a[aria-expanded="true"]:focus::after, #nav-global > ul > li > a[aria-expanded="true"]:active::after {
  background-color: #292929;
}

#nav-global > ul > li > a[aria-expanded="true"].current:hover::after, #nav-global > ul > li > a[aria-expanded="true"].current:focus::after, #nav-global > ul > li > a[aria-expanded="true"].current:active::after {
  opacity: 1;
}

#nav-global .submenu {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 9995;
  display: none;
  height: 0;
  line-height: 1.6;
  overflow: hidden;
  margin-top: 2px;
  box-shadow: 0 0 0 transparent;
  padding: 0 30px;
  background-color: #292929;
  -webkit-transition: height .2s, box-shadow .2s;
  transition: height .2s, box-shadow .2s;
  will-change: height, box-shadow;
}

#nav-global .submenu > .submenu-inner {
  position: relative;
  padding: 2.5em 0;
  color: #fff;
}

#nav-global .submenu .close {
  position: absolute;
  top: 2.5em;
  right: 0;
  display: block;
  border: 1px solid #474747;
  border-radius: .2rem;
  padding: .215em 10px;
  background-color: #292929;
  color: #fff;
  font-size: 1.4rem;
  opacity: 0;
  -webkit-transition: background-color .2s, opacity .4s;
  transition: background-color .2s, opacity .4s;
  will-change: background-color, opacity;
}

#nav-global .submenu .close:hover, #nav-global .submenu .close:focus, #nav-global .submenu .close:active {
  background-color: #474747;
}

#nav-global .submenu .close span {
  position: relative;
  display: inline-block;
  padding-left: 20px;
}

#nav-global .submenu .close span::before, #nav-global .submenu .close span::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  display: block;
  width: 17px;
  height: 1px;
  margin-top: -1px;
  background-color: #fff;
}

#nav-global .submenu a {
  color: #fff;
  text-decoration: none;
}

#nav-global .submenu a:hover, #nav-global .submenu a:focus, #nav-global .submenu a:active {
  text-decoration: underline;
}

#nav-global .submenu .submenu-top {
  line-height: 1.25;
}

#nav-global .submenu .submenu-top a {
  position: relative;
  display: inline-block;
  padding-right: 20px;
  font-size: 2.4rem;
}

#nav-global .submenu .submenu-top a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  display: block;
  width: 12px;
  height: 12px;
  margin-top: -6px;
  border-top: 3px solid #fff;
  border-right: 3px solid #fff;
}

#nav-global .submenu .submenu-box {
  margin: 2em 0 0 0;
}

#nav-global .submenu .submenu-box > .col1,
#nav-global .submenu .submenu-box > .col2,
#nav-global .submenu .submenu-box > .col3 {
  margin-left: 30px;
}

#nav-global .submenu .submenu-box > .col1:first-child,
#nav-global .submenu .submenu-box > .col2:first-child,
#nav-global .submenu .submenu-box > .col3:first-child {
  margin-left: 0;
}

#nav-global .submenu .submenu-box > .col1 {
  padding-right: 0;
}

#nav-global .submenu .submenu-box > .col1 > .col-inner {
  margin-right: 0;
}

#nav-global .submenu .submenu-box > .col2 {
  padding-right: 30px;
}

#nav-global .submenu .submenu-box > .col2 > .col-inner {
  margin-right: -30px;
}

#nav-global .submenu .submenu-box > .col3 {
  padding-right: 60px;
}

#nav-global .submenu .submenu-box > .col3 > .col-inner {
  margin-right: -60px;
}

#nav-global .submenu .list-link {
  margin: -1.0625em -15px -.1875em -15px;
}

#nav-global .submenu .list-link > li {
  width: 100%;
  margin-top: .9375em;
  padding: 0 15px;
}

#nav-global .submenu .list-link > li a {
  position: relative;
  display: inline-block;
  padding-left: 20px;
}

#nav-global .submenu .list-link > li a::before {
  content: "";
  position: absolute;
  top: .525em;
  left: 1px;
  display: block;
  width: 8px;
  height: 8px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
}

#nav-global .submenu .list-link > li a + span {
  margin-top: .25em;
}

#nav-global .submenu .list-link > li span {
  display: block;
  line-height: 1.6;
  padding-left: 20px;
  color: #ccc;
  font-size: 1.4rem;
}

#nav-global .submenu .list-link.col2 > li {
  width: 50%;
}

#nav-global .submenu .list-link.col3 > li {
  width: calc(100% / 3);
}

#nav-global .submenu .list-link.col4 > li {
  width: 25%;
}

#nav-global .submenu .list-desc {
  margin: -.125em 0 0 0;
}

#nav-global .submenu .list-desc > dt {
  margin-bottom: 1.375em;
  border-bottom: 1px solid #525252;
  padding-bottom: .375em;
  color: #fff;
  font-weight: bold;
}

#nav-global .submenu .list-btn {
  margin-bottom: 0;
}

#nav-global .submenu .list-btn > li {
  margin-top: .75em;
}

#nav-global .submenu .list-btn > li:first-child {
  margin-top: 0;
}

#nav-global .submenu .list-btn > li a {
  position: relative;
  display: block;
  border-radius: .2rem;
  padding: .9375em 36px .9375em 20px;
  background-color: #474747;
  font-weight: bold;
  -webkit-transition: background-color .2s;
  transition: background-color .2s;
  will-change: background-color;
}

#nav-global .submenu .list-btn > li a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 18px;
  display: block;
  width: 12px;
  height: 12px;
  margin-top: -6px;
  border-top: 3px solid #fff;
  border-right: 3px solid #fff;
  -webkit-transition: right .2s;
  transition: right .2s;
  will-change: right;
}

#nav-global .submenu .list-btn > li a:hover, #nav-global .submenu .list-btn > li a:focus, #nav-global .submenu .list-btn > li a:active {
  background-color: #777;
  text-decoration: none;
}

#nav-global .submenu .list-btn > li a:hover::after, #nav-global .submenu .list-btn > li a:focus::after, #nav-global .submenu .list-btn > li a:active::after {
  right: 14px;
}

#nav-global .submenu .list-btn > li a .notice {
  position: relative;
  top: -.125em;
  width: 15px;
  height: 24px;
  margin-right: .5em;
  vertical-align: middle;
}

#nav-global .submenu .link-panel {
  position: relative;
  display: block;
  width: 100%;
  overflow: hidden;
  padding-bottom: 56.25%;
}

#nav-global .submenu .link-panel::before, #nav-global .submenu .link-panel::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: block;
}

#nav-global .submenu .link-panel::before {
  z-index: 2;
  background-color: #777;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: -webkit-transform .4s;
  transition: transform .4s;
  will-change: -webkit-transform, transform;
}

#nav-global .submenu .link-panel::after {
  z-index: 3;
  background-color: rgba(0, 0, 0, .3);
  -webkit-transition: background-color .4s;
  transition: background-color .4s;
  will-change: background-color;
}

#nav-global .submenu .link-panel > span {
  position: absolute;
  top: 50%;
  left: 0;
  z-index: 4;
  display: inline-block;
  width: 100%;
  line-height: 1.4;
  margin-top: -.7em;
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
  text-shadow: 0 0 .66667em rgba(0, 0, 0, .4);
  white-space: nowrap;
}

#nav-global .submenu .link-panel > span::after {
  content: "";
  position: relative;
  top: -1px;
  right: -2px;
  display: inline-block;
  width: 12px;
  height: 12px;
  border-top: 3px solid #fff;
  border-right: 3px solid #fff;
}

#nav-global .submenu .link-panel:hover, #nav-global .submenu .link-panel:focus, #nav-global .submenu .link-panel:active {
  text-decoration: none;
}

#nav-global .submenu .link-panel:hover::before, #nav-global .submenu .link-panel:focus::before, #nav-global .submenu .link-panel:active::before {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

#nav-global .submenu .link-panel:hover::after, #nav-global .submenu .link-panel:focus::after, #nav-global .submenu .link-panel:active::after {
  background-color: rgba(0, 0, 0, .1);
}

#nav-global .submenu .link-panel.ir::before {
  background-image: url(/shared/images/submenu/ir.jpg);
}

#nav-global .submenu .link-panel.csr::before {
  background-image: url(/shared/images/submenu/csr.jpg);
}

#nav-global .submenu .link-panel.recruit::before {
  background-image: url(/shared/images/submenu/recruit.jpg);
}

#nav-global .submenu .link-panel + .list-link {
  margin-top: .25em;
}

#nav-global .submenu[aria-expanded="true"] {
  box-shadow: 0 .7em 1.4em rgba(0, 0, 0, .4);
}

#nav-global .submenu[aria-expanded="true"] .close {
  opacity: 1;
}

#nav-global .opened .submenu {
  display: block;
}

.ie #nav-global .submenu .list-link.col3 > li,
.edge #nav-global .submenu .list-link.col3 > li {
  width: 33.33333%;
}

@media only screen and (max-width: 768px) {
  #nav-global {
    margin-left: 0;
    margin-right: 0;
    text-align: center;
  }
  #nav-global > ul {
    display: block;
    padding: .35714em 8px;
    background-color: #292929;
    font-size: 1.4rem;
  }
  #nav-global > ul > li {
    display: inline-block;
    margin: .14286em 2px;
    padding: 0;
  }
  #nav-global > ul > li > a {
    padding-top: .5em;
    padding-bottom: .5em;
    background-color: #292929;
    color: #fff;
  }
  #nav-global > ul > li > a::after {
    content: none;
  }
  #nav-global > ul > li > a.current {
    color: #e9b226;
  }
  #nav-global > ul > li > a.current::after {
    content: none;
  }
  #nav-global > ul > li > a.current:hover, #nav-global > ul > li > a.current:focus, #nav-global > ul > li > a.current:active {
    color: #e9b226;
  }
  #nav-global .submenu {
    display: none !important;
  }
}

/* ===========================
breadcrumb
--------------------------- */
.breadcrumb {
  padding: 0 30px;
}

.breadcrumb > ol {
  padding: .3125em 0;
}

.breadcrumb > ol > li {
  position: relative;
  float: left;
}

.breadcrumb > ol > li::before, .breadcrumb > ol > li::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 10px;
  display: block;
  width: 7px;
  height: 1px;
  background-color: #666;
  -webkit-transform-origin: center right;
  transform-origin: center right;
}

.breadcrumb > ol > li::before {
  -webkit-transform: rotate(30deg);
  transform: rotate(30deg);
}

.breadcrumb > ol > li::after {
  -webkit-transform: rotate(-30deg);
  transform: rotate(-30deg);
}

.breadcrumb > ol > li:last-child::before, .breadcrumb > ol > li:last-child::after {
  content: none;
}

.breadcrumb > ol > li > a,
.breadcrumb > ol > li > em {
  display: block;
  font-size: 1.4rem;
}

.breadcrumb > ol > li > a {
  margin-right: 28px;
  text-decoration: underline;
}

.breadcrumb > ol > li > a:hover, .breadcrumb > ol > li > a:focus, .breadcrumb > ol > li > a:active {
  text-decoration: none;
}

.breadcrumb > ol > li > em {
  color: #666;
  font-weight: normal;
}

.breadcrumb.reprise {
  border-top: 1px solid #d6d6d6;
  background-color: #fff;
}

@media only screen and (max-width: 768px) {
  .breadcrumb {
    display: none;
    line-height: 1.8;
    padding: 0 16px;
  }
  .breadcrumb > ol > li > a,
  .breadcrumb > ol > li > em {
    font-size: 1rem;
  }
  .breadcrumb > ol > li > a {
    margin-right: 20px;
  }
  .breadcrumb > ol > li > a::before, .breadcrumb > ol > li > a::after {
    right: -13px;
    width: 5px;
    height: 1px;
    margin-top: -1px;
  }
  .breadcrumb.reprise {
    display: block;
  }
  .static .breadcrumb {
    display: block;
  }
}

/* ===========================
footer
--------------------------- */
#footer {
  padding: 0 30px;
  background-color: #e6e6e6;
}

@media only screen and (max-width: 768px) {
  #footer {
    padding: 0 16px;
  }
}

.footer-pagetop {
  position: fixed;
  right: 28px;
  bottom: -50px;
  z-index: 9996;
  margin: 0;
  -webkit-transition: bottom .4s;
  transition: bottom .4s;
  will-change: bottom;
}

.footer-pagetop > a {
  position: relative;
  display: block;
  width: 48px;
  height: 48px;
  overflow: hidden;
  border-radius: 50%;
  background-color: #666;
  background-color: rgba(0, 0, 0, .7);
  -webkit-transition: background-color .2s;
  transition: background-color .2s;
  will-change: background-color;
}

.footer-pagetop > a:hover, .footer-pagetop > a:focus, .footer-pagetop > a:active {
  background-color: rgba(64, 64, 64, .7);
}

.footer-pagetop > a::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 14px;
  height: 14px;
  margin: -4.5px 0 0 -7px;
  border-top: 3px solid #fff;
  border-left: 3px solid #fff;
}

.footer-pagetop.rise {
  bottom: 28px;
}

.static .footer-pagetop {
  bottom: 28px;
}

@media only screen and (max-width: 768px) {
  .footer-pagetop {
    position: static;
    margin-left: -16px;
    margin-right: -16px;
  }
  .footer-pagetop > a {
    width: auto;
    height: auto;
    border-radius: 0;
    padding: 2.9em 10px .7em 10px;
    background-color: #f2f2f2;
    color: #666;
    font-size: 1rem;
    text-align: center;
    text-decoration: none;
  }
  .footer-pagetop > a:hover, .footer-pagetop > a:focus, .footer-pagetop > a:active {
    background-color: #fff;
  }
  .footer-pagetop > a::before {
    top: 1.5em;
    width: 12px;
    height: 12px;
    margin: 0 0 0 -6px;
    border-color: #777;
  }
  .footer-pagetop > a > span {
    position: static;
  }
}

.footer-link-01 {
  line-height: 1.6;
  margin: 0 -15px;
  padding: 2.5em 0 .25em 0;
}

.footer-link-01 a {
  position: relative;
  display: inline-block;
  padding-left: 20px;
  color: #333;
}

.footer-link-01 a::before {
  content: "";
  position: absolute;
  top: 50%;
  display: block;
}

.footer-link-01 > li {
  width: 25%;
  margin-bottom: 2.25em;
  padding: 0 15px;
}

.footer-link-01 > li > a {
  font-weight: bold;
}

.footer-link-01 > li > a::before {
  left: 3.5px;
  width: 7px;
  height: 7px;
  border-top: 2px solid #474747;
  border-right: 2px solid #474747;
  margin-top: -4px;
}

.footer-link-01 > li > ul {
  margin: .9em 0 0 0;
  font-size: 1.4rem;
}

.footer-link-01 > li > ul > li {
  margin-top: .6em;
}

.footer-link-01 > li > ul > li > a::before {
  left: 4.5px;
  width: 5px;
  height: 5px;
  border-top: 1px solid #777;
  border-right: 1px solid #777;
  margin-top: -3px;
}

.footer-link-01 .link-icon {
  top: .125em;
}

@media only screen and (max-width: 980px) {
  .footer-link-01 > li {
    width: calc(100% / 3);
  }
  .ie .footer-link-01 > li,
  .edge .footer-link-01 > li {
    width: 33.33333%;
  }
}

@media only screen and (max-width: 768px) {
  .footer-link-01 {
    margin: 0 -17px 0 -16px;
    border-bottom: 1px solid #bdbdbd;
    padding: 0;
  }
  .footer-link-01 > li {
    width: 50%;
    margin-bottom: -1px;
    border: 1px solid #bdbdbd;
    border-left: none;
    padding: 0;
  }
  .footer-link-01 > li > a {
    display: block;
    padding: .5em 5px .5em 30px;
  }
  .footer-link-01 > li > a::before {
    left: 12px;
  }
  .footer-link-01 > li > ul {
    display: none;
  }
  .ie .footer-link-01 > li,
  .edge .footer-link-01 > li {
    width: 50%;
  }
}

.footer-link-02 {
  line-height: 1.6;
  margin-bottom: 0;
  padding: .75em 0 .5em 0;
  font-size: 1.4rem;
  text-align: center;
}

.footer-link-02 > li {
  position: relative;
  display: inline-block;
  margin: .5em 0;
  padding-right: 36px;
}

.footer-link-02 > li::after {
  content: "";
  position: absolute;
  top: .25em;
  right: 15px;
  bottom: .25em;
  display: block;
  width: 1px;
  background-color: #bdbdbd;
}

.footer-link-02 > li:last-child {
  padding-right: 0;
}

.footer-link-02 > li:last-child::after {
  content: none;
}

.footer-link-02 > li > a {
  display: block;
  color: #666;
  text-decoration: underline;
}

.footer-link-02 > li > a:hover, .footer-link-02 > li > a:focus, .footer-link-02 > li > a:active {
  text-decoration: none;
}

.footer-link-02 .link-icon {
  top: .125em;
}

.footer-link-01 + .footer-link-02 {
  border-top: 1px solid #bdbdbd;
}

@media only screen and (max-width: 768px) {
  .footer-link-02 {
    margin-left: -16px;
    margin-right: -16px;
    padding: 1.25em 16px 1em 16px;
    font-size: 1.2rem;
  }
  .footer-link-02 > li {
    margin: .325em 0;
    padding-right: 16px;
  }
  .footer-link-02 > li::after {
    top: .2em;
    right: 6px;
    bottom: .2em;
  }
  .footer-link-01 + .footer-link-02 {
    border-top: none;
  }
}

.footer-copyright {
  line-height: 1.6;
  margin: 0;
  padding: 0 16px 1em 16px;
  color: #666;
  font-size: 1.4rem;
  text-align: center;
}

@media only screen and (max-width: 768px) {
  .footer-copyright {
    font-size: 1.2rem;
  }
}

/* ===========================
content
--------------------------- */
#main {
  display: block;
}

#main .area-content {
  padding: 0 30px;
}

#main .area-content > .area-content-inner {
  padding: 3.5em 0 2.5em 0;
}

@media only screen and (max-width: 768px) {
  #main {
    line-height: 1.6;
  }
  #main .area-content {
    padding: 0 16px;
  }
  #main .area-content > .area-content-inner {
    padding: 2.8125em 0 2em 0;
  }
}

#nav-local {
  padding: 32px 30px 24px 30px;
  background-color: #292929;
}

@media only screen and (max-width: 768px) {
  #nav-local {
    padding: 32px 16px 24px 16px;
  }
}

.nav-local-01 {
  padding-left: 32px;
  padding-right: 32px;
  font-size: 1.4rem;
  text-align: center;
}

.nav-local-01 > li {
  display: inline-block;
  margin: 0 2.0625px .57143em 2.0625px;
}

.nav-local-01 > li > a {
  line-height: 1.45;
  display: block;
  border: 1px solid #525252;
  padding: .28572em 10px;
  background-color: rgba(82, 82, 82, 0);
  color: #fff;
  -webkit-transition: background-color .2s;
  transition: background-color .2s;
  will-change: background-color;
}

.nav-local-01 > li > a.active, .nav-local-01 > li > a:hover, .nav-local-01 > li > a:focus, .nav-local-01 > li > a:active {
  background-color: #525252;
  text-decoration: none;
}

.nav-local-01 > li > a.current {
  border-color: #e9b226;
  background-color: #e9b226;
  color: #333;
}

.nav-local-01 > li > a.current:hover, .nav-local-01 > li > a.current:focus, .nav-local-01 > li > a.current:active {
  background-color: #e9b226;
}

.nav-local-01.lower-01 {
  padding-top: 32px;
  padding-bottom: 24px;
  background-color: #474747;
}

.nav-local-01.lower-01 > li > a {
  border-color: #666;
  background-color: rgba(102, 102, 102, 0);
}

.nav-local-01.lower-01 > li > a.active, .nav-local-01.lower-01 > li > a:hover, .nav-local-01.lower-01 > li > a:focus, .nav-local-01.lower-01 > li > a:active {
  background-color: #666;
}

.nav-local-01.lower-01 > li > a.current {
  border-color: #e9b226;
  background-color: #e9b226;
}

.nav-local-01.lower-01 > li > a.current:hover, .nav-local-01.lower-01 > li > a.current:focus, .nav-local-01.lower-01 > li > a.current:active {
  background-color: #e9b226;
}

.nav-local-01.lower-01 + .nav-local-01 {
  padding-top: 32px;
}

@media only screen and (max-width: 768px) {
  .nav-local-01 {
    padding-left: 0;
    padding-right: 0;
  }
  .nav-local-01.lower-01 {
    padding-left: 20px;
    padding-right: 20px;
  }
}

/* =====================================
module
------------------------------------- */
p,
ul,
ol,
dl,
table {
  margin-bottom: 1.4375em;
}

/* ===========================
adjust
--------------------------- */
.mt-0 {
  margin-top: 0 !important;
}

.mt-1 {
  margin-top: .5em !important;
}

.mt-2 {
  margin-top: 1em !important;
}

.mt-3 {
  margin-top: 1.5em !important;
}

.mt-4 {
  margin-top: 2em !important;
}

.mt-5 {
  margin-top: 2.5em !important;
}

.mt-6 {
  margin-top: 3em !important;
}

.mt-7 {
  margin-top: 3.5em !important;
}

.mt-8 {
  margin-top: 4em !important;
}

.mt-9 {
  margin-top: 4.5em !important;
}

.mr-0 {
  margin-right: 0 !important;
}

.mr-1 {
  margin-right: 10px !important;
}

.mr-2 {
  margin-right: 20px !important;
}

.mr-3 {
  margin-right: 30px !important;
}

.mr-4 {
  margin-right: 40px !important;
}

.mr-5 {
  margin-right: 50px !important;
}

.mr-6 {
  margin-right: 60px !important;
}

.mr-7 {
  margin-right: 70px !important;
}

.mr-8 {
  margin-right: 80px !important;
}

.mr-9 {
  margin-right: 90px !important;
}

.mb-0 {
  margin-bottom: 0 !important;
}

.mb-1 {
  margin-bottom: .5em !important;
}

.mb-2 {
  margin-bottom: 1em !important;
}

.mb-3 {
  margin-bottom: 1.5em !important;
}

.mb-4 {
  margin-bottom: 2em !important;
}

.mb-5 {
  margin-bottom: 2.5em !important;
}

.mb-6 {
  margin-bottom: 3em !important;
}

.mb-7 {
  margin-bottom: 3.5em !important;
}

.mb-8 {
  margin-bottom: 4em !important;
}

.mb-9 {
  margin-bottom: 4.5em !important;
}

.ml-0 {
  margin-left: 0 !important;
}

.ml-1 {
  margin-left: 10px !important;
}

.ml-2 {
  margin-left: 20px !important;
}

.ml-3 {
  margin-left: 30px !important;
}

.ml-4 {
  margin-left: 40px !important;
}

.ml-5 {
  margin-left: 50px !important;
}

.ml-6 {
  margin-left: 60px !important;
}

.ml-7 {
  margin-left: 70px !important;
}

.ml-8 {
  margin-left: 80px !important;
}

.ml-9 {
  margin-left: 90px !important;
}

.ta-l {
  text-align: left !important;
}

.ta-c {
  text-align: center !important;
}

.ta-r {
  text-align: right !important;
}

.va-t, .va-t td, .va-t th {
  vertical-align: top !important;
}

.va-m, .va-m td, .va-m th {
  vertical-align: middle !important;
}

.va-b, .va-b td, .va-b th {
  vertical-align: bottom !important;
}

.fs-s {
  font-size: 87.5% !important;
}

.fs-m {
  font-size: 100% !important;
}

.fs-l {
  font-size: 112.5% !important;
}

.serif {
  font-family: "Roboto Slab", Garamond, "Times New Roman", "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}

/* ===========================
layout
--------------------------- */
.lyt-col-01 {
  margin: 0 -15px;
}

.lyt-col-01 > .col {
  padding: 0 15px;
}

.lyt-col-01 > .col > .hdg-section-01:first-child {
  margin-top: 1.35714em;
}

.lyt-col-01 > .col > .hdg-section-02:first-child {
  margin-top: 1.08333em;
}

.lyt-col-01 > .col > .hdg-section-03:first-child {
  margin-top: 1.09091em;
}

.lyt-col-01 > .col > .hdg-section-04:first-child {
  margin-top: 1.3em;
}

.lyt-col-01 > .col > .hdg-section-05:first-child {
  margin-top: 1.44444em;
}

.lyt-col-01.col2 > .col {
  width: 50%;
}

.lyt-col-01.col3 > .col {
  width: calc(100% / 3);
}

.lyt-col-01.col4 > .col {
  width: 25%;
}

.lyt-col-01.col-equalize > .col > * {
  width: 100%;
}

.ie .lyt-col-01.col3 > .col,
.edge .lyt-col-01.col3 > .col {
  width: 33.33333%;
}

@media only screen and (max-width: 860px) {
  .lyt-col-01:not(.no-linear).col4 > .col {
    width: calc(100% / 3);
  }
  .ie .lyt-col-01:not(.no-linear).col4 > .col,
  .edge .lyt-col-01:not(.no-linear).col4 > .col {
    width: 33.33333%;
  }
}

@media only screen and (max-width: 768px) {
  .lyt-col-01 {
    margin: 0 -8px;
  }
  .lyt-col-01 > .col {
    padding: 0 8px;
  }
  .lyt-col-01 > .col > .hdg-section-01:first-child {
    margin-top: 1.72727em;
  }
  .lyt-col-01 > .col > .hdg-section-02:first-child {
    margin-top: 1.18182em;
  }
  .lyt-col-01 > .col > .hdg-section-03:first-child {
    margin-top: 1.1em;
  }
  .lyt-col-01 > .col > .hdg-section-04:first-child,
  .lyt-col-01 > .col > .hdg-section-05:first-child {
    margin-top: 1.44444em;
  }
  .lyt-col-01:not(.no-linear).col3 > .col, .lyt-col-01:not(.no-linear).col4 > .col {
    width: 50%;
  }
  .ie .lyt-col-01:not(.no-linear).col3 > .col, .ie .lyt-col-01:not(.no-linear).col4 > .col,
  .edge .lyt-col-01:not(.no-linear).col3 > .col,
  .edge .lyt-col-01:not(.no-linear).col4 > .col {
    width: 50%;
  }
}

@media only screen and (max-width: 640px) {
  .lyt-col-01:not(.no-linear) {
    display: block;
  }
  .lyt-col-01:not(.no-linear).col2 > .col, .lyt-col-01:not(.no-linear).col3 > .col, .lyt-col-01:not(.no-linear).col4 > .col {
    width: 100%;
  }
  .lyt-col-01:not(.no-linear).col2 > .col > .hdg-section-01:first-child, .lyt-col-01:not(.no-linear).col3 > .col > .hdg-section-01:first-child, .lyt-col-01:not(.no-linear).col4 > .col > .hdg-section-01:first-child {
    margin-top: 2.72727em;
  }
  .lyt-col-01:not(.no-linear).col2 > .col > .hdg-section-02:first-child, .lyt-col-01:not(.no-linear).col3 > .col > .hdg-section-02:first-child, .lyt-col-01:not(.no-linear).col4 > .col > .hdg-section-02:first-child {
    margin-top: 2.18182em;
  }
  .lyt-col-01:not(.no-linear).col2 > .col > .hdg-section-03:first-child, .lyt-col-01:not(.no-linear).col3 > .col > .hdg-section-03:first-child, .lyt-col-01:not(.no-linear).col4 > .col > .hdg-section-03:first-child {
    margin-top: 2.2em;
  }
  .lyt-col-01:not(.no-linear).col2 > .col > .hdg-section-04:first-child,
  .lyt-col-01:not(.no-linear).col2 > .col > .hdg-section-05:first-child, .lyt-col-01:not(.no-linear).col3 > .col > .hdg-section-04:first-child,
  .lyt-col-01:not(.no-linear).col3 > .col > .hdg-section-05:first-child, .lyt-col-01:not(.no-linear).col4 > .col > .hdg-section-04:first-child,
  .lyt-col-01:not(.no-linear).col4 > .col > .hdg-section-05:first-child {
    margin-top: 2.66667em;
  }
  .lyt-col-01:not(.no-linear).col2 > .col:first-child > .hdg-section-01:first-child,
  .lyt-col-01:not(.no-linear).col2 > .col:first-child > .hdg-section-02:first-child,
  .lyt-col-01:not(.no-linear).col2 > .col:first-child > .hdg-section-03:first-child,
  .lyt-col-01:not(.no-linear).col2 > .col:first-child > .hdg-section-04:first-child,
  .lyt-col-01:not(.no-linear).col2 > .col:first-child > .hdg-section-05:first-child, .lyt-col-01:not(.no-linear).col3 > .col:first-child > .hdg-section-01:first-child,
  .lyt-col-01:not(.no-linear).col3 > .col:first-child > .hdg-section-02:first-child,
  .lyt-col-01:not(.no-linear).col3 > .col:first-child > .hdg-section-03:first-child,
  .lyt-col-01:not(.no-linear).col3 > .col:first-child > .hdg-section-04:first-child,
  .lyt-col-01:not(.no-linear).col3 > .col:first-child > .hdg-section-05:first-child, .lyt-col-01:not(.no-linear).col4 > .col:first-child > .hdg-section-01:first-child,
  .lyt-col-01:not(.no-linear).col4 > .col:first-child > .hdg-section-02:first-child,
  .lyt-col-01:not(.no-linear).col4 > .col:first-child > .hdg-section-03:first-child,
  .lyt-col-01:not(.no-linear).col4 > .col:first-child > .hdg-section-04:first-child,
  .lyt-col-01:not(.no-linear).col4 > .col:first-child > .hdg-section-05:first-child {
    margin-top: 0;
  }
  .ie .lyt-col-01:not(.no-linear).col2 > .col, .ie .lyt-col-01:not(.no-linear).col3 > .col, .ie .lyt-col-01:not(.no-linear).col4 > .col,
  .edge .lyt-col-01:not(.no-linear).col2 > .col,
  .edge .lyt-col-01:not(.no-linear).col3 > .col,
  .edge .lyt-col-01:not(.no-linear).col4 > .col {
    width: 100%;
  }
}

.lyt-col-02 {
  margin: 0 -15px;
}

.lyt-col-02 > .col {
  padding: 0 15px;
}

.lyt-col-02 > .col.col1 {
  width: calc((100% / 3) * 2);
}

.lyt-col-02 > .col.col2 {
  width: calc(100% / 3);
}

.ie .lyt-col-02 > .col.col1,
.edge .lyt-col-02 > .col.col1 {
  width: 66.66666%;
}

.ie .lyt-col-02 > .col.col2,
.edge .lyt-col-02 > .col.col2 {
  width: 33.33333%;
}

@media only screen and (max-width: 768px) {
  .lyt-col-02 {
    display: block;
    margin: 0;
  }
  .lyt-col-02 > .col {
    padding: 0;
  }
  .lyt-col-02 > .col.col1, .lyt-col-02 > .col.col2 {
    width: auto;
  }
  .ie .lyt-col-02 > .col.col1, .ie .lyt-col-02 > .col.col2,
  .edge .lyt-col-02 > .col.col1,
  .edge .lyt-col-02 > .col.col2 {
    width: auto;
  }
}

.lyt-img-01 {
  text-align: center;
}

.lyt-img-01 .caption {
  display: inline-block;
  line-height: 1.8;
  margin-top: .71429em;
  color: #666;
  font-size: 1.4rem;
}

@media only screen and (max-width: 768px) {
  .lyt-img-01 .caption {
    line-height: 1.6;
    margin-top: .57143em;
  }
}

.lyt-img-02 > .lyt-img-01 {
  max-width: 48.64865%;
  max-width: calc(50% - 15px);
  margin-bottom: .4375em;
  padding-top: .4375em;
}

.lyt-img-02.img-l > .lyt-img-01 {
  float: left;
  margin-right: 30px;
}

.lyt-img-02.img-r > .lyt-img-01 {
  float: right;
  margin-left: 30px;
}

.lyt-img-02.parallel > .content {
  overflow: hidden;
}

@media only screen and (max-width: 768px) {
  .lyt-img-02 > .lyt-img-01 {
    width: auto !important;
    max-width: inherit;
    margin-bottom: 1.5em;
    padding-top: 0;
  }
  .lyt-img-02.img-l > .lyt-img-01, .lyt-img-02.img-r > .lyt-img-01 {
    float: none;
    margin-right: 0;
    margin-left: 0;
  }
  .lyt-img-02.parallel > .content {
    overflow: inherit;
  }
  .lyt-img-02.reverse {
    display: table;
    table-layout: fixed;
    width: 100%;
    margin-bottom: 1.5em;
  }
  .lyt-img-02.reverse > .lyt-img-01 {
    display: table-row;
  }
  .lyt-img-02.reverse > .content {
    display: table-caption;
  }
}

.lyt-img-03 {
  margin: 0 -15px;
}

.lyt-img-03 > .lyt-img-01 {
  margin-left: 15px;
  margin-right: 15px;
  display: table;
}

@media only screen and (max-width: 768px) {
  .lyt-img-03 {
    display: block;
    margin: 0;
  }
  .lyt-img-03 > .lyt-img-01 {
    margin-left: 0;
    margin-right: 0;
    display: block;
  }
}

.lyt-calendar-01 > .holiday {
  margin-bottom: .75em;
  text-align: right;
}

.lyt-calendar-01 > .holiday span {
  position: relative;
  display: inline-block;
  line-height: 2;
  padding-left: 44px;
}

.lyt-calendar-01 > .holiday span::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 2em;
  height: 2em;
  border-radius: 50%;
  background-color: #fbebef;
}

.lyt-calendar-01 > .calendar > li {
  width: 48.64865%;
  width: calc(50% - 15px);
  border: 1px solid #d6d6d6;
  margin-bottom: 2em;
  padding: 1.25em 10px;
}

.lyt-calendar-01 > .calendar > li table {
  width: 100%;
  line-height: 2;
  margin-bottom: 0;
  text-align: center;
  vertical-align: top;
}

.lyt-calendar-01 > .calendar > li table caption {
  padding-bottom: .25em;
  font-size: 2rem;
  font-weight: bold;
}

.lyt-calendar-01 > .calendar > li table th,
.lyt-calendar-01 > .calendar > li table td {
  padding: 4px 2px;
  color: #333;
  font-weight: bold;
}

.lyt-calendar-01 > .calendar > li table th:first-child,
.lyt-calendar-01 > .calendar > li table td:first-child {
  color: #cc0030;
}

.lyt-calendar-01 > .calendar > li table th:last-child,
.lyt-calendar-01 > .calendar > li table td:last-child {
  color: #20256b;
}

.lyt-calendar-01 > .calendar > li table th span,
.lyt-calendar-01 > .calendar > li table td span {
  display: inline-block;
  width: 2em;
  height: 2em;
}

.lyt-calendar-01 > .calendar > li table th span.holiday,
.lyt-calendar-01 > .calendar > li table td span.holiday {
  border-radius: 50%;
  color: #cc0030;
  background-color: #fbebef;
}

@media only screen and (max-width: 768px) {
  .lyt-calendar-01 > .calendar > li {
    width: 48.91304%;
    width: calc(50% - 8px);
    margin-bottom: 1em;
    padding: 1em 10px;
  }
  .lyt-calendar-01 > .calendar > li table {
    line-height: 2.14286;
  }
  .lyt-calendar-01 > .calendar > li table caption {
    padding-bottom: .125em;
  }
  .lyt-calendar-01 > .calendar > li table th,
  .lyt-calendar-01 > .calendar > li table td {
    font-size: 1.4rem;
  }
  .lyt-calendar-01 > .calendar > li table th span,
  .lyt-calendar-01 > .calendar > li table td span {
    width: 2.14286em;
    height: 2.14286em;
  }
}

@media only screen and (max-width: 600px) {
  .lyt-calendar-01 > .calendar {
    display: block;
  }
  .lyt-calendar-01 > .calendar > li {
    width: 100%;
  }
}

.lyt-map-01 {
  position: relative;
  width: 100%;
  height: 0;
  margin-bottom: 1.5em;
  padding-top: 56.21622%;
}

.lyt-map-01 img {
  max-width: inherit;
}

.lyt-map-01 > .content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.lyt-map-01 > .content * {
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}

.ie .lyt-map-01 {
  height: 600px;
  padding-top: 0;
}

.ie .lyt-map-01 > .content {
  height: 600px;
}

.static .lyt-map-01 {
  position: static;
  height: auto;
  padding-top: 0;
}

.static .lyt-map-01 > .content {
  display: none;
}

@media only screen and (max-width: 980px) {
  .ie .lyt-map-01 {
    height: 500px;
  }
  .ie .lyt-map-01 > .content {
    height: 500px;
  }
}

@media only screen and (max-width: 768px) {
  .ie .lyt-map-01 {
    height: 400px;
  }
  .ie .lyt-map-01 > .content {
    height: 400px;
  }
}

@media only screen and (max-width: 600px) {
  .ie .lyt-map-01 {
    height: 300px;
  }
  .ie .lyt-map-01 > .content {
    height: 300px;
  }
}

@media only screen and (max-width: 480px) {
  .ie .lyt-map-01 {
    height: 200px;
  }
  .ie .lyt-map-01 > .content {
    height: 200px;
  }
}

.lyt-partation-01 {
  display: block;
  margin: 2em 0;
  border-top: 1px solid #d6d6d6;
}

.lyt-medicaltown-01 {
  margin: -.75em 0 -4.75em 0;
  background: #fff url(/support/medical/images/index-01.jpg) no-repeat 50% 0;
  background-size: contain;
}

.lyt-medicaltown-01 > .hdg {
  line-height: 1.8;
  padding-top: 2.1em;
  padding-bottom: 1.55em;
  color: #000;
  font-size: 2.8rem;
  font-weight: bold;
}

.lyt-medicaltown-01 > .hdg > small {
  display: block;
  font-size: 1.6rem;
  font-weight: normal;
}

.lyt-medicaltown-01 > .content-outer {
  max-width: 1280px;
  margin: 0 auto;
  background-color: #fff;
  background-color: rgba(255, 255, 255, .9);
}

.lyt-medicaltown-01 > .content-outer > .content-inner {
  padding-top: 2.625em;
}

@media only screen and (max-width: 1280px) {
  .lyt-medicaltown-01 > .content-outer {
    background-color: #fff;
  }
  .lyt-medicaltown-01 > .content-outer > .content-inner {
    padding-top: 1.5em;
  }
}

@media only screen and (max-width: 768px) {
  .lyt-medicaltown-01 {
    margin-bottom: -4.25em;
  }
  .lyt-medicaltown-01 > .hdg {
    padding: 1.6em 16px 1.25em 16px;
    background: #fff url(/support/medical/images/index-01.jpg) no-repeat 37.5% 0;
    background-size: cover;
    font-size: 2.2rem;
  }
  .lyt-medicaltown-01 > .hdg > small {
    font-size: 1.4rem;
  }
  .lyt-medicaltown-01 > .content-outer > .content-inner {
    padding-left: 16px;
    padding-right: 16px;
  }
}

.lyt-medicaltown-02 {
  max-width: 1920px;
  margin: 0 auto;
  background: #e1e0dd url(/product/medical/images/index-01.jpg) no-repeat 85% 25%;
  background-size: cover;
}

.lyt-medicaltown-02 > .inner {
  min-height: 380px;
  padding-top: 4.5em;
  padding-bottom: 4.5em;
}

.lyt-medicaltown-02 .hdg {
  line-height: 1.75;
  margin-bottom: 1em;
  font-size: 2.8rem;
  font-weight: bold;
  text-shadow: 0 0 .8rem #e1e0dd, 0 0 .6rem #e1e0dd, 0 0 .4rem #e1e0dd, 0 0 .2rem #e1e0dd, 0 0 .1rem #e1e0dd, 0 0 .1rem #e1e0dd;
}

.lyt-medicaltown-02 .hdg small {
  display: block;
  font-size: 1.6rem;
  font-weight: normal;
}

.lyt-medicaltown-02 .nav-btn-01 {
  -webkit-justify-content: flex-start;
  justify-content: flex-start;
  margin-bottom: 0;
}

.lyt-medicaltown-02 .nav-btn-01 > a {
  width: auto;
  padding-left: 15px;
}

@media only screen and (max-width: 768px) {
  .lyt-medicaltown-02 {
    margin-bottom: -1em;
    background: none;
  }
  .lyt-medicaltown-02 > .inner {
    min-height: inherit;
    padding: 0 16px;
  }
  .lyt-medicaltown-02 .hdg {
    margin: 0 -16px 1em -16px;
    padding: 1.5em 16px;
    background: #e1e0dd url(/product/medical/images/index-01.jpg) no-repeat 100% 25%;
    background-size: cover;
    font-size: 2.2rem;
  }
  .lyt-medicaltown-02 .hdg small {
    font-size: 1.4rem;
  }
  .lyt-medicaltown-02 .nav-btn-01 > a {
    width: 100%;
    margin: 8px 0 0 0;
  }
}

@media only screen and (max-width: 480px) {
  .lyt-medicaltown-02 .hdg {
    background-position: 35% 25%;
  }
}

.lyt-product-01 {
  max-width: 1920px;
  margin: 0 auto;
  background: #e7e7e7 linear-gradient(to bottom, #dbdbdb 0, #f2f2f2 100%) no-repeat 50% 50%;
  background-size: cover;
}

.lyt-product-01 > .inner {
  min-height: 380px;
  padding-top: 4.5em;
  padding-bottom: 4.5em;
  background-repeat: no-repeat;
  background-position: 95% 50%;
  background-size: contain;
}

.lyt-product-01 .hdg {
  line-height: 1.75;
  margin-bottom: 1em;
  font-size: 2.8rem;
  font-weight: bold;
  text-shadow: 0 0 .8rem #e7e7e7, 0 0 .6rem #e7e7e7, 0 0 .4rem #e7e7e7, 0 0 .2rem #e7e7e7, 0 0 .1rem #e7e7e7, 0 0 .1rem #e7e7e7;
}

.lyt-product-01 .nav-btn-01 {
  -webkit-justify-content: flex-start;
  justify-content: flex-start;
  margin-bottom: 0;
}

.lyt-product-01 .nav-btn-01 > a {
  width: auto;
  padding-left: 15px;
}

.lyt-product-01.imaging > .inner {
  background-image: url(/product/imaging/images/index-01.png);
}

.lyt-product-01.industry > .inner {
  background-image: url(/product/industry/images/index-01.png);
}

.lyt-product-01.lifescience > .inner {
  background-image: url(/product/lifescience/images/index-01.png);
}

@media only screen and (max-width: 768px) {
  .lyt-product-01 {
    margin-bottom: -1em;
    background: none;
  }
  .lyt-product-01 > .inner {
    min-height: inherit;
    padding: 0 16px;
    background: none;
  }
  .lyt-product-01 .hdg {
    margin: 0 -16px 1em -16px;
    padding: 2em 48px 2em 16px;
    background-color: #e7e7e7;
    background-repeat: no-repeat, no-repeat;
    background-position: 95% 50%, 50% 50%;
    background-size: contain, cover;
    font-size: 2.2rem;
  }
  .lyt-product-01 .hdg br {
    display: none;
  }
  .lyt-product-01 .nav-btn-01 > a {
    width: 100%;
    margin: 8px 0 0 0;
  }
  .lyt-product-01.imaging > .inner {
    background-image: none;
  }
  .lyt-product-01.imaging .hdg {
    background-image: url(/product/imaging/images/index-01.png), linear-gradient(to bottom, #dbdbdb 0, #f2f2f2 100%);
  }
  .lyt-product-01.industry > .inner {
    background-image: none;
  }
  .lyt-product-01.industry .hdg {
    background-image: url(/product/industry/images/index-01.png), linear-gradient(to bottom, #dbdbdb 0, #f2f2f2 100%);
  }
  .lyt-product-01.lifescience > .inner {
    background-image: none;
  }
  .lyt-product-01.lifescience .hdg {
    background-image: url(/product/lifescience/images/index-01.png), linear-gradient(to bottom, #dbdbdb 0, #f2f2f2 100%);
  }
}

@media only screen and (max-width: 480px) {
  .lyt-product-01 .hdg {
    background-position: 110% 50%, 50% 50%;
  }
}

.lyt-notice-01 {
  padding-top: 1.4375em;
  padding-bottom: .01em;
  text-align: center;
}

@media only screen and (max-width: 768px) {
  .lyt-notice-01 {
    padding-left: 16px;
    padding-right: 16px;
  }
}

.lyt-csr-01 {
  margin-bottom: 3.5em;
}

.lyt-csr-01 > .message {
  margin: 0 15px 0 0;
}

.lyt-csr-01 > .message a {
  position: relative;
  width: 100%;
  overflow: hidden;
  padding: 1em;
  color: #000;
  text-decoration: none;
  text-shadow: 0 0 1rem #fff, 0 0 .8rem #fff, 0 0 .6rem #fff, 0 0 .4rem #fff, 0 0 .2rem #fff;
}

.lyt-csr-01 > .message a::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  display: block;
  background-image: url(/csr/images/index-01.jpg);
  background-position: 10% 22.5%;
  background-repeat: no-repeat;
  background-size: cover;
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transform-origin: 0 50%;
  transform-origin: 0 50%;
  -webkit-transition: transform .2s;
  transition: transform .2s;
  will-change: transform;
}

.lyt-csr-01 > .message a span {
  position: relative;
  z-index: 2;
  display: inline-block;
  margin-left: 40%;
  padding-right: 18px;
}

.lyt-csr-01 > .message a span b {
  font-size: 2rem;
  font-weight: bold;
}

.lyt-csr-01 > .message a span::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  display: block;
  width: 12px;
  height: 12px;
  margin-top: -6px;
  border-top: 3px solid #20256b;
  border-right: 3px solid #20256b;
  -webkit-transition: right .2s;
  transition: right .2s;
  will-change: right;
}

.lyt-csr-01 > .message a:hover::before, .lyt-csr-01 > .message a:focus::before, .lyt-csr-01 > .message a:active::before {
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
}

.lyt-csr-01 > .message a:hover span::after, .lyt-csr-01 > .message a:focus span::after, .lyt-csr-01 > .message a:active span::after {
  right: -4px;
}

.lyt-csr-01 > .activity {
  margin: 0 0 0 15px;
  padding: 3.5em 0;
  background-image: url(/csr/images/index-02.jpg);
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: cover;
}

.lyt-csr-01 > .activity > dt,
.lyt-csr-01 > .activity > dd {
  padding: 0 56px;
}

.lyt-csr-01 > .activity > dt {
  margin-bottom: 1em;
  font-size: 2rem;
  font-weight: bold;
  text-align: center;
  text-shadow: 0 0 1rem #fff, 0 0 .8rem #fff, 0 0 .6rem #fff, 0 0 .4rem #fff, 0 0 .2rem #fff;
}

.lyt-csr-01 > .activity > dd {
  padding-bottom: 3.75em;
}

.lyt-csr-01 > .activity > dd ul {
  margin-bottom: 0;
}

.lyt-csr-01 > .activity > dd ul > li {
  margin-left: 1px;
}

.lyt-csr-01 > .activity > dd ul > li:first-child {
  margin-left: 0;
}

.lyt-csr-01 > .activity a {
  height: 15vw;
  max-height: 72px;
  background-color: rgba(255, 255, 255, .9);
  color: #333;
  font-weight: bold;
  text-decoration: none;
  -webkit-transition: background-color .2s;
  transition: background-color .2s;
  will-change: background-color;
}

.lyt-csr-01 > .activity a > span {
  position: relative;
  display: inline-block;
  padding-right: 16px;
}

.lyt-csr-01 > .activity a > span::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  display: block;
  width: 12px;
  height: 12px;
  margin-top: -7px;
  border-top: 3px solid #20256b;
  border-right: 3px solid #20256b;
  -webkit-transition: right .2s;
  transition: right .2s;
  will-change: right;
}

.lyt-csr-01 > .activity a:hover, .lyt-csr-01 > .activity a:focus, .lyt-csr-01 > .activity a:active {
  background-color: #fff;
}

.lyt-csr-01 > .activity a:hover > span::after, .lyt-csr-01 > .activity a:focus > span::after, .lyt-csr-01 > .activity a:active > span::after {
  right: -4px;
}

.lyt-csr-01 > p.activity > a {
  margin: 3.75em 56px;
}

@media only screen and (max-width: 980px) {
  .lyt-csr-01 > .message a {
    -webkit-justify-content: center;
    justify-content: center;
    padding: .5em .75em .5em 35%;
  }
  .lyt-csr-01 > .message a::before {
    background-position: 25% 22.5%;
  }
  .lyt-csr-01 > .message a span {
    margin-left: 0;
  }
  .lyt-csr-01 > .activity > dt,
  .lyt-csr-01 > .activity > dd {
    padding: 0 32px;
  }
  .lyt-csr-01 > .activity > dd {
    padding-bottom: 3.75em;
  }
  .lyt-csr-01 > p.activity > a {
    margin: 3.75em 32px;
  }
}

@media only screen and (max-width: 840px) {
  .lyt-csr-01 > .message a {
    font-size: 1.4rem;
  }
}

@media only screen and (max-width: 768px) {
  .lyt-csr-01 {
    display: block;
    margin-bottom: 3em;
  }
  .lyt-csr-01 > .message {
    display: block;
    margin: 0 0 1em 0;
  }
  .lyt-csr-01 > .message a {
    height: 37.5vw;
    padding-left: 27.5%;
  }
  .lyt-csr-01 > .message a::before {
    left: -2em;
  }
  .lyt-csr-01 > .message a span b {
    font-size: 1.8rem;
  }
  .lyt-csr-01 > .activity {
    margin: 0;
    padding: 5vw 0;
  }
  .lyt-csr-01 > .activity > dt,
  .lyt-csr-01 > .activity > dd {
    padding: 0 20px;
  }
  .lyt-csr-01 > .activity > dd {
    padding-bottom: 3.25em;
  }
  .lyt-csr-01 > .activity > a {
    min-height: 72px;
  }
  .lyt-csr-01 > p.activity > a {
    margin: 3.25em 20px;
    padding: 0 1em;
  }
}

.lyt-mainvisual-01 {
  background-color: #f2f2f2;
}

.lyt-mainvisual-01 > .inner {
  max-width: 1440px;
  margin: 0 auto;
}

.lyt-mainvisual-01 > .inner > .area {
  position: relative;
  width: 100%;
  background-image: url(/shared/images/icon-loading-01.svg);
  background-position: 50% 50%;
  background-repeat: no-repeat;
}

.lyt-mainvisual-01 > .inner > .area:nth-child(1) {
  margin-bottom: 8px;
}

.lyt-mainvisual-01 > .inner > .area:nth-child(2) {
  margin-right: 4px;
}

.lyt-mainvisual-01 > .inner > .area:nth-child(3) {
  margin-left: 4px;
}

.lyt-mainvisual-01.col3 > .inner > .area:nth-child(1) {
  margin-right: 4px;
  margin-bottom: 0;
}

.lyt-mainvisual-01.col3 > .inner > .area:nth-child(2) {
  margin-right: 4px;
  margin-left: 4px;
}

.lyt-mainvisual-01 > .inner > .area > .visual {
  position: relative;
  margin-bottom: 0;
}

.lyt-mainvisual-01 > .inner > .area > .visual > li {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 3;
  overflow: hidden;
  opacity: 0;
}

.lyt-mainvisual-01 > .inner > .area > .visual > li:first-child {
  position: relative;
}

.lyt-mainvisual-01 > .inner > .area > .visual > li > a {
  display: block;
  background-color: #fff;
}

.lyt-mainvisual-01 > .inner > .area > .visual > li > a img {
  width: 100%;
  -webkit-transition: opacity .2s;
  transition: opacity .2s;
}

.lyt-mainvisual-01 > .inner > .area > .visual > li > a:hover img, .lyt-mainvisual-01 > .inner > .area > .visual > li > a:focus img, .lyt-mainvisual-01 > .inner > .area > .visual > li > a:active img {
  opacity: .7;
}

.lyt-mainvisual-01 > .inner > .area > .ui {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 1.25em;
  z-index: 5;
  margin: 0;
}

.lyt-mainvisual-01 > .inner > .area > .ui > li {
  margin: 0 4px;
}

.lyt-mainvisual-01 > .inner > .area > .ui > li > button {
  position: relative;
  display: block;
  width: 36px;
  height: 36px;
  margin: 0;
  border: none;
  padding: 0;
  background-color: transparent;
  cursor: pointer;
}

.lyt-mainvisual-01 > .inner > .area > .ui > li > button::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 12px;
  height: 12px;
  margin: -6px 0 0 -6px;
  box-shadow: 0 0 .8rem rgba(0, 0, 0, .3);
  border-radius: 6px;
  background-color: rgba(255, 255, 255, .3);
  -webkit-transition: background-color .2s;
  transition: background-color .2s;
  will-change: background-color;
}

.lyt-mainvisual-01 > .inner > .area > .ui > li > button:hover::before, .lyt-mainvisual-01 > .inner > .area > .ui > li > button:focus::before, .lyt-mainvisual-01 > .inner > .area > .ui > li > button:active::before {
  background-color: white;
}

.lyt-mainvisual-01 > .inner > .area > .ui > li > button[aria-pressed="true"] {
  cursor: default;
}

.lyt-mainvisual-01 > .inner > .area > .ui > li > button[aria-pressed="true"]::before {
  background-color: white;
}

.static .lyt-mainvisual-01 > .inner > .area {
  position: static;
  background: none;
}

.static .lyt-mainvisual-01 > .inner > .area > .visual {
  position: static;
}

.static .lyt-mainvisual-01 > .inner > .area > .visual > li {
  position: static;
  margin-top: 8px;
  opacity: 1;
}

.static .lyt-mainvisual-01 > .inner > .area > .visual > li:first-child {
  margin-top: 0;
}

@media only screen and (max-width: 768px) {
  .lyt-mainvisual-01 > .inner > .area:nth-child(1) {
    margin-bottom: 4px;
  }
  .lyt-mainvisual-01 > .inner > .area:nth-child(2) {
    margin-right: 2px;
  }
  .lyt-mainvisual-01 > .inner > .area:nth-child(3) {
    margin-left: 2px;
  }
  .lyt-mainvisual-01.col3 > .inner > .area:nth-child(1) {
    margin-right: 2px;
  }
  .lyt-mainvisual-01.col3 > .inner > .area:nth-child(2) {
    margin-right: 2px;
	margin-left: 2px;
  }
  .lyt-mainvisual-01.col3 > .inner > .area:nth-child(3) {
    margin-left: 2px;
  }
  .lyt-mainvisual-01 > .inner > .area > .ui {
    bottom: .375em;
  }
  .lyt-mainvisual-01 > .inner > .area > .ui > li {
    margin: 0;
  }
  .lyt-mainvisual-01 > .inner > .area > .ui > li > button {
    width: 32px;
    height: 32px;
  }
  .lyt-mainvisual-01 > .inner > .area > .ui > li > button::before {
    width: 8px;
    height: 8px;
    margin: -4px 0 0 -4px;
    border-radius: 4px;
  }
  .static .lyt-mainvisual-01 > .inner > .area > .visual > li {
    margin-top: 4px;
  }
}

@media only screen and (max-width: 480px) {
  .lyt-mainvisual-01 > .inner > .area:nth-child(1) {
    margin-bottom: 2px;
  }
  .lyt-mainvisual-01 > .inner > .area:nth-child(2) {
    margin-right: 1px;
  }
  .lyt-mainvisual-01 > .inner > .area:nth-child(3) {
    margin-left: 1px;
  }
  .lyt-mainvisual-01.col3 > .inner > .area:nth-child(1) {
    margin-right: 0;
  }
  .lyt-mainvisual-01.col3 > .inner > .area:nth-child(2) {
    margin-right: 0;
	margin-left: 0;
  }
  .lyt-mainvisual-01.col3 > .inner > .area:nth-child(3) {
    margin-left: 0;
  }
  .lyt-mainvisual-01 > .inner > .area > .ui {
    bottom: 0;
  }
  .static .lyt-mainvisual-01 > .inner > .area > .visual > li {
    margin-top: 2px;
  }
  .lyt-mainvisual-01.col3 > .inner {
	display: block;
  }
}

.lyt-top-01 {
  background: #ebe9e6 url(/images/index-01.jpg) no-repeat 100% 25%;
  background-size: cover;
}

.lyt-top-01 > .inner {
  padding-top: .01em;
  padding-bottom: .01em;
}

.lyt-top-01 .area-hdg,
.lyt-top-01 .area-link {
  max-width: 540px;
}

.lyt-top-01 .area-hdg {
  padding: 3.375em 0;
}

.lyt-top-01 .area-hdg > .hdg {
  font-weight: bold;
  text-shadow: 0 0 1.2rem #fff, 0 0 1.2rem #fff;
}

.lyt-top-01 .area-hdg > .hdg::before {
  content: attr(data-alternate-string);
  display: block;
  line-height: 1.25;
  font-family: 'Roboto Condensed', sans-serif;
  font-size: 3.2rem;
  color: #08107b;
}

.lyt-top-01 .area-hdg .nav-btn-01 {
  margin: 0;
}

.lyt-top-01 .area-hdg .nav-btn-01 a {
  width: auto;
  margin: 0;
}

.lyt-top-01 .area-link {
  padding-bottom: 1.625em;
}

.lyt-top-01 .area-link > ul > li {
  margin-top: 1px;
}

.lyt-top-01 .area-link > ul > li:first-child {
  margin-top: 0;
}

.lyt-top-01 .area-link > ul > li > a {
  position: relative;
  display: block;
  line-height: 1.7;
  padding: 1.05em 40px .95em 28px;
  background-color: #fff;
  background-color: rgba(255, 255, 255, .9);
  color: #333;
  font-size: 1.4rem;
  text-decoration: none;
  -webkit-transition: background-color .2s;
  transition: background-color .2s;
  will-change: background-color;
}

.lyt-top-01 .area-link > ul > li > a b {
  font-size: 1.6rem;
  font-weight: bold;
}

.lyt-top-01 .area-link > ul > li > a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 18px;
  display: block;
  width: 12px;
  height: 12px;
  margin-top: -6px;
  border-top: 3px solid #08107b;
  border-right: 3px solid #08107b;
  -webkit-transition: right .2s;
  transition: right .2s;
  will-change: right;
}

.lyt-top-01 .area-link > ul > li > a:hover, .lyt-top-01 .area-link > ul > li > a:focus, .lyt-top-01 .area-link > ul > li > a:active {
  background-color: white;
}

.lyt-top-01 .area-link > ul > li > a:hover::after, .lyt-top-01 .area-link > ul > li > a:focus::after, .lyt-top-01 .area-link > ul > li > a:active::after {
  right: 14px;
}

.lyt-top-01 .area-link > ul > li > a.lock {
  padding-left: 54px;
  background-image: url(/shared/images/icon-lock-01.png);
  background-repeat: no-repeat;
  background-position: 28px 50%;
}

@media only screen and (max-width: 768px) {
  .lyt-top-01 {
    background-image: none;
  }
  .lyt-top-01 > .inner {
    padding: 0;
  }
  .lyt-top-01 .area-hdg,
  .lyt-top-01 .area-link {
    max-width: inherit;
  }
  .lyt-top-01 .area-hdg {
    display: block;
    padding: 0 16px;
  }
  .lyt-top-01 .area-hdg > .hdg {
    position: relative;
    z-index: 1;
    overflow: hidden;
    margin: 0 -16px 2.28571em -16px;
    padding: 4.39286em 16px;
    font-size: 1.4rem;
  }
  .lyt-top-01 .area-hdg > .hdg::before {
    font-size: 2.8rem;
  }
  .lyt-top-01 .area-hdg > .hdg::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: -3em;
    z-index: -1;
    display: block;
    background: #e4edf9 url(/images/index-01.jpg) no-repeat 100% 25%;
    background-size: cover;
  }
  .lyt-top-01 .area-hdg .nav-btn-01 a {
    width: 100%;
  }
  .lyt-top-01 .area-link {
    padding: 2em 16px .5em 16px;
  }
  .lyt-top-01 .area-link > ul > li > a {
    padding-left: 20px;
    padding-right: 36px;
  }
  .lyt-top-01 .area-link > ul > li > a::after {
    right: 16px;
  }
  .lyt-top-01 .area-link > ul > li > a:hover::after, .lyt-top-01 .area-link > ul > li > a:focus::after, .lyt-top-01 .area-link > ul > li > a:active::after {
    right: 12px;
  }
  .lyt-top-01 .area-link > ul > li > a.lock {
    padding-left: 44px;
    background-position: 20px 50%;
  }
}

.lyt-top-02 {
  max-width: 1920px;
  margin: 0 auto;
}

.lyt-top-02 > .panel {
  position: relative;
  padding-top: 33.33333vw;
  padding-top: calc(100vw / 3);
}

.lyt-top-02 > .panel > a {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: block;
  overflow: hidden;
}

.lyt-top-02 > .panel > a::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: block;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  -webkit-transform: scale(1.005);
  transform: scale(1.005);
  -webkit-transition: -webkit-transform .4s;
  transition: transform .4s;
  will-change: transform;
}

.lyt-top-02 > .panel > a > span {
  position: absolute;
  top: 10%;
  right: 20px;
  display: block;
  max-width: 90%;
  max-width: calc(100% - 40px);
  padding-right: 20px;
  color: #08107b;
  font-size: 2.8rem;
  font-weight: bold;
  font-family: 'Roboto Condensed', sans-serif;
  text-shadow: 0 0 1.2rem #fff, 0 0 1.2rem #fff;
  text-align: right;
}

.lyt-top-02 > .panel > a > span::after {
  content: "";
  position: absolute;
  top: 37.5%;
  right: 0;
  display: block;
  width: 12px;
  height: 12px;
  border-top: 3px solid #08107b;
  border-right: 3px solid #08107b;
}

.lyt-top-02 > .panel > a > span .link-icon {
  top: -.1em;
}

.lyt-top-02 > .panel > a[href*="olympus-lifescience"]::before, .lyt-top-02 > .panel > a.lifescience::before {
  background-image: url(/images/index-02.jpg);
}

.lyt-top-02 > .panel > a[href*="olympus-ims"]::before, .lyt-top-02 > .panel > a.industry::before {
  background-image: url(/images/index-03.jpg);
}

.lyt-top-02 > .panel > a[href*="olympus-imaging"]::before, .lyt-top-02 > .panel > a.imaging::before {
  background-image: url(/images/index-04.jpg);
}

.lyt-top-02 > .panel > a:hover::before, .lyt-top-02 > .panel > a:focus::before, .lyt-top-02 > .panel > a:active::before {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

[lang="ja"] .lyt-top-02 > .panel > a > span {
  top: 12.5%;
  color: #333;
  font-size: 1.6rem;
  font-weight: bold;
}

[lang="ja"] .lyt-top-02 > .panel > a > span::before {
  content: attr(data-alternate-string);
  display: block;
  line-height: 1.25;
  font-family: 'Roboto Condensed', sans-serif;
  font-size: 2.8rem;
  color: #08107b;
}

[lang="ja"] .lyt-top-02 > .panel > a > span::after {
  top: 37.5%;
}

[lang="ja"] .lyt-top-02 > .panel > a > span .link-icon {
  top: .08125em;
}

@media only screen and (min-width: 1440px) {
  .lyt-top-02 > .panel {
    padding-top: 480px;
  }
}

@media only screen and (max-width: 768px) {
  .lyt-top-02 {
    display: block;
  }
  .lyt-top-02 > .panel {
    padding-top: 56.25%;
  }
  .lyt-top-02 > .panel > a > span {
    top: 50%;
    margin-top: -17.5px;
    margin-top: calc(-1 * ((1em * 1.25) / 2));
    font-size: 2.8rem;
  }
  [lang="ja"] .lyt-top-02 > .panel > a > span {
    top: 50%;
    margin-top: -28.7px;
    margin-top: calc(-1 * (((1em * 1.6) + (2em * 1.25)) / 2));
    font-size: 1.4rem;
  }
}

.lyt-top-03 {
  padding-top: 3.5em;
  padding-bottom: .01em;
}

.lyt-top-03 .nav-index-05 > li {
  width: 31.53153%;
  width: calc((100% - (15px * 4)) / 3);
}

@media only screen and (max-width: 768px) {
  .lyt-top-03 {
    padding: 2.5em 16px .01em 16px;
  }
  .lyt-top-03 .nav-index-05 > li {
    width: 100%;
  }
}

.lyt-top-04 {
  padding-bottom: 3.5em;
  background-color: #f2f2f2;
}

.lyt-top-04 .area-hdg {
  padding-top: 3.3125em;
  padding-bottom: 3.3125em;
}

.lyt-top-04 .area-hdg > .hdg {
  line-height: 1.25;
  font-size: 3.2rem;
  font-weight: bold;
  font-family: 'Roboto Condensed', sans-serif;
  color: #08107b;
  text-shadow: 0 0 1.2rem #fff, 0 0 1.2rem #fff;
}

.lyt-top-04 .area-hdg > .inner .nav-rssbtn-01,
.lyt-top-04 .area-hdg > .inner .nav-btn-01 {
  float: left;
}

.lyt-top-04 .area-hdg > .inner .nav-rssbtn-01 {
  margin: 1em 30px 0 0;
}

.lyt-top-04 .area-hdg > .inner .nav-btn-01 {
  margin: 0;
}

.lyt-top-04 .area-hdg > .inner .nav-btn-01 a {
  width: auto;
  margin: 0;
}

.lyt-top-04 .area-news {
  max-width: 1280px;
  margin: 0 auto;
  background-color: #fff;
}

.lyt-top-04 .area-news > .inner {
  padding-top: .25em;
  padding-bottom: 1.5em;
}

.lyt-top-04 .area-news > .inner .hdg-categorytop-01 {
  margin-top: 3em;
  margin-bottom: 1.625em;
}

.lyt-top-04 .area-news > .inner .list-news-01 {
  margin-bottom: 2em;
}

[lang="ja"] .lyt-top-04 .area-hdg > .hdg {
  line-height: 2;
  color: #333;
  font-size: 1.6rem;
  font-weight: bold;
  text-shadow: 0 0 1.2rem #fff, 0 0 1.2rem #fff;
}

[lang="ja"] .lyt-top-04 .area-hdg > .hdg::before {
  content: attr(data-alternate-string);
  display: block;
  line-height: 1.25;
  font-family: 'Roboto Condensed', sans-serif;
  font-size: 3.2rem;
  color: #08107b;
}

@media only screen and (max-width: 768px) {
  .lyt-top-04 {
    padding: 0 16px 2.5em 16px;
  }
  .lyt-top-04 .area-hdg {
    position: relative;
    display: block;
    padding: 2em 0px;
  }
  .lyt-top-04 .area-hdg > .hdg {
    font-size: 2.8rem;
  }
  .lyt-top-04 .area-hdg > .inner .nav-rssbtn-01,
  .lyt-top-04 .area-hdg > .inner .nav-btn-01 {
    float: none;
  }
  .lyt-top-04 .area-hdg > .inner .nav-rssbtn-01 {
    position: absolute;
    top: 4em;
    right: 0;
    margin: 0;
  }
  .lyt-top-04 .area-hdg > .inner .nav-btn-01 {
    margin-top: 2em;
  }
  .lyt-top-04 .area-hdg > .inner .nav-btn-01 a {
    width: 100%;
  }
  .lyt-top-04 .area-news > .inner {
    padding: .01em 0 .5em 0;
  }
  .lyt-top-04 .area-news > .inner .hdg-categorytop-01 {
    margin-top: 2.25em;
    padding: 0 20px;
  }
  .lyt-top-04 .area-news > .inner .hdg-categorytop-01 > .hdg {
    font-size: 2.2rem;
  }
  .lyt-top-04 .area-news > .inner .nav-btn-01 {
    padding-left: 20px;
    padding-right: 20px;
  }
  [lang="ja"] .lyt-top-04 .area-hdg > .hdg {
    font-size: 1.4rem;
  }
  [lang="ja"] .lyt-top-04 .area-hdg > .hdg::before {
    font-size: 2.8rem;
  }
}

.lyt-top-05 {
  max-width: 1920px;
  margin: 0 auto;
}

.lyt-top-05 > .panel {
  position: relative;
  padding-top: 33.33333vw;
  padding-top: calc(100vw / 3);
}

.lyt-top-05 > .panel > a {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: block;
  overflow: hidden;
}

.lyt-top-05 > .panel > a::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: block;
  background-image: url(/images/index-01.jpg);
  background-repeat: no-repeat;
  background-position: 100% 50%;
  background-size: cover;
  -webkit-transform: scale(1.005);
  transform: scale(1.005);
  -webkit-transition: -webkit-transform .4s;
  transition: transform .4s;
  will-change: transform;
}

.lyt-top-05 > .panel > a > span {
  position: relative;
  display: block;
  height: 100%;
  padding: 0;
}

.lyt-top-05 > .panel > a > span > span {
  position: absolute;
  top: 50%;
  left: 30px;
  display: block;
  max-width: 90%;
  max-width: calc(100% - 40px);
  margin-top: -28px;
  margin-top: calc(-1 * ((1em * 2) / 2));
  padding-right: 20px;
  color: #08107b;
  font-size: 2.8rem;
  font-weight: bold;
  font-family: 'Roboto Condensed', sans-serif;
  text-shadow: 0 0 1.2rem #fff, 0 0 1.2rem #fff;
  text-align: right;
}

.lyt-top-05 > .panel > a > span > span::after {
  content: "";
  position: absolute;
  top: 37.5%;
  right: 0;
  display: block;
  width: 12px;
  height: 12px;
  border-top: 3px solid #08107b;
  border-right: 3px solid #08107b;
}

.lyt-top-05 > .panel > a > span > span .link-icon {
  top: -.1em;
}

.lyt-top-05 > .panel > a:hover::before, .lyt-top-05 > .panel > a:focus::before, .lyt-top-05 > .panel > a:active::before {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

[lang="ja"] .lyt-top-05 > .panel > a > span > span {
  margin-top: -44px;
  margin-top: calc(-1 * (((1em * 2) + (1.75em * 2)) / 2));
  color: #333;
  font-size: 1.6rem;
  font-weight: bold;
}

[lang="ja"] .lyt-top-05 > .panel > a > span > span::before {
  content: attr(data-alternate-string);
  display: block;
  line-height: 1.25;
  font-family: 'Roboto Condensed', sans-serif;
  font-size: 2.8rem;
  color: #08107b;
}

[lang="ja"] .lyt-top-05 > .panel > a > span > span::after {
  top: 37.5%;
}

[lang="ja"] .lyt-top-05 > .panel > a > span > span .link-icon {
  top: .08125em;
}

@media only screen and (min-width: 1440px) {
  .lyt-top-05 > .panel {
    padding-top: 480px;
  }
}

@media only screen and (max-width: 768px) {
  .lyt-top-05 {
    display: block;
  }
  .lyt-top-05 > .panel {
    padding-top: 56.25%;
  }
  .lyt-top-05 > .panel > a > span > span {
    left: inherit;
    right: 20px;
    margin-top: -17.5px;
    margin-top: calc(-1 * ((1em * 1.25) / 2));
    font-size: 2.8rem;
  }
  [lang="ja"] .lyt-top-05 > .panel > a > span > span {
    margin-top: -28.7px;
    margin-top: calc(-1 * (((1em * 1.6) + (2em * 1.25)) / 2));
    font-size: 1.4rem;
  }
}

.lyt-brand-01 {
  margin-top: 1.5em;
  margin-bottom: 3.5em;
}

@media only screen and (max-width: 768px) {
  .lyt-brand-01 {
    padding: 0 16px;
  }
}

.lyt-brand-02 {
  margin: 0 0 1.625em 0;
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: 50% 0;
  background-size: contain;
}

.lyt-brand-02.customer {
  background-image: url(/brand/images/index-01.jpg);
}

.lyt-brand-02.technology {
  background-image: url(/brand/images/index-11.jpg);
}

.lyt-brand-02 > .hdg {
  line-height: 1.8;
  padding-top: 2.3215em;
  padding-bottom: 2.3215em;
  color: #000;
  font-size: 2.8rem;
  font-weight: bold;
}

.lyt-brand-02 > .content-outer {
  max-width: 1280px;
  margin: 0 auto;
  background-color: #fff;
  background-color: rgba(255, 255, 255, .9);
}

.lyt-brand-02 > .content-outer > .content-inner {
  padding-top: 3.5em;
  padding-bottom: .01em;
}

@media only screen and (max-width: 1280px) {
  .lyt-brand-02 > .content-outer {
    background-color: #fff;
  }
}

@media only screen and (max-width: 980px) {
  .lyt-brand-02.customer, .lyt-brand-02.technology {
    background: none;
  }
  .lyt-brand-02 > .hdg {
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: 100% 0;
    background-size: cover;
  }
  .lyt-brand-02.customer > .hdg {
    background-image: url(/brand/images/index-01.jpg);
  }
  .lyt-brand-02.technology > .hdg {
    background-image: url(/brand/images/index-11.jpg);
  }
  .lyt-brand-02 > .content-outer > .content-inner {
    padding-top: 2em;
  }
}

@media only screen and (max-width: 768px) {
  .lyt-brand-02 > .hdg {
    padding: 2em 16px;
    font-size: 2.2rem;
  }
  .lyt-brand-02 > .content-outer > .content-inner {
    padding-top: 1.5em;
    padding-left: 16px;
    padding-right: 16px;
  }
}

.lyt-brand-03 {
  position: relative;
  max-width: 1920px;
  overflow: hidden;
  margin: 0 auto 4.25em auto;
  background-color: #ebedec;
}

.lyt-brand-03::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  z-index: 1;
  display: block;
  background-image: url(/brand/images/index-10.jpg);
  background-repeat: no-repeat;
  background-position: 100% 0;
  background-size: contain;
}

.lyt-brand-03 > .inner {
  position: relative;
  z-index: 2;
  padding-top: 4.5em;
  padding-bottom: 4.5em;
}

.lyt-brand-03 > .inner > * {
  max-width: 560px;
  text-shadow: 0 0 1rem #ebedec, 0 0 .9rem #ebedec, 0 0 .8rem #ebedec, 0 0 .7rem #ebedec, 0 0 .6rem #ebedec, 0 0 .5rem #ebedec, 0 0 .4rem #ebedec, 0 0 .3rem #ebedec, 0 0 .2rem #ebedec, 1px 1px .1rem #ebedec, 1px -1px .1rem #ebedec, -1px 1px .1rem #ebedec, -1px -1px .1rem #ebedec;
}

.lyt-brand-03 .hdg {
  margin-bottom: .5em;
  font-size: 2.8rem;
  font-weight: bold;
}

.lyt-brand-03 .nav-btn-01 {
  -webkit-justify-content: flex-start;
  justify-content: flex-start;
  margin-bottom: 0;
  text-shadow: none;
}

.lyt-brand-03 .nav-btn-01 a {
  width: auto;
  padding-left: 15px;
}

@media only screen and (max-width: 980px) {
  .lyt-brand-03::before {
    right: -20vw;
  }
  .lyt-brand-03 .inner {
    padding: 4.5em 30px 3em 30px;
  }
}

@media only screen and (max-width: 768px) {
  .lyt-brand-03 {
    height: auto;
    margin-bottom: 3.5em;
  }
  .lyt-brand-03 > .inner {
    padding: 3.5em 16px 2.5em 16px;
  }
  .lyt-brand-03 > .inner > * {
    max-width: inherit;
  }
  .lyt-brand-03 .hdg {
    font-size: 2.2rem;
  }
  .lyt-brand-03 .nav-btn-01 a {
    width: 100%;
  }
}

@media only screen and (max-width: 480px) {
  .lyt-brand-03::before {
    right: -40vw;
  }
}

.lyt-brand-04 {
  margin-bottom: -1em;
  background-color: #f2f2f2;
}

.lyt-brand-04 > .inner {
  padding-top: 2em;
  padding-bottom: 1.625em;
}

@media only screen and (max-width: 768px) {
  .lyt-brand-04 > .inner {
    padding: 1.125em 16px;
  }
}

/* ===========================
box
--------------------------- */
.box-content-01,
.box-highlight-01,
.box-light-01 {
  margin-bottom: 2em;
  padding-top: 1.4375em;
  padding-bottom: 1.4375em;
  background-color: #fff;
}

.box-content-01 > .hdg,
.box-highlight-01 > .hdg,
.box-light-01 > .hdg {
  line-height: 1.8;
  margin-bottom: .625em;
  color: #000;
  font-size: 2rem;
  font-weight: bold;
}

.box-content-01 > *:first-child,
.box-highlight-01 > *:first-child,
.box-light-01 > *:first-child {
  margin-top: 0;
}

.box-content-01 > *:last-child,
.box-highlight-01 > *:last-child,
.box-light-01 > *:last-child {
  margin-bottom: 0;
}

.box-content-01 > *:last-child[class],
.box-highlight-01 > *:last-child[class],
.box-light-01 > *:last-child[class] {
  margin-bottom: 0;
}

.box-content-01 > * + .hdg,
.box-highlight-01 > * + .hdg,
.box-light-01 > * + .hdg {
  margin-top: 1.4375em;
}

.box-content-01 {
  border: 1px solid #d6d6d6;
  padding-left: 31px;
  padding-right: 31px;
}

.box-highlight-01 {
  border: 4px solid #777;
  padding-left: 28px;
  padding-right: 28px;
}

.box-light-01 {
  padding-left: 32px;
  padding-right: 32px;
  background-color: #f2f2f2;
}

@media only screen and (max-width: 768px) {
  .box-content-01 > .hdg,
  .box-highlight-01 > .hdg,
  .box-light-01 > .hdg {
    line-height: 1.6;
    margin-bottom: .875em;
    font-size: 1.8rem;
  }
  .box-content-01 {
    padding-left: 19px;
    padding-right: 19px;
  }
  .box-highlight-01 {
    padding-left: 16px;
    padding-right: 16px;
  }
  .box-light-01 {
    padding-left: 20px;
    padding-right: 20px;
  }
}

.box-policy-01 {
  max-width: 730px;
  margin: 0 auto 3em auto;
  padding: .5em 40px 1.5em 40px;
  background-color: #eaf6fd;
}

.box-policy-01 .hdg {
  line-height: 1.66667;
  margin: 1.5em 0 1em 0;
  color: #20256b;
  font-size: 2.4rem;
  text-align: center;
}

@media only screen and (max-width: 768px) {
  .box-policy-01 {
    padding: .25em 20px 1em 20px;
  }
  .box-policy-01 .hdg {
    font-size: 2rem;
  }
}

.box-related-01 {
  margin: 3.5em 0;
  padding: 2em 0 .01em 0;
  background-color: #f2f2f2;
}

.box-related-01 > li {
  position: relative;
  width: calc(100% / 3);
  margin-bottom: 2em;
  padding: 0 32px;
}

.box-related-01 > li::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  display: block;
  width: 1px;
  background-color: #d6d6d6;
}

.box-related-01 > li:nth-child(3n+3)::before {
  content: none;
}

.box-related-01 > li > .link {
  display: block;
}

.box-related-01 > li > .link .img {
  width: 100%;
}

.box-related-01 > li > .link .img > span img {
  width: 100%;
  opacity: 1;
  -webkit-transition: opacity .2s;
  transition: opacity .2s;
}

.box-related-01 > li > .link .text {
  display: inline-block;
  line-height: 1.625;
  margin-top: 1.25em;
}

.box-related-01 > li > a.link:hover .img > span img, .box-related-01 > li > a.link:focus .img > span img, .box-related-01 > li > a.link:active .img > span img {
  opacity: .7;
}

.box-related-01 > li > a.link:hover .text, .box-related-01 > li > a.link:focus .text, .box-related-01 > li > a.link:active .text {
  text-decoration: underline;
}

.box-related-01 > li > a.link .text {
  position: relative;
  padding-left: 20px;
}

.box-related-01 > li > a.link .text::before {
  content: "";
  position: absolute;
  top: .55em;
  left: 2px;
  display: block;
  width: 8px;
  height: 8px;
  border-top: 2px solid #474747;
  border-right: 2px solid #474747;
}

.box-related-01 > li > a.link .text .link-icon {
  top: .1em;
}

.ie .box-related-01 > li,
.edge .box-related-01 > li {
  width: 33.33333%;
}

@media only screen and (max-width: 768px) {
  .box-related-01 {
    display: block;
    padding: .01em 0;
  }
  .box-related-01 > li {
    width: 100%;
    margin-bottom: 0;
    padding: 2em 20px 1.625em 20px;
  }
  .box-related-01 > li::before {
    left: 20px;
    right: 20px;
    bottom: inherit;
    width: auto;
    height: 1px;
  }
  .box-related-01 > li:nth-child(3n+3)::before {
    content: "";
  }
  .box-related-01 > li:first-child::before {
    content: none;
  }
  .box-related-01 > li > .link .img {
    height: auto !important;
  }
  .ie .box-related-01 > li,
  .edge .box-related-01 > li {
    width: 100%;
  }
}

.box-notice-01 {
  margin-bottom: 3em;
  padding: 1.25em 32px;
  background-color: #e6e6e6;
}

.box-notice-01 > dt,
.box-notice-01 > dd {
  margin: .25em 0;
}

.box-notice-01 > dt {
  width: 168px;
  padding-right: 16px;
  font-weight: bold;
}

.box-notice-01 > dd {
  -webkit-flex-basis: 83.74761%;
  flex-basis: calc(100% - 170px);
  min-width: 83.74761%;
  min-width: calc(100% - 170px);
}

@media only screen and (max-width: 768px) {
  .box-notice-01 {
    display: block;
    margin-bottom: 3em;
    padding: .25em 20px;
  }
  .box-notice-01 > dt {
    width: 100%;
    margin-top: 1.25em;
    margin-bottom: .75em;
    padding-right: 0;
  }
  .box-notice-01 > dd {
    -webkit-flex-basis: initial;
    flex-basis: initial;
    min-width: inherit;
    margin-top: .75em;
    margin-bottom: 1.25em;
  }
}

.box-stretch-01 {
  position: relative;
  margin: 3em 0;
  padding: 3.5em 0 2.0625em 0;
  background-color: #f2f2f2;
}

.box-stretch-01::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  bottom: 0;
  z-index: -1;
  display: block;
  width: 100vw;
  background-color: #f2f2f2;
  transform: translateX(-50%);
}

.box-stretch-01 > [class*="hdg-"] {
  margin-top: -.25em;
}

.box-stretch-01 > [class*="lyt-col-"]:last-child,
.box-stretch-01 > [class*="nav-index-"]:last-child {
  margin-bottom: -1.0625em;
}

.box-stretch-01 > .nav-index-01 > li {
  border: none;
}

.box-stretch-01 > .nav-index-01 > li > .link {
  margin: 0 -27px;
}

.box-stretch-01 > .nav-index-01 > li > .link > .text {
  border-left: none;
  border-right: none;
  padding: 1.25em 27px;
}

@media only screen and (max-width: 768px) {
  .box-stretch-01 {
    margin: 2em 0;
  }
  .box-stretch-01 > .nav-index-01 > li > .link {
    margin: 0 -19px;
  }
  .box-stretch-01 > .nav-index-01 > li > .link > .text {
    padding-left: 19px;
    padding-right: 19px;
  }
  .box-stretch-01 > [class*="lyt-col-"]:last-child.col-equalize {
    margin-bottom: .5em;
  }
}

.box-stockinfo-01 {
  position: relative;
  margin: 1.5em 0 3.5em 0;
  padding: 1em 0;
  background-color: #292929;
}

.box-stockinfo-01::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  bottom: 0;
  z-index: -1;
  display: block;
  width: 100vw;
  background-color: #292929;
  transform: translateX(-50%);
}

.box-stockinfo-01 > .hdg span {
  position: relative;
  display: inline-block;
  padding-left: 52px;
  font-size: 2rem;
  font-weight: bold;
  color: #fff;
}

.box-stockinfo-01 > .hdg span::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  display: block;
  width: 36px;
  height: 36px;
  margin-top: -18px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-image: url(/shared/images/icon-stockinfo-01.png);
  background-size: cover;
}

.box-stockinfo-01 > .embed {
  margin: 0 30px;
}

.box-stockinfo-01 > .btn {
  width: 255px;
  margin: 0;
}

.box-stockinfo-01 > .btn > a {
  width: 100%;
  margin: 0;
}

@media only screen and (max-width: 980px) {
  .box-stockinfo-01 > .btn {
    width: 200px;
  }
}

@media only screen and (max-width: 768px) {
  .box-stockinfo-01 {
    display: block;
    margin-top: 2.5em;
    padding: 1.75em 0;
  }
  .box-stockinfo-01 > .hdg {
    min-height: 36px;
    padding: .5em 0;
    text-align: center;
  }
  .box-stockinfo-01 > .embed {
    margin: 1.25em 0;
  }
  .box-stockinfo-01 > .btn {
    width: 100%;
  }
}

.box-error-01 {
  margin-bottom: 2em;
  border: 4px solid #cc0030;
  padding: 1.4375em 28px;
  background-color: #fff;
}

.box-error-01 > *:first-child {
  margin-top: 0;
}

.box-error-01 > *:last-child {
  margin-bottom: 0;
}

.box-error-01 > *:last-child[class] {
  margin-bottom: 0;
}

@media only screen and (max-width: 768px) {
  .box-error-01 {
    padding: 1em 16px;
  }
}

.box-youtube-01 {
  position: relative;
  margin-bottom: 2em;
  padding-top: 56.25%;
}

.box-youtube-01 > iframe {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  border: none;
}

/* ===========================
heading
--------------------------- */
.hdg-page-01 {
  line-height: 1.6;
  padding: 0 30px;
  background-color: #474747;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  color: #fff;
  font-size: 3.2rem;
  font-weight: bold;
  text-shadow: 0 0 1em rgba(0, 0, 0, .8);
}

.hdg-page-01 > span {
  display: table;
  table-layout: fixed;
  width: 100%;
}

.hdg-page-01 > span > span {
  display: table-cell;
  padding: 1.5625em 0;
  text-align: center;
  vertical-align: middle;
}

.hdg-page-01 > span > span small {
  display: block;
  margin: .25em 0;
  font-size: 2rem;
}

.hdg-page-01 > span > span .small-01 {
  margin: .125em 0;
  font-size: 2.4rem;
}

.hdg-page-01 > span > span .small-02 {
  font-size: 1.8rem;
}

.hdg-page-01.reverse-contrast {
  background-color: #f2f2f2;
  color: #000;
  text-shadow: 0 0 1.2rem rgba(255, 255, 255, .9);
}

.hdg-page-01.brand {
  background-image: url(/shared/images/hdg/brand.jpg);
}

.hdg-page-01.company {
  background-image: url(/shared/images/hdg/company.jpg);
}

.hdg-page-01.csr {
  background-image: url(/shared/images/hdg/csr.jpg);
}

.hdg-page-01.ir {
  background-image: url(/shared/images/hdg/ir.jpg);
}

.hdg-page-01.news {
  background-image: url(/shared/images/hdg/news.jpg);
}

.hdg-page-01.product {
  background-image: url(/shared/images/hdg/product.jpg);
}

.hdg-page-01.recruit {
  background-image: url(/shared/images/hdg/recruit.jpg);
}

.hdg-page-01.support {
  background-image: url(/shared/images/hdg/support.jpg);
}

.hdg-page-01.brand > span > span, .hdg-page-01.company > span > span, .hdg-page-01.csr > span > span, .hdg-page-01.ir > span > span, .hdg-page-01.news > span > span, .hdg-page-01.product > span > span, .hdg-page-01.recruit > span > span, .hdg-page-01.support > span > span {
  padding: 2.2em 0;
}

.hdg-page-01.large > span > span {
  padding: 4.15em 0;
}

.hdg-page-01.news-article {
  border-top: 1px solid #d6d6d6;
  border-bottom: 1px solid #d6d6d6;
  background-color: #fff;
  color: #000;
  text-shadow: none;
}

.hdg-page-01.news-article > span > span {
  padding: .625em 0;
}

.hdg-page-01.ta-l > span > span {
  text-align: left;
}

.hdg-page-01.ta-r > span > span {
  text-align: right;
}

[class="hdg-page-01"] {
  text-shadow: none;
}

@media only screen and (max-width: 768px) {
  .hdg-page-01 {
    line-height: 1.4;
    padding: 0 16px;
    font-size: 2.4rem;
  }
  .hdg-page-01 > span > span {
    padding: 1.14583em 0;
  }
  .hdg-page-01 > span > span small {
    font-size: 1.6rem;
  }
  .hdg-page-01 > span > span .small-01 {
    font-size: 1.8rem;
  }
  .hdg-page-01 > span > span .small-02 {
    font-size: 1.4rem;
  }
  .hdg-page-01.brand > span > span, .hdg-page-01.company > span > span, .hdg-page-01.csr > span > span, .hdg-page-01.ir > span > span, .hdg-page-01.news > span > span, .hdg-page-01.product > span > span, .hdg-page-01.recruit > span > span, .hdg-page-01.support > span > span {
    padding: 1.45833em 0;
  }
  .hdg-page-01.brand.large > span > span, .hdg-page-01.company.large > span > span, .hdg-page-01.csr.large > span > span, .hdg-page-01.ir.large > span > span, .hdg-page-01.news.large > span > span, .hdg-page-01.product.large > span > span, .hdg-page-01.recruit.large > span > span, .hdg-page-01.support.large > span > span {
    padding: 2.25em 0;
  }
  .hdg-page-01.large > span > span {
    padding: 1.75em 0;
  }
}

[class*="hdg-section"] {
  color: #000;
  font-weight: bold;
}

[class*="hdg-section"] > small {
  display: inline-block;
  margin-left: .5em;
  font-size: 1.6rem;
  font-weight: normal;
  vertical-align: middle;
}

[class*="hdg-section"] > .hdg {
  float: left;
  max-width: 65.625%;
  max-width: calc(100% - 80px);
  font-weight: bold;
}

.hdg-section-01 {
  line-height: 1.6;
  margin: 2.14286em 0 1.14286em 0;
  border-bottom: 4px solid #20256b;
  padding-bottom: .25em;
  font-size: 2.8rem;
}

.hdg-section-01 img.notice {
  height: 32px;
  vertical-align: text-bottom;
}

.hdg-section-01 > a.link {
  position: relative;
  display: inline-block;
  padding-right: 20px;
}

.hdg-section-01 > a.link::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  display: block;
  width: 13px;
  height: 13px;
  margin-top: -8px;
  border-top: 3px solid #20256b;
  border-right: 3px solid #20256b;
  -webkit-transition: right .2s;
  transition: right .2s;
  will-change: right;
}

.hdg-section-01 > a.link:hover, .hdg-section-01 > a.link:focus, .hdg-section-01 > a.link:active {
  text-decoration: none;
}

.hdg-section-01 > a.link:hover::after, .hdg-section-01 > a.link:focus::after, .hdg-section-01 > a.link:active::after {
  right: -4px;
}

@media only screen and (max-width: 768px) {
  .hdg-section-01 {
    line-height: 1.5;
    margin: 2.72727em 0 1.45455em 0;
    padding-bottom: .31818em;
    font-size: 2.2rem;
  }
}

.hdg-section-02 {
  line-height: 1.7;
  margin: 2em 0 1.08333em 0;
  border-bottom: 1px solid #777;
  padding-bottom: .33333em;
  font-size: 2.4rem;
}

@media only screen and (max-width: 768px) {
  .hdg-section-02 {
    line-height: 1.5;
    margin: 2.18182em 0 1em 0;
    padding-bottom: .31818em;
    font-size: 2.2rem;
  }
}

.hdg-section-03 {
  position: relative;
  line-height: 1.7;
  margin: 2em 0 1.09091em 0;
  padding-left: 20px;
  font-size: 2.2rem;
}

.hdg-section-03::before {
  content: "";
  position: absolute;
  top: .2em;
  left: 0;
  bottom: .2em;
  display: block;
  width: 4px;
  background-color: #20256b;
}

@media only screen and (max-width: 768px) {
  .hdg-section-03 {
    line-height: 1.6;
    margin: 2.2em 0 1.2em 0;
    font-size: 2rem;
  }
  .hdg-section-03::before {
    top: .15em;
    bottom: .15em;
  }
}

.hdg-section-04 {
  position: relative;
  line-height: 1.8;
  margin: 2.4em 0 1.2em 0;
  padding-left: 20px;
  font-size: 2rem;
}

.hdg-section-04::before {
  content: "";
  position: absolute;
  top: .6em;
  left: 0;
  width: .55em;
  height: .55em;
  border: .15em solid #20256b;
  -webkit-transform: rotateY(45deg) rotateZ(45deg);
  transform: rotateY(45deg) rotateZ(45deg);
}

@media only screen and (max-width: 768px) {
  .hdg-section-04 {
    line-height: 1.6;
    margin: 2.66667em 0 1.33333em 0;
    font-size: 1.8rem;
  }
  .hdg-section-04::before {
    top: .4em;
    width: .61111em;
    height: .61111em;
    border-width: .16667em;
  }
}

.hdg-section-05 {
  line-height: 1.8;
  margin: 2.66667em 0 1.33333em 0;
  font-size: 1.8rem;
}

@media only screen and (max-width: 768px) {
  .hdg-section-05 {
    line-height: 1.6;
  }
}

.area-content-inner > [class*="hdg-section"]:first-child {
  margin-top: -.25em;
}

.hdg-categorytop-01 {
  position: relative;
  margin: 1.5em 0;
}

.hdg-categorytop-01 > .hdg {
  line-height: 1.6;
  padding: 0 80px;
  font-size: 2.8rem;
  font-weight: bold;
  text-align: center;
}

.hdg-categorytop-01 > .hdg .notice {
  height: 32px;
  vertical-align: text-bottom;
}

.hdg-categorytop-01 > .nav-rssbtn-01 {
  position: absolute;
  top: 50%;
  right: 0;
  margin: 0;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

@media only screen and (max-width: 768px) {
  .hdg-categorytop-01 {
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-display: flex;
    display: flex;
    margin: 2em 0;
  }
  .hdg-categorytop-01 > .hdg {
    line-height: 1.25;
    padding: 0;
    font-size: 2.4rem;
  }
  .hdg-categorytop-01 > .nav-rssbtn-01 {
    position: static;
    margin-left: 1.33333em;
    -webkit-transform: none;
    transform: none;
  }
}

/* ===========================
paragraph
--------------------------- */
.pgh-lead-01 {
  line-height: 1.7;
  margin-bottom: 2em;
  color: #20256b;
  font-size: 2.4rem;
}

@media only screen and (max-width: 768px) {
  .pgh-lead-01 {
    line-height: 1.6;
    margin-bottom: 2.4em;
    font-size: 2rem;
  }
}

.pgh-lead-02 {
  line-height: 1.7;
  margin-bottom: 1.33333em;
  font-size: 2.4rem;
  text-align: center;
}

@media only screen and (max-width: 768px) {
  .pgh-lead-02 {
    line-height: 1.6;
    font-size: 2rem;
  }
}

.pgh-notice-01 {
  line-height: 1.8;
  margin-bottom: 1.71429em;
  color: #666;
  font-size: 1.4rem;
}

.pgh-notice-01 + .pgh-notice-01 {
  margin-top: -1.28571em;
}

.pgh-notice-01 > small > .mark {
  margin-right: .5em;
  white-space: nowrap;
}

@media only screen and (max-width: 768px) {
  .pgh-notice-01 {
    line-height: 1.6;
  }
}

.pgh-notice-02 {
  line-height: 1.8;
  margin-bottom: 1.71429em;
  color: #666;
  font-size: 1.4rem;
}

.pgh-indent-01 {
  padding-left: 2em;
}

@media only screen and (max-width: 768px) {
  .pgh-indent-01 {
    padding-left: 1.5em;
  }
}

.pgh-date-01 {
  text-align: right;
}

.area-content-inner > .pgh-date-01:first-child {
  margin-top: -2em;
}

.pgh-result-01 strong {
  color: #333;
  font-size: 2rem;
}

@media only screen and (max-width: 768px) {
  .pgh-result-01 {
    font-size: 1.4rem;
  }
  .pgh-result-01 strong {
    font-size: 1.6rem;
  }
}

.pgh-topmessage-01 {
  position: relative;
  padding-top: 56.21622%;
  background: transparent url(/company/profile/images/message-01.jpg) no-repeat 50% 50%;
  background-size: cover;
}

.pgh-topmessage-01 strong {
  position: absolute;
  top: 50%;
  left: 0;
  width: 50%;
  line-height: 1.5;
  padding-left: 5.40541%;
  color: #333;
  font-size: 3.2rem;
  font-weight: normal;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

@media only screen and (max-width: 768px) {
  .pgh-topmessage-01 {
    margin-left: -16px;
    margin-right: -32px;
  }
  .pgh-topmessage-01 strong {
    width: 53.75%;
    padding-left: 16px;
    font-size: 2.2rem;
  }
  [lang="ja"] .pgh-topmessage-01 strong {
    font-size: 2.8rem;
  }
}

@media only screen and (max-width: 480px) {
  .pgh-topmessage-01 strong {
    font-size: 1.4rem;
  }
  [lang="ja"] .pgh-topmessage-01 strong {
    font-size: 2.2rem;
  }
}

.pgh-topmessage-02 {
  position: relative;
  padding-top: 56.21622%;
  background: transparent url(/csr/message/images/index-01.jpg) no-repeat 50% 50%;
  background-size: cover;
}

.pgh-topmessage-02 strong {
  position: absolute;
  top: 50%;
  right: 0;
  width: 50%;
  line-height: 1.5;
  padding-right: 10.81081%;
  color: #333;
  font-size: 3.2rem;
  font-weight: normal;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

@media only screen and (max-width: 768px) {
  .pgh-topmessage-02 {
    margin-left: -32px;
    margin-right: -16px;
  }
  .pgh-topmessage-02 strong {
    padding-right: 16px;
    font-size: 1.6rem;
  }
  [lang="en"] .pgh-topmessage-02 strong {
    width: 55%;
    font-size: 1.4rem;
  }
}

.pgh-error-01 {
  position: relative;
  padding-left: 28px;
  color: #cc0030;
}

.pgh-error-01::before {
  content: "";
  position: absolute;
  top: .4375em;
  left: 0;
  display: block;
  width: 18px;
  height: 16px;
  background-image: url(/shared/images/icon-error-01.png);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: cover;
}

@media only screen and (max-width: 768px) {
  .pgh-error-01 {
    padding-left: 24px;
  }
  .pgh-error-01::before {
    top: .25em;
  }
}

/* ===========================
list
--------------------------- */
.list-link-01 {
  margin-bottom: 1.5em;
}

.list-link-01 > li {
  padding-left: 20px;
}

.list-link-01 > li + li {
  margin-top: .4375em;
}

.list-link-01 > li > a {
  position: relative;
  display: inline-block;
  margin-left: -20px;
  padding-left: 20px;
}

.list-link-01 > li > a::before {
  content: "";
  position: absolute;
  top: .7em;
  left: 1px;
  display: block;
  width: 8px;
  height: 8px;
  border-top: 2px solid #474747;
  border-right: 2px solid #474747;
}

.list-link-01.inline > li {
  display: inline-block;
  margin-right: 16px;
}

.list-link-01.inline > li + li {
  margin-top: 0;
}

.list-link-01.col2, .list-link-01.col3, .list-link-01.col4 {
  margin-left: -15px;
  margin-right: -15px;
  margin-bottom: 1.0625em;
}

.list-link-01.col2 > li, .list-link-01.col3 > li, .list-link-01.col4 > li {
  margin-bottom: .4375em;
  padding-left: 35px;
  padding-right: 15px;
}

.list-link-01.col2 > li + li, .list-link-01.col3 > li + li, .list-link-01.col4 > li + li {
  margin-top: 0;
}

.list-link-01.col2 > li {
  width: 50%;
}

.list-link-01.col3 > li {
  width: calc(100% / 3);
}

.list-link-01.col4 > li {
  width: 25%;
}

.list-link-01 .list-link-01 > li > a::before {
  top: .8em;
  left: 2px;
  width: 5px;
  height: 5px;
  border-top: 1px solid #777;
  border-right: 1px solid #777;
}

.ie .list-link-01.col3 > li,
.edge .list-link-01.col3 > li {
  width: 33.33333%;
}

@media only screen and (max-width: 768px) {
  .list-link-01 > li > a::before {
    top: .5em;
  }
  .list-link-01.col2, .list-link-01.col3, .list-link-01.col4 {
    margin-left: -8px;
    margin-right: -8px;
  }
  .list-link-01.col2 > li, .list-link-01.col3 > li, .list-link-01.col4 > li {
    padding-left: 28px;
    padding-right: 8px;
  }
  .list-link-01 .list-link-01 > li > a::before {
    top: .6em;
  }
}

@media only screen and (max-width: 840px) {
  .list-link-01.col4 > li {
    width: calc(100% / 3);
  }
  .ie .list-link-01.col4 > li,
  .edge .list-link-01.col4 > li {
    width: 33.33333%;
  }
}

@media only screen and (max-width: 720px) {
  .list-link-01.col4 > li, .list-link-01.col3 > li {
    width: 50%;
  }
  .ie .list-link-01.col4 > li, .ie .list-link-01.col3 > li,
  .edge .list-link-01.col4 > li,
  .edge .list-link-01.col3 > li {
    width: 50%;
  }
}

@media only screen and (max-width: 480px) {
  .list-link-01.col2, .list-link-01.col3, .list-link-01.col4 {
    display: block;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 1.5em;
  }
  .list-link-01.col2 > li, .list-link-01.col3 > li, .list-link-01.col4 > li {
    width: 100%;
    margin-bottom: 0;
    padding-left: 20px;
    padding-right: 0;
  }
  .list-link-01.col2 > li + li, .list-link-01.col3 > li + li, .list-link-01.col4 > li + li {
    margin-top: .4375em;
  }
  .ie .list-link-01.col2 > li, .ie .list-link-01.col3 > li, .ie .list-link-01.col4 > li,
  .edge .list-link-01.col2 > li,
  .edge .list-link-01.col3 > li,
  .edge .list-link-01.col4 > li {
    width: 100%;
  }
}

.list-bullet-01 {
  margin-bottom: 1.5em;
}

.list-bullet-01 > li {
  position: relative;
  padding-left: 20px;
}

.list-bullet-01 > li::before {
  content: "";
  position: absolute;
  top: .8em;
  left: 4px;
  display: block;
  width: 5px;
  height: 5px;
  background-color: #20256b;
}

.list-bullet-01 > li + li {
  margin-top: .4375em;
}

.list-bullet-01.inline > li {
  display: inline-block;
  margin-right: 16px;
}

.list-bullet-01.inline > li + li {
  margin-top: 0;
}

.list-bullet-01.col2, .list-bullet-01.col3, .list-bullet-01.col4 {
  margin-left: -15px;
  margin-right: -15px;
  margin-bottom: 1.0625em;
}

.list-bullet-01.col2 > li, .list-bullet-01.col3 > li, .list-bullet-01.col4 > li {
  margin-bottom: .4375em;
  padding-left: 35px;
  padding-right: 15px;
}

.list-bullet-01.col2 > li::before, .list-bullet-01.col3 > li::before, .list-bullet-01.col4 > li::before {
  left: 19px;
}

.list-bullet-01.col2 > li + li, .list-bullet-01.col3 > li + li, .list-bullet-01.col4 > li + li {
  margin-top: 0;
}

.list-bullet-01.col2 > li {
  width: 50%;
}

.list-bullet-01.col3 > li {
  width: calc(100% / 3);
}

.list-bullet-01.col4 > li {
  width: 25%;
}

.list-bullet-01 .list-bullet-01 > li::before {
  width: 4px;
  height: 4px;
  background-color: #777;
}

.ie .list-bullet-01.col3 > li,
.edge .list-bullet-01.col3 > li {
  width: 33.33333%;
}

@media only screen and (max-width: 768px) {
  .list-bullet-01 > li::before {
    top: .6em;
  }
  .list-bullet-01.col2, .list-bullet-01.col3, .list-bullet-01.col4 {
    margin-left: -8px;
    margin-right: -8px;
  }
  .list-bullet-01.col2 > li, .list-bullet-01.col3 > li, .list-bullet-01.col4 > li {
    padding-left: 28px;
    padding-right: 8px;
  }
  .list-bullet-01.col2 > li::before, .list-bullet-01.col3 > li::before, .list-bullet-01.col4 > li::before {
    left: 12px;
  }
  .list-bullet-01 .list-bullet-01 > li::before {
    top: .6em;
  }
}

@media only screen and (max-width: 840px) {
  .list-bullet-01.col4 > li {
    width: calc(100% / 3);
  }
  .ie .list-bullet-01.col4 > li,
  .edge .list-bullet-01.col4 > li {
    width: 33.33333%;
  }
}

@media only screen and (max-width: 720px) {
  .list-bullet-01.col4 > li, .list-bullet-01.col3 > li {
    width: 50%;
  }
}

@media only screen and (max-width: 480px) {
  .list-bullet-01.col2, .list-bullet-01.col3, .list-bullet-01.col4 {
    display: block;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 1.5em;
  }
  .list-bullet-01.col2 > li, .list-bullet-01.col3 > li, .list-bullet-01.col4 > li {
    width: 100%;
    margin-bottom: 0;
    padding-left: 20px;
    padding-right: 0;
  }
  .list-bullet-01.col2 > li::before, .list-bullet-01.col3 > li::before, .list-bullet-01.col4 > li::before {
    left: 4px;
  }
  .list-bullet-01.col2 > li + li, .list-bullet-01.col3 > li + li, .list-bullet-01.col4 > li + li {
    margin-top: .4375em;
  }
}

.list-marked-01 {
  margin-bottom: 1.5em;
}

.list-marked-01 > li {
  position: relative;
  padding-left: 40px;
}

.list-marked-01 > li + li {
  margin-top: .4375em;
}

.list-marked-01 > li > span {
  display: block;
}

.list-marked-01 > li > span.marked {
  position: absolute;
  top: 0;
  left: 0;
  width: 34px;
  text-align: right;
}

.list-ordered-01 {
  list-style: decimal;
  margin: 0 0 1.5em 40px;
}

.list-ordered-01 > li {
  margin-top: .4375em;
}

.list-desc-01 {
  margin-bottom: 1.5em;
}

.list-desc-01 > dt {
  font-weight: bold;
}

.list-desc-01 > dt + dd {
  margin-top: .4375em;
}

.list-desc-01 > dd + dt {
  margin-top: 1.125em;
}

.list-desc-01 > dd + dd {
  margin-top: .625em;
}

.list-desc-01 > dd > *:last-child {
  margin-bottom: 0;
}

.list-define-01 {
  margin-bottom: .8em;
}

.list-define-01 > dt,
.list-define-01 > dd {
  line-height: 1.6;
  margin-bottom: .6375em;
}

.list-define-01 > dt {
  position: relative;
  width: 17.49999%;
  padding-right: 1em;
}

.list-define-01 > dt::after {
  content: ":";
  position: absolute;
  top: 0;
  right: .5em;
}

.list-define-01 > dd {
  width: 82.5%;
}

@media only screen and (max-width: 768px) {
  .list-define-01 {
    display: block;
    margin-bottom: 1.4375em;
  }
  .list-define-01 > dt {
    position: static;
    width: 100%;
    margin-bottom: .4375em;
    padding-right: 0;
  }
  .list-define-01 > dt::after {
    position: static;
    margin-left: .25em;
  }
  .list-define-01 > dd {
    width: 100%;
    margin-bottom: 1em;
  }
}

[class*="list-"] > li > div:first-of-type,
[class*="list-"] > li > p:first-of-type,
[class*="list-"] > li > ul:first-of-type,
[class*="list-"] > li > ol:first-of-type,
[class*="list-"] > li > dl:first-of-type {
  margin-top: .4375em;
}

[class*="list-"] [class*="list-"] {
  margin-bottom: 1em;
}

[class*="list-"] .list-marked-01 > li {
  padding-left: 28px;
}

[class*="list-"] .list-marked-01 > li > span.marked {
  left: -12px;
}

[class*="list-"] .list-ordered-01 {
  margin-left: 28px;
}

.list-anchor-01 {
  margin: 0 0 2.5625em -28px;
}

.list-anchor-01 > li {
  float: left;
  margin-bottom: .4375em;
  padding-left: 28px;
}

.list-anchor-01 > li > a {
  position: relative;
  display: inline-block;
  padding-left: 20px;
}

.list-anchor-01 > li > a::before {
  content: "";
  position: absolute;
  top: .6em;
  left: 3px;
  display: block;
  width: 8px;
  height: 8px;
  border-right: 2px solid #474747;
  border-bottom: 2px solid #474747;
}

@media only screen and (max-width: 768px) {
  .list-anchor-01 {
    margin-left: -20px;
    font-size: 1.4rem;
  }
  .list-anchor-01 > li {
    padding-left: 20px;
  }
  .list-anchor-01 > li > a::before {
    top: .35em;
  }
}

.list-news-01 {
  line-height: 1.6;
  border-top: 1px solid #d6d6d6;
}

.list-news-01 > li {
  border-bottom: 1px solid #d6d6d6;
}

.list-news-01 > li > .link {
  display: table;
  width: 100%;
  background-color: transparent;
}

.list-news-01 > li > .link > .date,
.list-news-01 > li > .link > .type,
.list-news-01 > li > .link > .text {
  display: table-cell;
  vertical-align: middle;
}

.list-news-01 > li > .link > .date,
.list-news-01 > li > .link > .type {
  font-size: 1.4rem;
  text-align: center;
}

.list-news-01 > li > .link > .date {
  width: 145px;
  padding: 0 10px 0 20px;
}

.list-news-01 > li > .link > .type {
  width: 120px;
}

.list-news-01 > li > .link > .type > span {
  display: inline-block;
  min-width: 5.28571em;
  padding: 0 2px;
  background-color: #777;
  color: #fff;
}

.list-news-01 > li > .link > .text {
  padding: 1.175em 0 1.175em 10px;
}

.list-news-01 > li > a.link {
  text-decoration: none;
  -webkit-transition: background-color .2s;
  transition: background-color .2s;
  will-change: background-color;
}

.list-news-01 > li > a.link > .date,
.list-news-01 > li > a.link > .type {
  color: #333;
}

.list-news-01 > li > a.link > .text {
  position: relative;
  padding-right: 36px;
}

.list-news-01 > li > a.link > .text::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 16px;
  display: block;
  width: 12px;
  height: 12px;
  margin-top: -6px;
  border-top: 3px solid #20256b;
  border-right: 3px solid #20256b;
  -webkit-transition: right .2s;
  transition: right .2s;
  will-change: right;
}

.list-news-01 > li > a.link:hover, .list-news-01 > li > a.link:focus, .list-news-01 > li > a.link:active {
  background-color: rgba(0, 0, 0, .05);
}

.list-news-01 > li > a.link:hover > .text, .list-news-01 > li > a.link:focus > .text, .list-news-01 > li > a.link:active > .text {
  text-decoration: underline;
}

.list-news-01 > li > a.link:hover > .text::after, .list-news-01 > li > a.link:focus > .text::after, .list-news-01 > li > a.link:active > .text::after {
  right: 12px;
}

.list-news-01 > li.hide {
  display: none;
}

@media only screen and (max-width: 768px) {
  .list-news-01 > li > .link {
    display: block;
    padding: .85714em 20px;
  }
  .list-news-01 > li > .link > .date,
  .list-news-01 > li > .link > .type {
    display: inline-block;
    width: auto;
  }
  .list-news-01 > li > .link > .date {
    padding: 0;
  }
  .list-news-01 > li > .link > .type {
    margin-left: 10px;
  }
  .list-news-01 > li > .link > .text {
    display: block;
    margin-top: .57143em;
    padding: 0;
  }
  .list-news-01 > li > a.link {
    position: relative;
  }
  .list-news-01 > li > a.link > .text {
    position: static;
    padding-right: 16px;
  }
  .list-news-01 > li > a.link > .text::after {
    right: 18px;
  }
  .list-news-01 > li > a.link:hover > .text::after, .list-news-01 > li > a.link:focus > .text::after, .list-news-01 > li > a.link:active > .text::after {
    right: 14px;
  }
}

.list-person-01 {
  margin: 0 -15px;
}

.list-person-01 > li {
  -webkit-flex-direction: row-reverse;
  flex-direction: row-reverse;
  width: 50%;
  margin-bottom: 2em;
}

.list-person-01 > li > .text,
.list-person-01 > li > .img {
  width: 50%;
  padding: 0 15px;
}

.list-person-01 > li > .text:first-of-type {
  margin-top: -.25em;
}

.list-person-01 > li > .text .name {
  line-height: 1.8;
  margin-bottom: .75em;
  font-size: 1.4rem;
  font-weight: bold;
}

.list-person-01 > li > .text .name .position {
  display: block;
}

.list-person-01 > li > .text .name b {
  font-size: 1.8rem;
}

.list-person-01 > li > .text .birth {
  margin-bottom: .75em;
}

.list-person-01 > li > .text > *:last-child {
  margin-bottom: 0;
}

.list-person-01 > li:only-child {
  width: 100%;
}

.list-person-01 > li:only-child > .text {
  width: 75%;
}

.list-person-01 > li:only-child > .img {
  width: 25%;
}

@media only screen and (max-width: 768px) {
  .list-person-01 {
    margin: 0 -8px;
  }
  .list-person-01 > li {
    width: 100%;
  }
  .list-person-01 > li > .text,
  .list-person-01 > li > .img {
    padding: 0 8px;
  }
  .list-person-01 > li > .text {
    width: 66.77631%;
  }
  .list-person-01 > li > .img {
    width: 33.223685%;
  }
  .list-person-01 > li:only-child > .text {
    width: 66.77631%;
  }
  .list-person-01 > li:only-child > .img {
    width: 33.223685%;
  }
}

.list-toggle-01 {
  margin-bottom: 3em;
}

.list-toggle-01 > li {
  border-bottom: 1px solid #d6d6d6;
  background-color: #fff;
}

.list-toggle-01 > li:first-child {
  border-top: 1px solid #d6d6d6;
}

.list-toggle-01 > li > .ui {
  display: block;
  line-height: 1.6;
  padding: .9695em 20px;
  background-color: #fff;
  font-weight: bold;
}

.list-toggle-01 > li > button.ui {
  position: relative;
  width: 100%;
  padding-right: 40px;
  text-align: left;
  -webkit-transition: background-color .2s;
  transition: background-color .2s;
  will-change: background-color;
}

.list-toggle-01 > li > button.ui:hover, .list-toggle-01 > li > button.ui:focus, .list-toggle-01 > li > button.ui:active {
  background-color: #f2f2f2;
}

.list-toggle-01 > li > button.ui[aria-expanded]::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 14px;
  display: block;
  width: 12px;
  height: 12px;
  margin-top: -10px;
  border-right: 3px solid #20256b;
  border-bottom: 3px solid #20256b;
}

.list-toggle-01 > li > button.ui[aria-expanded="true"]::after {
  margin-top: -4px;
  -webkit-transform: rotate(-135deg);
  transform: rotate(-135deg);
}

.list-toggle-01 > li > .content {
  padding: .4905em 20px .01em 20px;
}

.list-toggle-01 > li > .content:first-of-type {
  margin-top: 0;
}

.list-toggle-01 > li > .content[aria-expanded] {
  display: none;
}

.list-toggle-01 > li > .content[aria-expanded="true"] {
  display: block;
}

.list-toggle-01 p,
.list-toggle-01 ul,
.list-toggle-01 ol,
.list-toggle-01 dl,
.list-toggle-01 table {
  margin-bottom: 1em;
}

.static .list-toggle-01 > li > .content {
  display: block;
}

@media only screen and (max-width: 768px) {
  .list-toggle-01 {
    margin-bottom: 2em;
  }
  .list-toggle-01 > li > .ui {
    padding-left: 8px;
    padding-right: 8px;
  }
  .list-toggle-01 > li > button.ui {
    padding-right: 28px;
  }
  .list-toggle-01 > li > button.ui[aria-expanded]::after {
    right: 8px;
  }
  .list-toggle-01 > li > .content {
    padding-left: 8px;
    padding-right: 8px;
  }
}

.list-result-01 {
  margin: 2em 0;
}

.list-result-01 > li {
  border-bottom: 1px solid #d6d6d6;
}

.list-result-01 > li:first-child {
  border-top: 1px solid #d6d6d6;
}

.list-result-01 > li > a {
  position: relative;
  display: block;
  min-height: 168px;
  padding: 1.125em 0 1.125em 190px;
  background-color: #fff;
  color: #333;
  text-decoration: none;
  -webkit-transition: background-color .2s;
  transition: background-color .2s;
  will-change: background-color;
}

.list-result-01 > li > a .title {
  display: block;
  color: #08107b;
  font-weight: bold;
}

.list-result-01 > li > a .img {
  position: absolute;
  top: 24px;
  left: 0;
  display: block;
  width: 160px;
  height: 120px;
  overflow: hidden;
}

.list-result-01 > li > a .img img {
  background-color: #fff;
  opacity: 1;
  -webkit-transition: opacity .2s;
  transition: opacity .2s;
}

.list-result-01 > li > a .text {
  display: block;
  margin-top: .25em;
}

.list-result-01 > li > a .text mark {
  background-color: #f2d17d;
}

.list-result-01 > li > a .url {
  display: block;
  margin-top: .28571em;
  color: #666;
  font-size: 1.4rem;
}

.list-result-01 > li > a:hover, .list-result-01 > li > a:focus, .list-result-01 > li > a:active {
  background-color: #f2f2f2;
}

.list-result-01 > li > a:hover .title, .list-result-01 > li > a:focus .title, .list-result-01 > li > a:active .title {
  text-decoration: underline;
}

.list-result-01 > li > a:hover .img img, .list-result-01 > li > a:focus .img img, .list-result-01 > li > a:active .img img {
  opacity: .7;
}

@media only screen and (max-width: 768px) {
  .list-result-01 > li > a {
    min-height: 94px;
    padding: 1em 0 1em 88px;
  }
  .list-result-01 > li > a .img {
    top: 20px;
    width: 72px;
    height: 54px;
  }
  .list-result-01 > li > a .text {
    margin-top: .28571em;
    font-size: 1.4rem;
  }
  .list-result-01 > li > a .url {
    margin-top: .33333em;
    font-size: 1.2rem;
  }
}

.list-step-01 {
  overflow: hidden;
  margin-bottom: 2em;
}

.list-step-01 > li {
  position: relative;
  z-index: 1;
  background-color: #e6e6e6;
  color: #333;
  font-weight: bold;
  text-align: center;
}

.list-step-01 > li::before, .list-step-01 > li::after {
  content: "";
  position: absolute;
  top: 0;
  left: -12px;
  bottom: 0;
  display: block;
  width: 4px;
  background-color: #fff;
}

.list-step-01 > li::after {
  content: none;
  width: 8px;
  margin-left: 4px;
  background-color: #474747;
}

.list-step-01 > li > span,
.list-step-01 > li > em {
  position: relative;
  display: block;
  padding: .75em 12px;
}

.list-step-01 > li > span::before, .list-step-01 > li > span::after,
.list-step-01 > li > em::before,
.list-step-01 > li > em::after {
  content: "";
  position: absolute;
  top: 0;
  left: -8px;
  z-index: 2;
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 28px 0 28px 20px;
  border-color: transparent transparent transparent #fff;
}

.list-step-01 > li > span::after,
.list-step-01 > li > em::after {
  margin-left: -4px;
  border-left-color: #e6e6e6;
}

.list-step-01 > li:first-child {
  border-radius: .25rem 0 0 .25rem;
}

.list-step-01 > li:first-child::before {
  content: none;
}

.list-step-01 > li:first-child > span::before, .list-step-01 > li:first-child > span::after,
.list-step-01 > li:first-child > em::before,
.list-step-01 > li:first-child > em::after {
  content: none;
}

.list-step-01 > li:last-child {
  border-radius: 0 .25rem .25rem 0;
}

.list-step-01 > li.current {
  background-color: #474747;
  color: #fff;
}

.list-step-01 > li.current::after {
  content: "";
}

.list-step-01 > li.current + li::after {
  content: "";
  background-color: #e6e6e6;
}

.list-step-01 > li.current + li > span::after,
.list-step-01 > li.current + li > em::after {
  border-left-color: #474747;
}

@media only screen and (max-width: 768px) {
  .list-step-01 > li > span,
  .list-step-01 > li > em {
    padding: .9695em 12px;
  }
}

.list-faq-01 {
  margin-bottom: 2.5em;
  border-top: 1px solid #d6d6d6;
}

.list-faq-01 > li {
  border-bottom: 1px solid #d6d6d6;
}

.list-faq-01 > li > b {
  position: relative;
  display: block;
  overflow: hidden;
  padding: 1em 0 1em 64px;
  background-color: #f2f2f2;
}

.list-faq-01 > li > b[role="button"] {
  padding-right: 40px;
  background-color: #fff;
  cursor: pointer;
  -webkit-transition: background-color .2s;
  transition: background-color .2s;
  will-change: background-color;
}

.list-faq-01 > li > b[role="button"]::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 14px;
  display: block;
  width: 12px;
  height: 12px;
  margin-top: -4px;
  border-top: 3px solid #20256b;
  border-right: 3px solid #20256b;
}

.list-faq-01 > li > b[role="button"]:hover, .list-faq-01 > li > b[role="button"]:focus, .list-faq-01 > li > b[role="button"]:active, .list-faq-01 > li > b[role="button"][aria-expanded="true"] {
  background-color: #f2f2f2;
}

.list-faq-01 > li > b[role="button"][aria-expanded="false"]::after {
  margin-top: -10px;
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
}

.list-faq-01 > li > b > .mark {
  position: absolute;
  top: 1em;
  left: 20px;
  display: block;
  width: 2em;
  height: 2em;
  line-height: 1.95;
  border: 1px solid #20256b;
  border-radius: 1em;
  background-color: #fff;
  color: #20256b;
  font-weight: normal;
  text-align: center;
}

.list-faq-01 > li > .content {
  position: relative;
  display: none;
  padding: 1em 0 .01em 64px;
}

.list-faq-01 > li > .content:first-of-type {
  margin-top: 1px;
}

.list-faq-01 > li > .content > .mark {
  position: absolute;
  top: 1em;
  left: 20px;
  display: block;
  width: 2em;
  height: 2em;
  line-height: 1.95;
  border-radius: 1em;
  background-color: #20256b;
  color: #fff;
  font-weight: normal;
  text-align: center;
}

.list-faq-01 > li.opened > .content {
  display: block;
}

.static .list-faq-01 > li > .content {
  display: block;
}

@media only screen and (max-width: 768px) {
  .list-faq-01 > li > b,
  .list-faq-01 > li > .content {
    padding-left: 60px;
  }
  .list-faq-01 > li > b > .mark,
  .list-faq-01 > li > .content > .mark {
    font-size: 1.4rem;
  }
}

.list-brand-01 {
  margin: 0 -15px;
}

.list-brand-01::after {
  content: "";
}

.list-brand-01 > li {
  position: relative;
  width: 25%;
  margin-bottom: 30px;
  padding: 22.36842% 15px 0 15px;
  padding: calc(25% - 30px) 15px 0 15px;
}

.list-brand-01 > li > a {
  position: absolute;
  top: 0;
  left: 15px;
  right: 15px;
  bottom: 0;
  padding: 20px;
  background-color: #fff;
}

.list-brand-01 > li > a::before, .list-brand-01 > li > a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  display: block;
}

.list-brand-01 > li > a::before {
  border-bottom: 4px solid transparent;
}

.list-brand-01 > li > a::after {
  top: 0;
  border: 0 solid transparent;
  -webkit-transition: border-width .1s;
  transition: border-width .1s;
  will-change: border-width;
}

.list-brand-01 > li > a:hover::after, .list-brand-01 > li > a:focus::after, .list-brand-01 > li > a:active::after {
  border-width: 4px;
}

.list-brand-01 > li > a span {
  position: relative;
  z-index: 2;
  width: 100%;
}

.list-brand-01 > li > a span img {
  display: block;
  margin: 0 auto;
}

.list-brand-01 > li.line-01 > a::before, .list-brand-01 > li.line-01 > a::after {
  border-color: #20256b;
}

.list-brand-01 > li.line-02 > a::before, .list-brand-01 > li.line-02 > a::after {
  border-color: #e9b226;
}

.list-brand-01 > li.line-03 > a::before, .list-brand-01 > li.line-03 > a::after {
  border-color: #ccc;
}

.list-brand-01 > li.line-04 > a::before, .list-brand-01 > li.line-04 > a::after {
  border-color: #292929;
}

@media only screen and (max-width: 980px) {
  .list-brand-01 > li > a {
    padding: 16px;
  }
}

@media only screen and (max-width: 768px) {
  .list-brand-01 {
    margin: 0 -8px;
  }
  .list-brand-01 > li {
    width: 25%;
    margin-bottom: 16px;
    padding: 23.4375% 8px 0 8px;
    padding: calc(25% - 16px) 8px 0 8px;
  }
  .list-brand-01 > li > a {
    left: 8px;
    right: 8px;
  }
  .list-brand-01 > li > a::before {
    border-bottom-width: 3px;
  }
  .list-brand-01 > li > a:hover::after, .list-brand-01 > li > a:focus::after, .list-brand-01 > li > a:active::after {
    border-width: 3px;
  }
}

@media only screen and (max-width: 480px) {
  .list-brand-01 > li {
    width: 50%;
    padding-top: 48.33333%;
    padding-top: calc(50% - 16px);
  }
}

.list-icon-01 {
  line-height: 1.6;
}

.list-icon-01 > li {
  margin-bottom: 1em;
}

.list-icon-01 > li > a,
.list-icon-01 > li > span {
  position: relative;
  display: inline-block;
  min-height: 1.875em;
  padding-top: .125em;
  padding-left: 40px;
}

.list-icon-01 > li > a > .icon,
.list-icon-01 > li > span > .icon {
  position: absolute;
  top: 0;
  left: 0;
}

@media only screen and (max-width: 768px) {
  .link-icon {
    top: .125em;
  }
}

/* ===========================
link
--------------------------- */
a small {
  font-size: 87.5%;
}

.link-icon {
  position: relative;
  top: .05em;
  vertical-align: baseline;
}

@media only screen and (max-width: 768px) {
  .link-icon {
    top: .125em;
  }
}

.link-text-01 {
  position: relative;
  display: inline-block;
  padding-left: 20px;
}

.link-text-01::before {
  content: "";
  position: absolute;
  top: .7em;
  left: 1px;
  display: block;
  width: 8px;
  height: 8px;
  border-top: 2px solid #474747;
  border-right: 2px solid #474747;
}

@media only screen and (max-width: 768px) {
  .link-text-01::before {
    top: .5em;
  }
}

.link-modal-01 {
  position: relative;
  display: inline-block;
}

.link-modal-01 > img {
  -webkit-filter: grayscale(0);
  filter: grayscale(0);
  -webkit-transition: -webkit-filter .2s;
  transition: filter .2s;
  will-change: -webkit-filter, filter;
}

.link-modal-01 > .expand {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  display: block;
  overflow: hidden;
  background-color: rgba(0, 0, 0, .6);
  opacity: 0;
  -webkit-transition: opacity .2s;
  transition: opacity .2s;
}

.link-modal-01 > .expand span {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  min-width: 60px;
  padding-top: 58px;
  background-image: url(/shared/images/icon-loupe-02.png);
  background-repeat: no-repeat;
  background-position: 50% 0;
  color: #fff;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.link-modal-01:hover > img, .link-modal-01:focus > img, .link-modal-01:active > img {
  -webkit-filter: grayscale(1);
  filter: grayscale(1);
}

.link-modal-01:hover > .expand, .link-modal-01:focus > .expand, .link-modal-01:active > .expand {
  opacity: 1;
}

.link-modal-01[disabled] {
  cursor: default;
}

.link-modal-01[disabled] > .expand {
  display: none;
}

.link-modal-01[disabled]:hover > img, .link-modal-01[disabled]:focus > img, .link-modal-01[disabled]:active > img {
  -webkit-filter: grayscale(0);
  filter: grayscale(0);
}

.ie .link-modal-01 > img {
  width: 100%;
}

@media only screen and (max-width: 640px) {
  .link-modal-01 {
    position: static;
  }
  .link-modal-01 > .expand {
    display: none;
  }
  .link-modal-01:hover > img, .link-modal-01:focus > img, .link-modal-01:active > img {
    -webkit-filter: grayscale(0);
    filter: grayscale(0);
  }
}

.link-banner-01 {
  position: relative;
  display: block;
  padding: 2.375em 40px;
  background-color: #fff;
  text-align: center;
}

.link-banner-01 b {
  position: relative;
  z-index: 2;
  display: block;
  color: #333;
  font-size: 2.4rem;
  font-weight: normal;
  text-align: center;
}

.link-banner-01 .link {
  position: relative;
  z-index: 2;
  display: inline-block;
  padding-left: 20px;
}

.link-banner-01 .link::before {
  content: "";
  position: absolute;
  top: .7em;
  left: 1px;
  z-index: 2;
  display: block;
  width: 8px;
  height: 8px;
  border-top: 2px solid #474747;
  border-right: 2px solid #474747;
}

.link-banner-01::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  display: block;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  opacity: 1;
  -webkit-transition: opacity .2s;
  transition: opacity .2s;
}

.link-banner-01:hover, .link-banner-01:focus, .link-banner-01:active {
  text-decoration: none;
}

.link-banner-01:hover .link, .link-banner-01:focus .link, .link-banner-01:active .link {
  text-decoration: underline;
}

.link-banner-01:hover::before, .link-banner-01:focus::before, .link-banner-01:active::before {
  opacity: .7;
}

.link-banner-01.internship::before {
  background-image: url(/shared/images/bg-internship-01.jpg);
}

@media only screen and (max-width: 768px) {
  .link-banner-01 {
    padding: 2.25em 20px;
  }
  .link-banner-01 b {
    font-size: 2rem;
  }
  .link-banner-01 b + .link {
    margin-top: .5em;
  }
  .link-banner-01 .link {
    padding-left: 18px;
  }
  .link-banner-01 .link::before {
    top: .5em;
  }
}

/* ===========================
navigation
--------------------------- */
.nav-btn-01 {
  line-height: 1.6;
  margin: -10px 0 1.375em 0;
}

.nav-btn-01 + .nav-btn-01 {
  margin-top: -1.375em;
}

.nav-btn-01 > * {
  margin: 10px 0;
}

.nav-btn-01 > * + * {
  margin-left: 30px;
}

.nav-btn-01 a,
.nav-btn-01 button {
  position: relative;
  display: table;
  width: 350px;
  border: 3px solid #474747;
  border-radius: .25rem;
  padding: .78125em 30px;
  background-color: #474747;
  color: #fff;
  font-weight: bold;
  text-align: center;
  -webkit-transition: background-color .2s, color .2s;
  transition: background-color .2s, color .2s;
  will-change: background-color, color;
}

.nav-btn-01 a::after,
.nav-btn-01 button::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 14px;
  display: block;
  width: 12px;
  height: 12px;
  border-top: 3px solid #fff;
  border-right: 3px solid #fff;
  margin-top: -6px;
  -webkit-transition: border-color .2s;
  transition: border-color .2s;
  will-change: border-color;
}

.nav-btn-01 a:hover, .nav-btn-01 a:focus, .nav-btn-01 a:active,
.nav-btn-01 button:hover,
.nav-btn-01 button:focus,
.nav-btn-01 button:active {
  background-color: #fff;
  color: #333;
  text-decoration: none;
}

.nav-btn-01 a:hover::after, .nav-btn-01 a:focus::after, .nav-btn-01 a:active::after,
.nav-btn-01 button:hover::after,
.nav-btn-01 button:focus::after,
.nav-btn-01 button:active::after {
  border-color: #474747;
}

.nav-btn-01 a.fit-width,
.nav-btn-01 button.fit-width {
  width: auto;
  min-width: 350px;
}

.nav-btn-01 a > span,
.nav-btn-01 button > span {
  display: table-cell;
  vertical-align: middle;
}

.nav-btn-01 button > span {
  display: block;
}

.nav-btn-01 em a,
.nav-btn-01 em button {
  border-color: #e9b226;
  background-color: #e9b226;
  color: #333;
  -webkit-transition: background-color .2s;
  transition: background-color .2s;
  will-change: background-color;
}

.nav-btn-01 em a::after,
.nav-btn-01 em button::after {
  border-color: #333;
  -webkit-transition: none;
  transition: none;
}

.nav-btn-01 em a:hover, .nav-btn-01 em a:focus, .nav-btn-01 em a:active,
.nav-btn-01 em button:hover,
.nav-btn-01 em button:focus,
.nav-btn-01 em button:active {
  background-color: #fff;
}

.nav-btn-01 em a:hover::after, .nav-btn-01 em a:focus::after, .nav-btn-01 em a:active::after,
.nav-btn-01 em button:hover::after,
.nav-btn-01 em button:focus::after,
.nav-btn-01 em button:active::after {
  border-color: #474747;
}

.nav-btn-01 em.submit button {
  padding: .95em 30px;
  font-size: 2rem;
}

.nav-btn-01 .return button {
  width: 160px;
  height: auto !important;
  margin-top: 10px;
  margin-bottom: 10px;
}

.nav-btn-01 .return button::after {
  right: inherit;
  left: 14px;
  border-top: 0;
  border-right: 0;
  border-left: 3px solid #fff;
  border-bottom: 3px solid #fff;
}

.nav-btn-01 .return button:hover::after, .nav-btn-01 .return button:focus::after, .nav-btn-01 .return button:active::after {
  border-color: #474747;
}

.nav-btn-01 .link-icon {
  top: .1em;
}

@media only screen and (max-width: 810px) {
  .nav-btn-01 a,
  .nav-btn-01 button {
    width: 330px;
  }
}

@media only screen and (max-width: 768px) {
  .nav-btn-01 > * {
    margin: 8px 0;
    width: 100%;
  }
  .nav-btn-01 > * + * {
    margin-left: 0;
  }
  .nav-btn-01 > * > * {
    width: 100%;
  }
  .nav-btn-01 a,
  .nav-btn-01 button {
    width: 100%;
  }
  .nav-btn-01 a.fit-width,
  .nav-btn-01 button.fit-width {
    width: 100%;
    min-width: inherit;
  }
  .nav-btn-01 a > span,
  .nav-btn-01 button > span {
    display: block;
  }
  .nav-btn-01.inline a,
  .nav-btn-01.inline button {
    height: auto !important;
  }
  .nav-btn-01 .return button {
    width: 100%;
  }
}

.nav-btn-02 {
  position: relative;
  display: inline-block;
  line-height: 1.6;
  margin: 4px .28571em 4px 0;
  border: 1px solid #777;
  border-radius: .2rem;
  padding: .215em 24px .215em 10px;
  background-color: #fff;
  color: #333;
  font-size: 1.4rem;
  text-decoration: none;
  vertical-align: middle;
  -webkit-transition: border-color .2s, background-color .2s, color .2s;
  transition: border-color .2s, background-color .2s, color .2s;
  will-change: border-color, background-color, color;
}

.nav-btn-02::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 10px;
  display: block;
  width: 7px;
  height: 7px;
  margin-top: -4px;
  border-top: 2px solid #777;
  border-right: 2px solid #777;
  -webkit-transition: border-color .2s;
  transition: border-color .2s;
  will-change: border-color;
}

.nav-btn-02:link, .nav-btn-02:visited {
  color: #333;
  text-decoration: none;
}

.nav-btn-02:hover, .nav-btn-02:focus, .nav-btn-02:active {
  border-color: #474747;
  background-color: #474747;
  color: #fff;
}

.nav-btn-02:hover::after, .nav-btn-02:focus::after, .nav-btn-02:active::after {
  border-color: #fff;
}

.nav-btn-02 .link-icon {
  top: .15em;
}

[class*="hdg-section"] .nav-btn-02 {
  margin-left: 12px;
  margin-bottom: 0;
  font-weight: normal;
}

.hdg-section-01 .nav-btn-02,
.hdg-section-02 .nav-btn-02 {
  margin-top: -.4em;
}

.hdg-section-03 .nav-btn-02,
.hdg-section-04 .nav-btn-02 {
  margin-top: -.275em;
}

.hdg-section-05 .nav-btn-02 {
  margin-top: -.125em;
}

@media only screen and (max-width: 768px) {
  .hdg-section-01 .nav-btn-02,
  .hdg-section-02 .nav-btn-02,
  .hdg-section-03 .nav-btn-02 {
    margin-top: -.275em;
  }
  .hdg-section-04 .nav-btn-02,
  .hdg-section-05 .nav-btn-02 {
    margin-top: -.125em;
  }
}

.nav-checkbox-01 {
  padding: .5625em 0;
}

.nav-checkbox-01 label {
  display: block;
  width: 350px;
  margin: 0 auto;
  border: 1px solid #d6d6d6;
  border-radius: .25rem;
  padding: .6875em 10px;
  background-color: #fff;
  font-weight: bold;
  text-align: center;
  -webkit-transition: background-color .2s;
  transition: background-color .2s;
  will-change: background-color;
}

.nav-checkbox-01 label:hover, .nav-checkbox-01 label:focus, .nav-checkbox-01 label:active {
  background-color: #e6e6e6;
}

.nav-checkbox-01 label input[type="checkbox"] {
  margin-right: .25em;
  vertical-align: middle;
}

@media only screen and (max-width: 768px) {
  .nav-checkbox-01 label {
    width: 100%;
  }
}

.nav-mapbtn-01 button {
  position: relative;
  display: inline-block;
  line-height: 1.6;
  margin: 4px .28571em 4px 0;
  border: 1px solid #777;
  border-radius: .2rem;
  padding: .215em 10px .215em 32px;
  background-color: #fff;
  color: #333;
  font-size: 1.4rem;
  text-decoration: none;
  vertical-align: middle;
  -webkit-transition: border-color .2s, background-color .2s, color .2s;
  transition: border-color .2s, background-color .2s, color .2s;
  will-change: border-color, background-color, color;
}

.nav-mapbtn-01 button:hover {
  border-color: #474747;
  background-color: #474747;
  color: #fff;
}

.nav-mapbtn-01 button:active {
  border-color: #777;
  background-color: #fff;
  color: #333;
}

.nav-mapbtn-01 button::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 6px;
  display: block;
  width: 20px;
  height: 20px;
  margin-top: -10px;
  background-image: url(/shared/images/icon-mapbtn-01.png);
  background-repeat: no-repeat;
}

.nav-mapbtn-01 button.show::before {
  background-position: -24px -2px;
}

.nav-mapbtn-01 button.show:hover::before {
  background-position: -2px -2px;
}

.nav-mapbtn-01 button.show:active::before {
  background-position: -24px -2px;
}

.nav-mapbtn-01 button.hide::before {
  background-position: -2px -24px;
}

.nav-mapbtn-01 button.hide:hover::before {
  background-position: -24px -24px;
}

.nav-mapbtn-01 button.hide:active::before {
  background-position: -2px -24px;
}

.static .nav-mapbtn-01 button {
  display: none;
}

.nav-rssbtn-01 {
  line-height: 1.6;
  font-size: 1.2rem;
}

.nav-rssbtn-01 a {
  position: relative;
  display: inline-block;
  margin: 0;
  border: 1px solid #777;
  border-radius: .2rem;
  padding: .375em 6px .375em 24px;
  background-color: rgba(71, 71, 71, 0);
  color: #333;
  text-decoration: none;
  vertical-align: middle;
  -webkit-transition: border-color .2s, background-color .2s, color .2s;
  transition: border-color .2s, background-color .2s, color .2s;
  will-change: border-color, background-color, color;
}

.nav-rssbtn-01 a::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 6px;
  display: block;
  width: 14px;
  height: 14px;
  margin-top: -8px;
  background-image: url(/shared/images/icon-rss-01.png);
  background-repeat: no-repeat;
  background-position: 0 0;
}

.nav-rssbtn-01 a:hover, .nav-rssbtn-01 a:focus, .nav-rssbtn-01 a:active {
  border-color: #474747;
  background-color: #474747;
  color: #fff;
}

.nav-rssbtn-01 a:hover::before, .nav-rssbtn-01 a:focus::before, .nav-rssbtn-01 a:active::before {
  background-position: -14px 0;
}

[class*="hdg-section"] .nav-rssbtn-01 {
  float: right;
  margin-bottom: 0;
  font-weight: normal;
}

.hdg-section-01 .nav-rssbtn-01 {
  margin-top: .55em;
}

.hdg-section-02 .nav-rssbtn-01 {
  margin-top: .35em;
}

.hdg-section-03 .nav-rssbtn-01,
.hdg-section-04 .nav-rssbtn-01 {
  margin-top: .225em;
}

.hdg-section-05 .nav-rssbtn-01 {
  margin-top: .05em;
}

@media only screen and (max-width: 768px) {
  .hdg-section-01 .nav-rssbtn-01 {
    margin-top: .2em;
  }
  .hdg-section-02 .nav-rssbtn-01 {
    margin-top: .35em;
  }
  .hdg-section-03 .nav-rssbtn-01 {
    margin-top: .15em;
  }
  .hdg-section-04 .nav-rssbtn-01,
  .hdg-section-05 .nav-rssbtn-01 {
    margin-top: -.1em;
  }
}

.nav-index-01 {
  line-height: 1.6;
  margin-bottom: 0;
}

.nav-index-01::after {
  content: "";
  display: block;
  width: 31.53153%;
  width: calc((100% - 60px) / 3);
}

.nav-index-01 > li {
  width: 31.53153%;
  width: calc((100% - 60px) / 3);
  margin-bottom: 2em;
  border: 1px solid #d6d6d6;
  padding: 0 27px;
  background-color: #fff;
}

.nav-index-01 > li > .link {
  display: block;
  margin: -1px -28px 0 -28px;
  background-color: #fff;
}

.nav-index-01 > li > .link > .img {
  display: block;
}

.nav-index-01 > li > .link > .img.frame {
  border: 1px solid #d6d6d6;
}

.nav-index-01 > li > .link > .img img {
  width: 100%;
  max-width: inherit;
}

.nav-index-01 > li > .link > .text {
  display: block;
  border-left: 1px solid #d6d6d6;
  border-right: 1px solid #d6d6d6;
  padding: 1.5em 27px 1em 27px;
  text-align: center;
}

.nav-index-01 > li > .link > .text > span {
  color: #000;
  font-size: 2rem;
  font-weight: bold;
}

.nav-index-01 > li > a.link {
  text-decoration: none;
}

.nav-index-01 > li > a.link > .img {
  overflow: hidden;
}

.nav-index-01 > li > a.link > .img img {
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: -webkit-transform .4s;
  transition: transform .4s;
  will-change: transform;
}

.nav-index-01 > li > a.link > .text > span {
  -webkit-transition: color .2s;
  transition: color .2s;
  will-change: color;
}

.nav-index-01 > li > a.link > .text > span::after {
  content: "";
  position: relative;
  top: -1px;
  left: 8px;
  display: inline-block;
  width: 12px;
  height: 12px;
  border-top: 3px solid #20256b;
  border-right: 3px solid #20256b;
  -webkit-transition: left .2s;
  transition: left .2s;
  will-change: left;
}

.nav-index-01 > li > a.link:hover > .img img, .nav-index-01 > li > a.link:focus > .img img, .nav-index-01 > li > a.link:active > .img img {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

.nav-index-01 > li > a.link:hover > .text > span, .nav-index-01 > li > a.link:focus > .text > span, .nav-index-01 > li > a.link:active > .text > span {
  color: #08107b;
}

.nav-index-01 > li > a.link:hover > .text > span::after, .nav-index-01 > li > a.link:focus > .text > span::after, .nav-index-01 > li > a.link:active > .text > span::after {
  left: 12px;
}

.nav-index-01 > li.recruit-new {
  width: 65.76577%;
  width: calc((100% - 15px) / 1.5);
  border: none;
  padding: 0;
}

.nav-index-01 > li.recruit-new > a {
  position: relative;
  -webkit-flex: 6 1 0%;
  flex: 6 1 0%;
  -webkit-align-self: stretch;
  align-self: stretch;
  overflow: hidden;
  background-color: #20256b;
  color: #fff;
  font-size: 2rem;
  text-decoration: none;
}

.nav-index-01 > li.recruit-new > a::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: block;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-image: url(/recruit/images/index-01.jpg);
  background-size: cover;
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: -webkit-transform .4s;
  transition: transform .4s;
  will-change: -webkit-transform, transform;
}

.nav-index-01 > li.recruit-new > a > span {
  position: absolute;
  top: 50%;
  left: 15px;
  right: 15px;
  display: block;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  text-align: center;
}

.nav-index-01 > li.recruit-new > a > span b {
  display: block;
  margin-bottom: 1em;
  text-align: center;
}

.nav-index-01 > li.recruit-new > a > span b::after {
  content: "";
  position: relative;
  top: -.1em;
  left: 0;
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-left: .25em;
  border-top: 3px solid #fff;
  border-right: 3px solid #fff;
  -webkit-transition: left .2s;
  transition: left .2s;
  will-change: left;
}

.nav-index-01 > li.recruit-new > a:hover::before, .nav-index-01 > li.recruit-new > a:focus::before, .nav-index-01 > li.recruit-new > a:active::before {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

.nav-index-01 > li.recruit-new > a:hover > span b::after, .nav-index-01 > li.recruit-new > a:focus > span b::after, .nav-index-01 > li.recruit-new > a:active > span b::after {
  left: 4px;
}

.nav-index-01 > li.recruit-new > div {
  -webkit-flex: 4 1 0%;
  flex: 4 1 0%;
  border: 1px solid #d6d6d6;
  border-left: none;
}

.nav-index-01 > li.recruit-new > div > div {
  -webkit-flex-direction: column;
  flex-direction: column;
  padding: 1.5em 27px 1.5em 28px;
}

.nav-index-01 > li.recruit-new > div > div .list-link-01 {
  margin-bottom: 0;
}

.nav-index-01 > li.recruit-new > div > div .list-link-01 + * {
  margin-top: 1em;
}

.nav-index-01 > li.recruit-new > div > div .nav-btn-01 {
  margin-bottom: 0;
}

.nav-index-01 > li.recruit-new > div > div .nav-btn-01 a {
  min-width: 100%;
}

.nav-index-01 > li.recruit-new > div > div .nav-btn-01 + p {
  font-size: 1.4rem;
}

.nav-index-01 > li.recruit-new > div > div p {
  margin-bottom: 0;
}

.nav-index-01 > li.alternate {
  border: none;
  padding: 0;
}

.nav-index-01 > li.alternate > .link {
  position: relative;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: block;
  margin: 0;
  border: 1px solid #d6d6d6;
}

.nav-index-01 > li.alternate > .link::before, .nav-index-01 > li.alternate > .link::after {
  content: "";
  position: absolute;
  left: -1px;
  right: -1px;
  display: block;
  background-color: #20256b;
}

.nav-index-01 > li.alternate > .link::before {
  top: -1px;
  height: 4px;
}

.nav-index-01 > li.alternate > .link::after {
  bottom: -1px;
  height: 0;
  -webkit-transition: height .1s;
  transition: height .1s;
  will-change: height;
}

.nav-index-01 > li.alternate > .link > .text {
  border-left: none;
  border-right: none;
}

.nav-index-01 > li.alternate > .link > .text::before, .nav-index-01 > li.alternate > .link > .text::after {
  content: "";
  position: absolute;
  top: -1px;
  bottom: -1px;
  display: block;
  width: 0;
  background-color: #20256b;
  -webkit-transition: width .1s;
  transition: width .1s;
  will-change: width;
}

.nav-index-01 > li.alternate > .link > .text::before {
  left: -1px;
}

.nav-index-01 > li.alternate > .link > .text::after {
  right: -1px;
}

.nav-index-01 > li.alternate > .link:hover::after, .nav-index-01 > li.alternate > .link:focus::after, .nav-index-01 > li.alternate > .link:active::after {
  height: 4px;
}

.nav-index-01 > li.alternate > .link:hover > .text::before, .nav-index-01 > li.alternate > .link:hover > .text::after, .nav-index-01 > li.alternate > .link:focus > .text::before, .nav-index-01 > li.alternate > .link:focus > .text::after, .nav-index-01 > li.alternate > .link:active > .text::before, .nav-index-01 > li.alternate > .link:active > .text::after {
  width: 4px;
}

.nav-index-01 > li.alternate > .link .lyt-img-01 {
  padding: 0 19px;
}

.nav-index-01 .link-text-01::before {
  top: .5em;
}

.nav-index-01 .list-link-01 > li > a::before {
  top: .5em;
}

.nav-index-01 .list-link-01 .list-link-01 > li > a::before {
  top: .6em;
}

.nav-index-01 .list-anchor-01 > li > a::before {
  top: .45em;
}

.nav-index-01 .list-bullet-01 > li::before {
  top: .6em;
}

.nav-index-01 .list-bullet-01 .list-bullet-01 > li::before {
  top: .6em;
}

.nav-index-01 .link-icon {
  top: 0;
}

@media only screen and (max-width: 864px) {
  .nav-index-01 > li.recruit-new {
    width: 100%;
  }
}

@media only screen and (max-width: 768px) {
  .nav-index-01 {
    margin-bottom: .5em;
  }
  .nav-index-01::after {
    content: none;
  }
  .nav-index-01 > li {
    width: 48.33333%;
    width: calc((100% - 16px) / 2);
    margin-bottom: 1em;
    padding: 0 19px;
  }
  .nav-index-01 > li > .link {
    margin: -1px -20px 0 -20px;
  }
  .nav-index-01 > li > .link > .text {
    padding: 1.375em 20px 1.125em 20px;
  }
  .nav-index-01 > li > .link > .text > span {
    font-size: 1.8rem;
  }
  .nav-index-01 > li > a.link > .text > span::after {
    top: 0;
  }
  .nav-index-01 > li.recruit-new > a {
    font-size: 1.8rem;
  }
  .nav-index-01 > li.recruit-new > div > div {
    padding: 1.125em 19px;
  }
  .nav-index-01 > li.alternate > .link .lyt-img-01 {
    padding: 0 15px;
  }
}

@media only screen and (max-width: 540px) {
  .nav-index-01 > li.recruit-new {
    display: block;
  }
  .nav-index-01 > li.recruit-new > a {
    display: block;
    height: 9em;
  }
  .nav-index-01 > li.recruit-new > div {
    border-top: none;
    border-left: 1px solid #d6d6d6;
  }
}

@media only screen and (max-width: 480px) {
  .nav-index-01 {
    display: block;
    margin-bottom: 1.5em;
  }
  .nav-index-01 > li {
    width: auto;
  }
}

.nav-index-02 {
  line-height: 1.6;
  margin-bottom: 0;
}

.nav-index-02::after {
  content: "";
  display: block;
  width: 31.53153%;
  width: calc((100% - 60px) / 3);
}

.nav-index-02 > li {
  width: 31.53153%;
  width: calc((100% - 60px) / 3);
  margin-bottom: 2em;
}

.nav-index-02 > li > a,
.nav-index-02 > li > span {
  position: relative;
  display: block;
  border: 1px solid #d6d6d6;
  padding: 1.625em 31px 0 31px;
  color: #333;
  text-decoration: none;
}

.nav-index-02 > li > a::after,
.nav-index-02 > li > span::after {
  content: "";
  position: absolute;
  top: -1px;
  left: -1px;
  right: -1px;
  bottom: -1px;
  display: block;
  border-width: 4px 0 0 0;
  border-style: solid;
  border-color: #20256b;
  cursor: pointer;
}

.nav-index-02 > li > a > .link,
.nav-index-02 > li > span > .link {
  display: block;
  margin-bottom: 1.25em;
  text-align: center;
}

.nav-index-02 > li > a > .link > span,
.nav-index-02 > li > span > .link > span {
  color: #000;
  font-size: 2rem;
  font-weight: bold;
}

.nav-index-02 > li > a > .link .link-icon,
.nav-index-02 > li > span > .link .link-icon {
  top: 0;
}

.nav-index-02 > li > a::after {
  cursor: pointer;
  -webkit-transition: border-width .1s;
  transition: border-width .1s;
  will-change: border-width;
}

.nav-index-02 > li > a > .link > span {
  -webkit-transition: color .2s;
  transition: color .2s;
  will-change: color;
}

.nav-index-02 > li > a > .link > span::after {
  content: "";
  position: relative;
  top: -1px;
  left: 8px;
  display: inline-block;
  width: 12px;
  height: 12px;
  border-top: 3px solid #20256b;
  border-right: 3px solid #20256b;
  -webkit-transition: left .2s;
  transition: left .2s;
  will-change: left;
}

.nav-index-02 > li > a:hover::after, .nav-index-02 > li > a:focus::after, .nav-index-02 > li > a:active::after {
  border-width: 4px;
}

.nav-index-02 > li > a:hover > .link > span, .nav-index-02 > li > a:focus > .link > span, .nav-index-02 > li > a:active > .link > span {
  color: #08107b;
}

.nav-index-02 > li > a:hover > .link > span::after, .nav-index-02 > li > a:focus > .link > span::after, .nav-index-02 > li > a:active > .link > span::after {
  left: 12px;
}

.nav-index-02 > li > span::after {
  cursor: text;
}

.nav-index-02 .link-icon {
  top: 0;
}

@media only screen and (max-width: 768px) {
  .nav-index-02 {
    margin-bottom: .5em;
  }
  .nav-index-02::after {
    content: none;
  }
  .nav-index-02 > li {
    width: 48.33333%;
    width: calc((100% - 16px) / 2);
    margin-bottom: 1em;
  }
  .nav-index-02 > li > a,
  .nav-index-02 > li > span {
    padding: 1.625em 19px 0 19px;
  }
  .nav-index-02 > li > a > .link,
  .nav-index-02 > li > span > .link {
    margin-bottom: 1.25em;
  }
  .nav-index-02 > li > a > .link > span,
  .nav-index-02 > li > span > .link > span {
    font-size: 1.8rem;
  }
  .nav-index-02 > li > a > .link > span::after {
    top: 0;
  }
}

@media only screen and (max-width: 480px) {
  .nav-index-02 {
    display: block;
    margin-bottom: 1.5em;
  }
  .nav-index-02 > li {
    display: block;
    width: auto;
  }
}

.nav-index-03 {
  margin-bottom: 2em;
}

.nav-index-03 > .img-link {
  display: block;
  margin-bottom: .25em;
}

.nav-index-03 > .img-link > span {
  display: block;
}

.nav-index-03 > .img-link > .img {
  overflow: hidden;
  margin-bottom: .75em;
  text-align: center;
}

.nav-index-03 > .img-link > .link {
  line-height: 1.8;
  font-size: 1.8rem;
}

.nav-index-03 > a.img-link {
  color: #333;
  text-decoration: none;
}

.nav-index-03 > a.img-link > .img img {
  background-color: #fff;
  opacity: 1;
  -webkit-transition: opacity .4s;
  transition: opacity .4s;
}

.nav-index-03 > a.img-link > .link {
  position: relative;
  padding-left: 20px;
  color: #08107b;
}

.nav-index-03 > a.img-link > .link::before {
  content: "";
  position: absolute;
  top: .625em;
  left: 1px;
  display: block;
  width: 8px;
  height: 8px;
  border-top: 2px solid #474747;
  border-right: 2px solid #474747;
}

.nav-index-03 > a.img-link:visited > .link {
  color: #73077a;
}

.nav-index-03 > a.img-link:hover > .img img, .nav-index-03 > a.img-link:focus > .img img, .nav-index-03 > a.img-link:active > .img img {
  opacity: .7;
}

.nav-index-03 > a.img-link:hover > .link, .nav-index-03 > a.img-link:focus > .link, .nav-index-03 > a.img-link:active > .link {
  text-decoration: underline;
}

@media only screen and (max-width: 768px) {
  .nav-index-03 > .img-link > .link {
    line-height: 1.6;
  }
  .nav-index-03 > a.img-link > .link::before {
    top: .5em;
  }
}

.nav-index-04 {
  margin-left: -15px;
  margin-right: -15px;
}

.nav-index-04 > li {
  width: 50%;
  margin-bottom: 1.25em;
  padding: 0 15px;
}

.nav-index-04 > li > a {
  position: relative;
  display: table;
  width: 100%;
  line-height: 1.6;
  border: 1px solid #d6d6d6;
  border-radius: .2rem;
  background-color: #fff;
  color: #333;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  -webkit-transition: background-color .2s;
  transition: background-color .2s;
  will-change: background-color;
}

.nav-index-04 > li > a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 16px;
  display: block;
  width: 12px;
  height: 12px;
  margin-top: -6px;
  border-top: 3px solid #20256b;
  border-right: 3px solid #20256b;
  -webkit-transition: right .2s;
  transition: right .2s;
  will-change: right;
}

.nav-index-04 > li > a > span {
  display: table-cell;
  padding: .907em 35px .907em 15px;
  vertical-align: middle;
}

.nav-index-04 > li > a:hover, .nav-index-04 > li > a:focus, .nav-index-04 > li > a:active {
  background-color: #f2f2f2;
}

.nav-index-04 > li > a:hover::after, .nav-index-04 > li > a:focus::after, .nav-index-04 > li > a:active::after {
  right: 12px;
}

.nav-index-04.col3::after {
  content: "";
}

.nav-index-04.col3 > li {
  width: calc(100% / 3);
}

.ie .nav-index-04.col3 > li,
.edge .nav-index-04.col3 > li {
  width: 33.33333%;
}

@media only screen and (max-width: 768px) {
  .nav-index-04 {
    margin-left: 0;
    margin-right: 0;
  }
  .nav-index-04 > li {
    width: 100%;
    margin-bottom: 1em;
    padding: 0;
  }
  .nav-index-04.col3 > li {
    width: 100%;
  }
  .ie .nav-index-04.col3 > li,
  .edge .nav-index-04.col3 > li {
    width: 100%;
  }
}

.nav-index-05 {
  line-height: 1.6;
  margin-bottom: 0;
}

.nav-index-05::after {
  content: "";
  display: block;
  width: 48.64865%;
  width: calc(50% - 15px);
}

.nav-index-05 > li {
  width: 48.64865%;
  width: calc(50% - 15px);
  margin-bottom: 3em;
}

.nav-index-05 > li > .link {
  display: block;
}

.nav-index-05 > li > .link > .img {
  display: block;
}

.nav-index-05 > li > .link > .img img {
  width: 100%;
  max-width: inherit;
  background-color: #fff;
}

.nav-index-05 > li > .link > .text {
  display: block;
  margin-top: 1.25em;
  text-align: center;
}

.nav-index-05 > li > .link > .text > span {
  color: #000;
  font-size: 2rem;
  font-weight: bold;
}

.nav-index-05 > li > a.link {
  text-decoration: none;
}

.nav-index-05 > li > a.link > .img {
  overflow: hidden;
}

.nav-index-05 > li > a.link > .img img {
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: -webkit-transform .4s;
  transition: transform .4s;
  will-change: transform;
}

.nav-index-05 > li > a.link > .text > span {
  -webkit-transition: color .2s;
  transition: color .2s;
  will-change: color;
}

.nav-index-05 > li > a.link > .text > span::after {
  content: "";
  position: relative;
  top: -1px;
  left: 8px;
  display: inline-block;
  width: 12px;
  height: 12px;
  border-top: 3px solid #20256b;
  border-right: 3px solid #20256b;
  -webkit-transition: left .2s;
  transition: left .2s;
  will-change: left;
}

.nav-index-05 > li > a.link:hover > .img img, .nav-index-05 > li > a.link:focus > .img img, .nav-index-05 > li > a.link:active > .img img {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

.nav-index-05 > li > a.link:hover > .text > span, .nav-index-05 > li > a.link:focus > .text > span, .nav-index-05 > li > a.link:active > .text > span {
  color: #08107b;
}

.nav-index-05 > li > a.link:hover > .text > span::after, .nav-index-05 > li > a.link:focus > .text > span::after, .nav-index-05 > li > a.link:active > .text > span::after {
  left: 12px;
}

.nav-index-05 > li > p {
  margin: .75em 0 0 0;
}

.nav-index-05 .link-icon {
  top: .125em;
}

@media only screen and (max-width: 768px) {
  .nav-index-05 {
    display: block;
    margin-bottom: 2em;
  }
  .nav-index-05::after {
    content: none;
  }
  .nav-index-05 > li {
    width: 100%;
    margin-bottom: 2em;
  }
  .nav-index-05 > li > .link > .text {
    margin-top: .5em;
  }
  .nav-index-05 > li > .link > .text > span {
    font-size: 1.8rem;
  }
  .nav-index-05 > li > a.link > .text > span::after {
    left: 6px;
  }
  .nav-index-05 > li > a.link:hover > .text > span::after, .nav-index-05 > li > a.link:focus > .text > span::after, .nav-index-05 > li > a.link:active > .text > span::after {
    left: 10px;
  }
  .nav-index-05 > li > p {
    margin-top: .25em;
  }
}

.nav-index-06 {
  margin: 0 0 2em 0;
}

.nav-index-06 > dt {
  padding: 1em 28px;
  background-color: #20256b;
  color: #fff;
  font-size: 2rem;
  font-weight: bold;
  text-align: center;
}

.nav-index-06 > dt > span {
  position: relative;
  display: inline-block;
  padding-top: 3em;
}

.nav-index-06 > dt > span::before {
  content: "";
  position: absolute;
  top: .6em;
  left: 50%;
  display: block;
  width: 36px;
  height: 36px;
  margin-left: -18px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
}

.nav-index-06 > dd {
  line-height: 1.6;
}

.nav-index-06 > dd > ul,
.nav-index-06 > dd > ol {
  margin-bottom: 0;
}

.nav-index-06 > dd > ul > li,
.nav-index-06 > dd > ol > li {
  display: table;
  width: 100%;
  margin-top: 1px;
}

.nav-index-06 > dd > ul > li > a,
.nav-index-06 > dd > ol > li > a {
  position: relative;
  display: table-cell;
  padding: .9695em 38px .9695em 28px;
  background-color: #fff;
  vertical-align: middle;
}

.nav-index-06 > dd > ul > li > a::after,
.nav-index-06 > dd > ol > li > a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 20px;
  display: block;
  width: 12px;
  height: 12px;
  margin-top: -6px;
  border-top: 3px solid #20256b;
  border-right: 3px solid #20256b;
  -webkit-transition: right .2s;
  transition: right .2s;
  will-change: right;
}

.nav-index-06 > dd > ul > li > a:hover::after, .nav-index-06 > dd > ul > li > a:focus::after, .nav-index-06 > dd > ul > li > a:active::after,
.nav-index-06 > dd > ol > li > a:hover::after,
.nav-index-06 > dd > ol > li > a:focus::after,
.nav-index-06 > dd > ol > li > a:active::after {
  right: 16px;
}

.nav-index-06 > dd > ul > li > a .link-icon,
.nav-index-06 > dd > ol > li > a .link-icon {
  top: .1em;
}

.nav-index-06 > dd > ul > li.special > a,
.nav-index-06 > dd > ol > li.special > a {
  background-color: #e9b226;
  color: #191919;
}

.nav-index-06 > dd > ul > li.special > a::after,
.nav-index-06 > dd > ol > li.special > a::after {
  border-top-color: #fff;
  border-right-color: #fff;
}

.nav-index-06.download > dt > span::before {
  background-image: url(/shared/images/icon-download-01.png);
}

.nav-index-06.ranking > dt > span::before {
  background-image: url(/shared/images/icon-trophy-01.png);
}

.nav-index-06.ranking > dd > ol {
  counter-reset: ranking;
}

.nav-index-06.ranking > dd > ol > li > a {
  padding-left: 62px;
}

.nav-index-06.ranking > dd > ol > li > a::before {
  counter-increment: ranking;
  content: counter(ranking);
  position: absolute;
  top: 50%;
  left: 28px;
  display: block;
  width: 22px;
  height: 22px;
  line-height: 22px;
  margin-top: -11px;
  background-color: #d6d6d6;
  color: #666;
  font-size: 1.4rem;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
}

.nav-index-06.ranking > dd > ol > li:nth-child(1) > a::before, .nav-index-06.ranking > dd > ol > li:nth-child(2) > a::before, .nav-index-06.ranking > dd > ol > li:nth-child(3) > a::before {
  color: #333;
}

.nav-index-06.ranking > dd > ol > li:nth-child(1) > a::before {
  background-color: #c2b561;
}

.nav-index-06.ranking > dd > ol > li:nth-child(2) > a::before {
  background-color: #a9b1b8;
}

.nav-index-06.ranking > dd > ol > li:nth-child(3) > a::before {
  background-color: #bd9771;
}

@media only screen and (max-width: 768px) {
  .nav-index-06 {
    margin-bottom: 2.5em;
  }
  .nav-index-06 > dt {
    padding: 1.75em 20px;
    font-size: 1.8rem;
  }
  .nav-index-06 > dt > span {
    padding-top: 0;
    padding-left: 48px;
  }
  .nav-index-06 > dt > span::before {
    top: 50%;
    left: 0;
    margin-top: -18px;
    margin-left: 0;
  }
  .nav-index-06 > dd > ul > li > a,
  .nav-index-06 > dd > ol > li > a {
    padding: .9695em 32px .9695em 20px;
  }
  .nav-index-06 > dd > ul > li > a::after,
  .nav-index-06 > dd > ol > li > a::after {
    right: 16px;
  }
  .nav-index-06 > dd > ul > li > a:hover::after, .nav-index-06 > dd > ul > li > a:focus::after, .nav-index-06 > dd > ul > li > a:active::after,
  .nav-index-06 > dd > ol > li > a:hover::after,
  .nav-index-06 > dd > ol > li > a:focus::after,
  .nav-index-06 > dd > ol > li > a:active::after {
    right: 12px;
  }
  .nav-index-06 > dd > ul > li > a .link-icon,
  .nav-index-06 > dd > ol > li > a .link-icon {
    top: .1em;
  }
  .nav-index-06.ranking > dd > ol > li > a {
    padding-left: 54px;
  }
  .nav-index-06.ranking > dd > ol > li > a::before {
    left: 20px;
  }
}

@media only screen and (max-width: 640px) {
  .nav-index-06.ranking {
    margin-top: -1.4375em;
  }
}

.nav-index-07 {
  margin-bottom: 0;
}

.nav-index-07::after {
  content: "";
  display: block;
  width: 31.53153%;
  width: calc((100% - 60px) / 3);
}

.nav-index-07 > li {
  position: relative;
  width: 31.53153%;
  width: calc((100% - 60px) / 3);
  margin-bottom: 2em;
  border: 1px solid #d6d6d6;
  padding: 1.625em 31px .01em 31px;
}

.nav-index-07 > li::before {
  content: "";
  position: absolute;
  top: -1px;
  left: -1px;
  right: -1px;
  display: block;
  height: 4px;
  background-color: #08107b;
}

.nav-index-07 > li.governance::before {
  background-color: #777;
}

.nav-index-07 > li.social::before {
  background-color: #e9b226;
}

.nav-index-07 > li.environment::before {
  background-color: #00abff;
}

.nav-index-07 > li > .hdg {
  display: block;
  margin-bottom: .75em;
  color: #000;
  font-size: 2rem;
  text-align: center;
}

.nav-index-07 .lyt-img-02.img-l > .lyt-img-01 {
  margin-right: 20px;
}

.nav-index-07 .lyt-img-02.img-r > .lyt-img-01 {
  margin-left: 20px;
}

@media only screen and (max-width: 980px) {
  .nav-index-07 .lyt-img-02 > .lyt-img-01 {
    width: auto !important;
    max-width: inherit;
    margin-bottom: 1.5em;
    padding-top: 0;
  }
  .nav-index-07 .lyt-img-02.img-l > .lyt-img-01, .nav-index-07 .lyt-img-02.img-r > .lyt-img-01 {
    float: none;
    margin-right: 0;
    margin-left: 0;
  }
  .nav-index-07 .lyt-img-02.parallel > .content {
    overflow: inherit;
  }
  .nav-index-07 .lyt-img-02.reverse {
    display: table;
    table-layout: fixed;
    width: 100%;
    margin-bottom: 1.5em;
  }
  .nav-index-07 .lyt-img-02.reverse > .lyt-img-01 {
    display: table-row;
  }
  .nav-index-07 .lyt-img-02.reverse > .content {
    display: table-caption;
  }
}

@media only screen and (max-width: 768px) {
  .nav-index-07 {
    margin-bottom: .5em;
  }
  .nav-index-07::after {
    content: none;
  }
  .nav-index-07 > li {
    width: 48.33333%;
    width: calc((100% - 16px) / 2);
    margin-bottom: 1em;
    padding: 1.625em 19px .01em 19px;
  }
  .nav-index-07 > li > .hdg {
    font-size: 1.8rem;
  }
}

@media only screen and (max-width: 480px) {
  .nav-index-07 {
    display: block;
    margin-bottom: 1.5em;
  }
  .nav-index-07 > li {
    display: block;
    width: auto;
  }
}

.nav-tab-01 {
  line-height: 1.6;
  margin-bottom: 2em;
}

.nav-tab-01 > li {
  width: calc(100% / 3);
  padding: 0 0 1px 1px;
}

.nav-tab-01 > li:nth-child(3n+1) {
  padding-left: 0;
}

.nav-tab-01 > li > a {
  position: relative;
  display: block;
  padding: .4695em 8px;
  background-color: #e6e6e6;
  color: #333;
  text-align: center;
  text-decoration: none;
  -webkit-transition: background-color .2s, color .2s;
  transition: background-color .2s, color .2s;
  will-change: background-color, color;
}

.nav-tab-01 > li > a > small {
  display: block;
  margin-top: .14286em;
  color: #666;
  -webkit-transition: color .2s;
  transition: color .2s;
  will-change: color;
}

.nav-tab-01 > li > a:hover, .nav-tab-01 > li > a:focus, .nav-tab-01 > li > a:active {
  background-color: #777;
  color: #fff;
}

.nav-tab-01 > li > a:hover > small, .nav-tab-01 > li > a:focus > small, .nav-tab-01 > li > a:active > small {
  color: #ccc;
}

.nav-tab-01 > li > a.current {
  background-color: #474747;
  color: #fff;
}

.nav-tab-01 > li > a.current::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -8px;
  z-index: 2;
  display: block;
  width: 0;
  height: 0;
  margin-left: -8px;
  border-style: solid;
  border-width: 8px 8px 0 8px;
  border-color: #474747 transparent transparent transparent;
}

.nav-tab-01 > li > a.current > small {
  color: #ccc;
}

.nav-tab-01 .link-icon {
  top: .125em;
}

.ie .nav-tab-01 > li,
.edge .nav-tab-01 > li {
  width: 33.33333%;
}

@media only screen and (max-width: 768px) {
  .nav-tab-01 > li > a {
    font-size: 1.4rem;
  }
  .nav-tab-01 > li > a > small {
    font-size: 1.2rem;
  }
}

.nav-pager-01 {
  line-height: 2.5;
  margin: 2em 0;
}

.nav-pager-01 a {
  display: block;
  width: 40px;
  height: 40px;
  overflow: hidden;
  border-radius: 50%;
  background-color: #fff;
  color: #333;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  -webkit-transition: background-color .2s;
  transition: background-color .2s;
  will-change: background-color;
}

.nav-pager-01 a:hover, .nav-pager-01 a:focus, .nav-pager-01 a:active {
  background-color: #e6e6e6;
}

.nav-pager-01 a.current {
  background-color: #777;
  color: #fff;
}

.nav-pager-01 > li.prev > a, .nav-pager-01 > li.next > a {
  position: relative;
}

.nav-pager-01 > li.prev > a::before, .nav-pager-01 > li.next > a::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 8px;
  height: 8px;
  margin-top: -4px;
}

.nav-pager-01 > li.prev {
  margin-right: .3125em;
}

.nav-pager-01 > li.prev > a::before {
  margin-left: -3px;
  border-left: 2px solid #474747;
  border-bottom: 2px solid #474747;
}

.nav-pager-01 > li.next {
  margin-left: .3125em;
}

.nav-pager-01 > li.next > a::before {
  margin-left: -5px;
  border-top: 2px solid #474747;
  border-right: 2px solid #474747;
}

.nav-pager-01 > li > ul {
  margin-bottom: 0;
}

.nav-pager-01 > li > ul > li {
  margin: 0 .15625em;
}

@media only screen and (max-width: 768px) {
  .nav-pager-01 {
    line-height: 2.25;
  }
  .nav-pager-01 a {
    width: 36px;
    height: 36px;
  }
  .nav-pager-01 > li.prev {
    margin-right: .25em;
  }
  .nav-pager-01 > li.next {
    margin-left: .25em;
  }
  .nav-pager-01 > li > ul > li {
    margin: 0 .125em;
  }
}

.nav-search-01 {
  margin-bottom: 3em;
  padding: 1.5em 15px;
  background-color: #f2f2f2;
}

.nav-search-01 > .col {
  margin: .5em 15px;
}

.nav-search-01 > .select {
  width: 32.40741%;
}

.nav-search-01 > .select .input {
  position: relative;
  z-index: 1;
  display: block;
  width: calc(100% - 72px);
  background-color: #fff;
}

.nav-search-01 > .select .input::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 9px;
  z-index: 2;
  display: block;
  margin-top: -4px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 7px 3px 0 3px;
  border-color: #000 transparent transparent transparent;
}

.nav-search-01 > .select .input select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  position: relative;
  z-index: 3;
  display: block;
  height: 40px;
  width: 100%;
  border-radius: 0;
  border: 1px solid #d6d6d6;
  border-right-color: transparent;
  padding: 0 24px 0 8px;
  background-color: transparent;
  -webkit-transition: border-color .2s;
  transition: border-color .2s;
  will-change: border-color;
}

.nav-search-01 > .select .input select:hover, .nav-search-01 > .select .input select:focus, .nav-search-01 > .select .input select:active {
  border-color: #474747;
}

.nav-search-01 > .select .btn {
  display: block;
  line-height: 2;
  width: 72px;
  height: 40px;
  border: 1px solid #474747;
  padding: .1875em 6px;
  background-color: #474747;
  color: #fff;
  text-align: center;
  text-decoration: none;
  -webkit-transition: background-color .2s, color .2s;
  transition: background-color .2s, color .2s;
  will-change: background-color, color;
}

.nav-search-01 > .select .btn:hover, .nav-search-01 > .select .btn:focus, .nav-search-01 > .select .btn:active {
  background-color: #fff;
  color: #333;
}

.nav-search-01 > .select .btn[disabled] {
  opacity: .2;
  cursor: default;
}

.nav-search-01 > .select .btn[disabled]:hover, .nav-search-01 > .select .btn[disabled]:focus, .nav-search-01 > .select .btn[disabled]:active {
  background-color: #474747;
  color: #fff;
}

.nav-search-01 .list {
  margin-left: 10px;
  margin-right: 10px;
}

.nav-search-01 .list ul {
  min-width: 460px;
  line-height: 1.625;
  margin: .4375em 0;
}

.nav-search-01 .list ul > li {
  position: relative;
  margin-left: .625em;
  padding-left: .6875em;
}

.nav-search-01 .list ul > li::before {
  content: "";
  position: absolute;
  top: .1875em;
  left: 0;
  bottom: .1875em;
  display: block;
  width: 1px;
  background-color: #d6d6d6;
}

.nav-search-01 .list ul > li:first-child {
  margin-left: 0;
  padding-left: 0;
}

.nav-search-01 .list ul > li:first-child::before {
  content: none;
}

.nav-search-01 .list ul > li > a {
  display: inline-block;
  border-radius: .2rem;
  padding: 0 .3125em;
}

.nav-search-01 .list ul > li > a.current {
  background-color: #777;
  color: #fff;
  text-decoration: none;
}

.nav-search-01 .nav-rssbtn-01 {
  margin-top: .66667em;
  margin-bottom: .66667em;
}

.nav-search-01 .nav-rssbtn-01 > a {
  margin: .41667em 0;
}

.ie .nav-search-01 > .select .input select {
  padding-right: 0;
}

.edge .nav-search-01 > .select .input select {
  padding-top: .5em;
}

.static .nav-search-01 {
  display: none;
}

@media only screen and (max-width: 980px) {
  .nav-search-01 > .select {
    width: 40%;
  }
}

@media only screen and (max-width: 768px) {
  .nav-search-01 {
    display: block;
    line-height: 2;
    padding: .01em 20px;
  }
  .nav-search-01 > .col {
    margin: 1em 0;
  }
  .nav-search-01 > .select {
    width: 100%;
  }
  .nav-search-01 .list ul {
    display: block;
    min-width: inherit;
  }
  .nav-search-01 .list ul > li {
    margin-top: .25em;
    margin-left: 0;
    padding-left: 0;
  }
  .nav-search-01 .list ul > li:first-child {
    margin-top: 0;
  }
  .nav-search-01 .list ul > li::before {
    content: none;
  }
  .nav-search-01 .list ul > li > a {
    position: relative;
    padding-left: 24px;
  }
  .nav-search-01 .list ul > li > a::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 6px;
    display: block;
    width: 8px;
    height: 8px;
    margin-top: -4px;
    border-top: 2px solid #474747;
    border-right: 2px solid #474747;
  }
  .nav-search-01 .list ul > li > a.current::before {
    border-color: #fff;
  }
  .nav-search-01 .nav-rssbtn-01 {
    margin: 1.33333em 0;
    text-align: center;
  }
  .nav-search-01 .nav-rssbtn-01 > a {
    margin: 0;
  }
}

/* ===========================
table
--------------------------- */
.w5 {
  width: 5%;
}

.w10 {
  width: 10%;
}

.w15 {
  width: 15%;
}

.w20 {
  width: 20%;
}

.w25 {
  width: 25%;
}

.w30 {
  width: 30%;
}

.w35 {
  width: 35%;
}

.w40 {
  width: 40%;
}

.w45 {
  width: 45%;
}

.w50 {
  width: 50%;
}

.w55 {
  width: 55%;
}

.w60 {
  width: 60%;
}

.w65 {
  width: 65%;
}

.w70 {
  width: 70%;
}

.w75 {
  width: 75%;
}

.w80 {
  width: 80%;
}

.w85 {
  width: 85%;
}

.w90 {
  width: 90%;
}

.w95 {
  width: 95%;
}

.tbl-data-01 {
  width: 100%;
  line-height: 1.6;
  border-top: 1px solid #d6d6d6;
  border-left: 1px solid #d6d6d6;
}

.tbl-data-01 th,
.tbl-data-01 td {
  border-right: 1px solid #d6d6d6;
  border-bottom: 1px solid #d6d6d6;
  padding: .9375em 20px;
  text-align: left;
  vertical-align: top;
}

.tbl-data-01 th > *:last-child,
.tbl-data-01 td > *:last-child {
  margin-bottom: 0;
}

.tbl-data-01 th {
  background-color: #f2f2f2;
  font-weight: bold;
}

.tbl-data-01 > thead th,
.tbl-data-01 > thead td {
  background-color: #f2f2f2;
  text-align: center;
  vertical-align: middle;
}

.tbl-data-01 > thead + tbody th {
  background-color: #fafafa;
}

.tbl-data-01 .link-text-01::before {
  top: .5em;
}

.tbl-data-01 .list-link-01 > li > a::before {
  top: .5em;
}

.tbl-data-01 .list-link-01 .list-link-01 > li > a::before {
  top: .6em;
}

.tbl-data-01 .list-anchor-01 > li > a::before {
  top: .45em;
}

.tbl-data-01 .list-bullet-01 > li::before {
  top: .6em;
}

.tbl-data-01 .list-bullet-01 .list-bullet-01 > li::before {
  top: .6em;
}

.tbl-data-01 .link-icon {
  top: .125em;
}

@media only screen and (max-width: 768px) {
  .tbl-data-01 th,
  .tbl-data-01 td {
    padding-left: 8px;
    padding-right: 8px;
    font-size: 1.4rem;
  }
}

.tbl-data-01-caption {
  margin-bottom: .5625em;
  text-align: right;
}

.tbl-overflow-01 {
  margin-bottom: 1.4375em;
}

.tbl-overflow-01 .notice {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: none;
  margin-bottom: 0;
}

.tbl-overflow-01 table {
  margin-bottom: 0;
}

@media only screen and (max-width: 600px) {
  .tbl-overflow-01 {
    position: relative;
    overflow-x: scroll;
  }
  .tbl-overflow-01 .notice {
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    display: -webkit-flex;
    display: flex;
  }
  .tbl-overflow-01 .notice::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 1;
    width: 800px;
    background-color: rgba(255, 255, 255, .5);
  }
  .tbl-overflow-01 .notice span {
    position: relative;
    z-index: 2;
    display: block;
    border-radius: 2em;
    padding: .4695em 16px;
    background-color: rgba(0, 0, 0, .75);
    color: #fff;
  }
  .tbl-overflow-01 .notice span::before, .tbl-overflow-01 .notice span::after {
    content: "";
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-top: -5.5px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
  }
  .tbl-overflow-01 .notice span::before {
    margin-right: 5px;
    border-left: 2px solid #fff;
    border-bottom: 2px solid #fff;
  }
  .tbl-overflow-01 .notice span::after {
    margin-left: 5px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
  }
  .tbl-overflow-01 table {
    width: 800px;
  }
  .tbl-overflow-01.swiped .notice {
    display: none;
  }
}

/* ===========================
others
--------------------------- */
.icon {
  vertical-align: text-top;
}

.area-embed-news .no-hits {
  margin-bottom: 3em;
  text-align: center;
}

.form-search {
  margin: 2em 0;
  background-color: #f2f2f2;
}

.form-search > .form-search-inner {
  padding: .01em 2em;
}

.form-search .form-search-ui {
  margin: 0 -15px;
  padding: 2em 0;
}

.form-search .form-search-ui > p {
  margin: 0 15px;
}

.form-search .form-search-ui .form-search-input {
  width: calc(85.50186% - 285px);
}

.form-search .form-search-ui .form-search-input input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  display: block;
  width: 74.99999%;
  border-radius: 0;
  border: 1px solid #fff;
  padding: .2785em .5em;
  background-color: #fff;
  font-size: 1.8rem;
}

.form-search .form-search-ui .form-search-input button {
  display: block;
  width: 24.99999%;
  border: 1px solid #474747;
  padding: .4375em .0625em;
  background-color: #474747;
  color: #fff;
  text-align: center;
  -webkit-transition: background-color .2s, color .2s;
  transition: background-color .2s, color .2s;
  will-change: background-color, color;
}

.form-search .form-search-ui .form-search-input button::before {
  content: "";
  position: relative;
  top: .0625em;
  display: inline-block;
  width: 14px;
  height: 14px;
  margin-right: .375em;
  background: url(/shared/images/icon-loupe-03.png) no-repeat 0 0;
  background-size: cover;
}

.form-search .form-search-ui .form-search-input button:hover, .form-search .form-search-ui .form-search-input button:focus, .form-search .form-search-ui .form-search-input button:active {
  background-color: #fff;
  color: #333;
}

.form-search .form-search-ui .form-search-input button:hover::before, .form-search .form-search-ui .form-search-input button:focus::before, .form-search .form-search-ui .form-search-input button:active::before {
  background-image: url(/shared/images/icon-loupe-01.png);
}

.form-search .form-search-ui .form-search-option-ui {
  width: 255px;
}

.form-search .form-search-ui .form-search-option-ui button {
  position: relative;
  display: block;
  width: 100%;
  border-radius: .2rem;
  border: 1px solid #d6d6d6;
  padding: .4375em 31px;
  background-color: #fff;
  font-weight: bold;
  text-align: center;
  -webkit-transition: background-color .2s;
  transition: background-color .2s;
  will-change: background-color;
}

.form-search .form-search-ui .form-search-option-ui button::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 14px;
  display: block;
  width: 12px;
  height: 12px;
  margin-top: -4px;
  border-top: 3px solid #20256b;
  border-right: 3px solid #20256b;
}

.form-search .form-search-ui .form-search-option-ui button:hover, .form-search .form-search-ui .form-search-option-ui button:focus, .form-search .form-search-ui .form-search-option-ui button:active {
  background-color: #e6e6e6;
}

.form-search .form-search-ui .form-search-option-ui button[aria-expanded="false"]::after {
  margin-top: -10px;
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
}

.form-search .form-search-option {
  position: relative;
  margin-bottom: 0;
  padding-bottom: 2em;
}

.form-search .form-search-option > dt {
  position: absolute;
  left: 0;
  width: 180px;
  padding-top: .5em;
  font-weight: bold;
}

.form-search .form-search-option > dd {
  margin-bottom: 0;
  border-bottom: 1px solid #d6d6d6;
  padding: .5em 0 .5em 180px;
}

.form-search .form-search-option > dd:first-of-type {
  border-top: 1px solid #d6d6d6;
}

.form-search .form-search-option > dd > ul {
  margin-bottom: 0;
}

.form-search .form-search-option > dd > ul > li {
  float: left;
  margin-right: 24px;
}

.form-search .form-search-option > dd > ul > li input[type="checkbox"],
.form-search .form-search-option > dd > ul > li input[type="radio"] {
  position: relative;
  top: -.0625em;
  vertical-align: baseline;
}

.form-search .form-search-option[aria-expanded="false"] {
  display: none;
}

.ie .form-search .form-search-option > dd > ul > li input[type="checkbox"],
.ie .form-search .form-search-option > dd > ul > li input[type="radio"],
.edge .form-search .form-search-option > dd > ul > li input[type="checkbox"],
.edge .form-search .form-search-option > dd > ul > li input[type="radio"] {
  top: 0;
}

@media only screen and (max-width: 768px) {
  .form-search {
    margin: 1.5em 0;
  }
  .form-search > .form-search-inner {
    padding: .01em 1.25em;
  }
  .form-search .form-search-ui {
    display: block;
    margin: 0;
    padding: 1.25em 0;
  }
  .form-search .form-search-ui > p {
    margin: 0;
  }
  .form-search .form-search-ui > p + p {
    margin-top: 1em;
  }
  .form-search .form-search-ui .form-search-input {
    width: 100%;
  }
  .form-search .form-search-ui .form-search-input input {
    width: calc(100% - 76px);
    padding: .8575em .5em;
    font-size: 1.4rem;
  }
  .form-search .form-search-ui .form-search-input button {
    width: 76px;
    padding: .6565em .0625em;
  }
  .form-search .form-search-ui .form-search-input button::before {
    margin-right: .25em;
  }
  .form-search .form-search-ui .form-search-option-ui {
    width: 100%;
  }
  .form-search .form-search-ui .form-search-option-ui button {
    padding: .6565em 29px;
  }
  .form-search .form-search-ui .form-search-option-ui button::after {
    right: 12px;
  }
  .form-search .form-search-option {
    padding-bottom: 1.42857em;
    font-size: 1.4rem;
  }
  .form-search .form-search-option > dt {
    position: static;
    width: auto;
    padding-top: .75em;
  }
  .form-search .form-search-option > dt:first-of-type {
    border-top: 1px solid #d6d6d6;
  }
  .form-search .form-search-option > dd {
    padding: .5em 0;
  }
  .form-search .form-search-option > dd:first-of-type {
    border-top: none;
  }
  .form-search .form-search-option > dd > ul > li {
    margin: 0 20px .35714em 0;
  }
  .form-search .form-search-option > dd > ul > li input[type="checkbox"],
  .form-search .form-search-option > dd > ul > li input[type="radio"] {
    top: .10714em;
  }
  .ie .form-search .form-search-option > dd > ul > li input[type="checkbox"],
  .ie .form-search .form-search-option > dd > ul > li input[type="radio"],
  .edge .form-search .form-search-option > dd > ul > li input[type="checkbox"],
  .edge .form-search .form-search-option > dd > ul > li input[type="radio"] {
    top: .10714em;
  }
}

.form-lyt-01 {
  margin: 4.25em 0 2.5em 0;
  border-bottom: 1px solid #d6d6d6;
}

.form-lyt-01 > li {
  border-top: 1px solid #d6d6d6;
  padding: 1.25em 20px;
}

.form-lyt-01 > li.error {
  background-color: #fbebef;
}

.form-lyt-01 > li.error .pgh-error-01 {
  margin-bottom: .5em;
  font-weight: bold;
}

.form-lyt-01 > li > label,
.form-lyt-01 > li > span {
  position: relative;
  display: block;
  width: 360px;
  padding-right: 30px;
  font-weight: bold;
}

.form-lyt-01 > li > label .label-required-01,
.form-lyt-01 > li > span .label-required-01 {
  position: absolute;
  top: 0;
  right: 30px;
  margin: 0;
}

.form-lyt-01 > li > div p:first-child {
  margin-top: -.25em;
}

.form-lyt-01 > li > div p:only-child {
  margin-top: 0;
  margin-bottom: 0;
}

.form-lyt-01 > li > div p:last-child {
  margin-bottom: 0;
}

.form-lyt-01 .input-01,
.form-lyt-01 .input-02,
.form-lyt-01 .input-03,
.form-lyt-01 .select select,
.form-lyt-01 .textarea {
  display: inline-block;
  border: 1px solid #d6d6d6;
  background-color: #fff;
}

.form-lyt-01 .input-01,
.form-lyt-01 .input-02,
.form-lyt-01 .input-03,
.form-lyt-01 .textarea {
  padding: 0 11px;
  -webkit-transition: border-color .2s, background-color .2s;
  transition: border-color .2s, background-color .2s;
  will-change: border-color, background-color;
}

.form-lyt-01 .input-01:hover, .form-lyt-01 .input-01:active, .form-lyt-01 .input-01:focus,
.form-lyt-01 .input-02:hover,
.form-lyt-01 .input-02:active,
.form-lyt-01 .input-02:focus,
.form-lyt-01 .input-03:hover,
.form-lyt-01 .input-03:active,
.form-lyt-01 .input-03:focus,
.form-lyt-01 .textarea:hover,
.form-lyt-01 .textarea:active,
.form-lyt-01 .textarea:focus {
  border-color: #474747;
}

.form-lyt-01 .input-01:focus,
.form-lyt-01 .input-02:focus,
.form-lyt-01 .input-03:focus,
.form-lyt-01 .textarea:focus {
  background-color: #fdf7e9;
}

.form-lyt-01 .input-01,
.form-lyt-01 .input-02,
.form-lyt-01 .input-03 {
  width: 100%;
  height: 3em;
}

.form-lyt-01 .input-02 {
  max-width: 360px;
}

.form-lyt-01 .input-03 {
  max-width: 240px;
}

.form-lyt-01 .select {
  position: relative;
  z-index: 1;
  display: inline-block;
  background-color: #fff;
}

.form-lyt-01 .select::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 10px;
  z-index: 2;
  display: block;
  width: 0;
  height: 0;
  margin-top: -4px;
  border-style: solid;
  border-width: 7px 3px 0 3px;
  border-color: #000 transparent transparent transparent;
}

.form-lyt-01 .select select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  position: relative;
  z-index: 3;
  display: block;
  width: 240px;
  height: 3em;
  border-radius: 0;
  padding: 0 23px 0 11px;
  background-color: transparent;
  -webkit-transition: border-color .2s;
  transition: border-color .2s;
  will-change: border-color;
}

.form-lyt-01 .select select:hover, .form-lyt-01 .select select:active, .form-lyt-01 .select select:focus {
  border-color: #474747;
}

.form-lyt-01 .textarea {
  display: block;
  width: 100%;
  height: 10em;
}

.form-lyt-01 .btn {
  display: inline-block;
  height: 3em;
  margin-left: .5em;
  border: 1px solid #474747;
  border-radius: .25rem;
  padding: 0 11px;
  background-color: #474747;
  color: #fff;
  -webkit-transition: background-color .2s, color .2s;
  transition: background-color .2s, color .2s;
  will-change: background-color, color;
}

.form-lyt-01 .btn:hover, .form-lyt-01 .btn:active, .form-lyt-01 .btn:focus {
  background-color: #fff;
  color: #333;
}

.form-lyt-01 .example {
  margin-bottom: .25em;
  color: #666;
  font-size: 1.4rem;
}

.ie .form-lyt-01 .select select {
  padding-right: 0;
}

.edge .form-lyt-01 .select select {
  padding-top: .5em;
}

@media only screen and (max-width: 980px) {
  .form-lyt-01 > li > label > span {
    width: 280px;
  }
}

@media only screen and (max-width: 768px) {
  .form-lyt-01 {
    margin: 2.5em 0 1.75em 0;
  }
  .form-lyt-01 > li {
    display: block;
  }
  .form-lyt-01 > li > label,
  .form-lyt-01 > li > span {
    width: auto;
    margin-bottom: 1em;
    padding-right: 50px;
  }
  .form-lyt-01 > li > label .label-required-01,
  .form-lyt-01 > li > span .label-required-01 {
    right: 0;
  }
  .form-lyt-01 .input-02,
  .form-lyt-01 .input-03 {
    max-width: inherit;
  }
  .form-lyt-01 .select {
    display: block;
    width: 100%;
  }
  .form-lyt-01 .select select {
    width: 100%;
  }
  .form-lyt-01 .btn {
    display: block;
    width: 100%;
    margin: .5em 0 0 0;
  }
}

.label-required-01 {
  position: relative;
  top: -.125em;
  display: inline-block;
  line-height: 1.75;
  margin: 0 .5em;
  padding: 0 .5em;
  background-color: #cc0030;
  color: #fff;
  font-size: 1.3rem;
  font-weight: normal;
}

#modal-blind {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9997;
  display: none;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, .8);
  opacity: 0;
  -webkit-transition: opacity .4s;
  transition: opacity .4s;
}

#modal-root {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9998;
  display: none;
  box-shadow: 0 0 2em #292929;
  background-color: #fff;
  opacity: 0;
  -webkit-transition: opacity .4s;
  transition: opacity .4s;
}

#modal-img {
  text-align: center;
}

#modal-content > * {
  padding-left: 32px;
  padding-right: 32px;
}

#modal-content #modal-title,
#modal-content #modal-author,
#modal-content #modal-comment,
#modal-content #modal-equip {
  padding-top: .5em;
  margin-bottom: 0;
}

#modal-content #modal-title:first-child,
#modal-content #modal-author:first-child,
#modal-content #modal-comment:first-child,
#modal-content #modal-equip:first-child {
  padding-top: 1.5em;
}

#modal-content #modal-title:last-child,
#modal-content #modal-author:last-child,
#modal-content #modal-comment:last-child,
#modal-content #modal-equip:last-child {
  padding-bottom: 1.5em;
}

#modal-content #modal-title {
  font-weight: bold;
}

#modal-content #modal-equip {
  color: #666;
  font-size: 1.4rem;
}

#modal-next,
#modal-prev {
  position: absolute;
  z-index: 9999;
  display: block;
  width: 56px;
  height: 56px;
  overflow: hidden;
  margin-top: -28px;
  border: 0;
  border-radius: 28px;
  padding: 0;
  background-color: transparent;
  -webkit-transition: background-color .2s;
  transition: background-color .2s;
  will-change: background-color;
}

#modal-next::before,
#modal-prev::before {
  content: "";
  position: absolute;
  display: block;
  width: 14px;
  height: 14px;
  margin-top: -7px;
}

#modal-next:hover, #modal-next:focus, #modal-next:active,
#modal-prev:hover,
#modal-prev:focus,
#modal-prev:active {
  background-color: rgba(0, 0, 0, .8);
}

#modal-next {
  right: -90px;
}

#modal-next::before {
  right: 24px;
  border-top: 3px solid #fff;
  border-right: 3px solid #fff;
}

#modal-prev {
  left: -90px;
}

#modal-prev::before {
  left: 24px;
  border-left: 3px solid #fff;
  border-bottom: 3px solid #fff;
}

#modal-close {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  margin: 0;
  border: none;
  padding: .57143em 8px .57143em 36px;
  background-color: rgba(0, 0, 0, .4);
  color: #fff;
  font-size: 1.4rem;
  -webkit-transition: background-color .2s;
  transition: background-color .2s;
  will-change: background-color;
}

#modal-close::before, #modal-close::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 10px;
  display: block;
  width: 20px;
  height: 3px;
  margin-top: -2px;
  background-color: #fff;
  will-change: transform;
}

#modal-close:hover, #modal-close:focus, #modal-close:active {
  background-color: rgba(0, 0, 0, .8);
}

#brand-connection {
  position: relative;
  max-width: 1920px;
  margin: 0 auto;
  padding-bottom: 5.5em;
}

#brand-connection::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  display: block;
  height: 5.5em;
  background-color: #fff;
}

#brand-connection > .hdg {
  position: relative;
  -webkit-flex-direction: column;
  flex-direction: column;
  height: 100vh;
  min-height: 360px;
  background: #d2f0ff url(/brand/connection/images/index-01.jpg) no-repeat 50% 50%;
  background-size: cover;
  color: #000;
  font-size: 2rem;
  font-weight: bold;
  text-align: center;
}

#brand-connection > .hdg b {
  margin-top: 72px;
  font-size: 4.8rem;
}

#brand-connection > .hdg button {
  position: relative;
  display: block;
  width: 56px;
  height: 56px;
  margin-top: 16px;
  border-radius: 50%;
  padding-top: 18px;
  background-color: rgba(71, 71, 71, .6);
  color: #fff;
  font-size: 1.2rem;
  font-weight: normal;
  text-decoration: none;
  -webkit-transition: background-color .2s;
  transition: background-color .2s;
  will-change: background-color;
}

#brand-connection > .hdg button:hover, #brand-connection > .hdg button:focus, #brand-connection > .hdg button:active {
  background-color: rgba(71, 71, 71, .9);
}

#brand-connection > .hdg button::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 32px;
  display: block;
  width: 13px;
  height: 13px;
  margin-left: -6.5px;
  border-right: 3px solid #fff;
  border-bottom: 3px solid #fff;
  animation-duration: 4s;
  animation-name: urgeScrolling;
  animation-iteration-count: infinite;
  will-change: bottom, opacity;
}

#brand-connection > .section {
  position: relative;
  margin-top: 100vh;
  background: #e6e6e6 url(/brand/connection/images/index-06.jpg) no-repeat 50% 50%;
  background-size: cover;
}

#brand-connection > .section::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -100vh;
  z-index: 1;
  display: block;
  height: 100vh;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: 50% 50%;
  background-size: cover;
}

#brand-connection > .section.section-01::before {
  background-image: url(/brand/connection/images/index-02.jpg);
}

#brand-connection > .section.section-02::before {
  background-image: url(/brand/connection/images/index-03.jpg);
}

#brand-connection > .section.section-03::before {
  background-image: url(/brand/connection/images/index-04.jpg);
}

#brand-connection > .section.section-04::before {
  background-image: url(/brand/connection/images/index-05.jpg);
}

#brand-connection > .section > .inner {
  position: relative;
  z-index: 5;
  padding-top: 4em;
  padding-bottom: 4em;
}

#brand-connection > .section > .inner > .hdg {
  color: #000;
  font-size: 3.2rem;
  font-weight: bold;
  text-align: center;
}

#brand-connection > .section > .inner > .lead {
  margin-top: 1.25em;
  color: #000;
  font-size: 2rem;
  font-weight: bold;
  text-align: center;
}

#brand-connection > .section > .inner > .lead span {
  padding: .25em;
  background-color: #e9b226;
}

#brand-connection > .section > .inner > .lead span sup {
  font-weight: normal;
}

#brand-connection > .section > .inner > .body {
  margin-top: 1.25em;
}

#brand-connection > .section > .inner > .body > .img {
  width: 350px;
  margin-right: 30px;
  padding-top: .5em;
  text-align: center;
}

#brand-connection > .section > .inner > .body > .text p {
  margin-bottom: 0;
}

#brand-connection > .section > .inner > .body > .text p + .pgh-notice-01 {
  margin-top: 1em;
}

#brand-connection > .sns {
  margin-bottom: 0;
  padding: 2em 30px;
  background-color: #f2f2f2;
}

#brand-connection > .sns > li {
  height: 24px;
  margin: 0 3px;
}

#brand-connection > .sns > li.twitter iframe {
  vertical-align: top !important;
}

#brand-connection > .sns > li.facebook > div {
  display: block !important;
}

#brand-connection > .sns > li.facebook > div > span {
  vertical-align: top !important;
}

#brand-connection > .sns > li.googleplus {
  margin-top: -4px;
}

#brand-connection.fixed {
  position: relative;
}

#brand-connection.fixed::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  display: block;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
}

#brand-connection.fixed.bg-01::before {
  background-image: url(/brand/connection/images/index-02.jpg);
  background-position: 75% 50%;
}

#brand-connection.fixed.bg-02::before {
  background-image: url(/brand/connection/images/index-03.jpg);
}

#brand-connection.fixed.bg-03::before {
  background-image: url(/brand/connection/images/index-04.jpg);
}

#brand-connection.fixed.bg-04::before {
  background-image: url(/brand/connection/images/index-05.jpg);
  background-position: 37.5% 50%;
}

#brand-connection.fixed > .section::before {
  content: none;
}

.static #brand-connection > .hdg button {
  display: none;
}

@keyframes urgeScrolling {
  0% {
    bottom: 32px;
    opacity: 1;
  }
  5% {
    bottom: 32px;
    opacity: 0;
  }
  10% {
    bottom: 44px;
    opacity: 0;
  }
  35% {
    bottom: 32px;
    opacity: 1;
  }
  100% {
    bottom: 32px;
    opacity: 1;
  }
}

@media only screen and (max-width: 768px) {
  #brand-connection {
    padding-bottom: 4em;
  }
  #brand-connection::after {
    height: 4em;
  }
  #brand-connection > .hdg {
    height: 85vh;
    font-size: 1.8rem;
  }
  #brand-connection > .hdg b {
    font-size: 4rem;
  }
  #brand-connection > .section.section-01::before {
    background-position: 75% 50%;
  }
  #brand-connection > .section.section-04::before {
    background-position: 37.5% 50%;
  }
  #brand-connection > .section > .inner {
    padding: 4em 16px;
  }
  #brand-connection > .section > .inner > .hdg {
    font-size: 2.8rem;
  }
  #brand-connection > .section > .inner > .lead {
    line-height: 1.8;
    font-size: 1.8rem;
  }
  #brand-connection > .section > .inner > .body > .img {
    width: 200px;
    margin-right: 16px;
  }
  #brand-connection > .section > .inner > .body > .text {
    line-height: 1.8;
  }
}

@media only screen and (max-width: 600px) {
  #brand-connection > .hdg {
    font-size: 1.8rem;
  }
  #brand-connection > .hdg b {
    font-size: 3.6rem;
  }
  #brand-connection > .section > .inner > .hdg {
    font-size: 2.6rem;
  }
  #brand-connection > .section > .inner > .lead {
    font-size: 1.6rem;
  }
  #brand-connection > .section > .inner > .body {
    display: block;
  }
  #brand-connection > .section > .inner > .body > .img {
    width: 100%;
    margin-right: 0;
  }
  #brand-connection > .section > .inner > .body > .text {
    margin-top: 1.5em;
  }
  #brand-connection > .section > .inner > .body > .text p {
    margin-bottom: .625em;
  }
  #brand-connection > .section > .inner > .body > .text p + .pgh-notice-01 {
    margin-top: 1.5em;
  }
}

@media only screen and (max-width: 600px) {
  #brand-connection > .hdg {
    font-size: 1.6rem;
    font-size: 5vw;
  }
  #brand-connection > .hdg b {
    font-size: 2.4rem;
    font-size: 7.5vw;
  }
  #brand-connection > .section > .inner > .hdg {
    margin: 0 -8px;
    font-size: 2.2rem;
  }
}

.iframe-euroland-s,
.iframe-euroland-m,
.iframe-euroland-l {
  width: 100%;
  border: none;
}

.iframe-euroland-s {
  height: 60px;
}

.iframe-euroland-m {
  height: 1200px;
}

.iframe-euroland-l {
  height: 1450px;
}

@media only screen and (max-width: 828px) {
  .iframe-euroland-l {
    height: 2900px;
  }
}

@media only screen and (max-width: 512px) {
  .iframe-euroland-m {
    height: 1340px;
  }
  .iframe-euroland-l {
    height: 2800px;
  }
}
