@charset 'UTF-8';

/*
 * base
--------------------------------------- */
/*
* {
    font-size: 16px;
}
@media screen and (max-width: 750px) {
    * {
        font-size: 14px;
    }
}
*/

:root {
    --white: #ffffff;
    --black: #333333;
    --fill-primary-blue: #0068b7;
    --fill-second-blue: #0056a8;
    --fill-mid-blue: #1b69a5;
    --ud-blue: #1971b9;
    --fill-light-blue: #d6e1ef;
    --f-small: 0.75rem;
    --f-normal: 1rem;
    --f-large: 1.25rem;
    --f-top-section-copy: 1.75rem;
    --f-top-h2: 2rem;
    --f-top-h3: 1.5rem;
    --f-top-h2-span: 1rem;
    --w-inner: 1066px;
}

@media screen and (max-width: 750px) {
    :root {
        --f-small: 0.75rem;
        --f-normal: 0.875rem;
        --f-large: 1.125rem;
        --f-top-section-copy: 1rem;
        --f-top-h2: 1.5rem;
        --f-top-h3: 1rem;
        --f-top-h2-span: 0.5rem;
    }
}

li {
    list-style-type: none;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: 游ゴシック体, YuGothic, "Yu Gothic", "“ヒラギノ角ゴ ProN W3”", "“Hiragino Kaku Gothic ProN”", “メイリオ“, Meiryo, sans-serif;
}

/*
 * common
--------------------------------------- */
h1 > span {
    display: block;
}

/*
 * util
--------------------------------------- */
.disp-pc {
    display: block;
}

@media screen and (max-width: 750px) {
    .disp-pc {
        display: none;
    }
}

/* clearfix */
.cf:after {
    content: "";
    display: block;
    clear: both;
}

/*
 * header
--------------------------------------- */
.header {
    width: 100%;
    height: 100px;
}

.header-container {
    display: flex;
    justify-content: space-between;
    padding: 16px 30px;
}

.logo {
    width: auto;
    height: 69px;
}

.logo a {
    display: block;
    width: auto;
    height: 100%;
}

.logo img {
    width: auto;
    height: 100%;
}

.gnav {
    display: flex;
    align-items: center;
}

.gnav a {
    text-decoration: none;
    font-weight: bold;
    color: var(--ud-blue);
}

.header-nav.gnav .menu-item {
    margin: 0 3em 0 0;
    position: relative;
}

.header-nav.gnav .menu-item:last-child {
    margin-right: 0;
}

.header-nav.gnav .menu-item::after {
    position: absolute;
    content: "";
    bottom: -0.75em;
    left: 0;
    width: 0;
    height: 1px;
    border: 1px solid var(--white);
    transition: .4s;
}

.header-nav.gnav .menu-item:hover::after {
    width: 100%;
    border: 1px solid var(--ud-blue);
}

.modal-container {
    background-color: var(--fill-light-blue);
}

.header-nav.menu .menu-item > a {
    font-weight: bold;
}

#modal .header-nav.menu .menu-item > a {
    max-width: 12em;
    padding: 0;
    margin: 0 auto 1em;
    line-height: 1.5;
    font-size: 1.125rem;
    font-weight: bold;
    color: var(--ud-blue);
}

#modal .header-nav.menu .menu-item > a:hover {
    background: none;
}

@media screen and (max-width: 1200px) {
    .header .nav {
        margin-right: 0;
    }
}

@media screen and (max-width: 960px) {
    .header {
        height: 75px;
    }
    .header-container {
        padding: 8px 15px;
    }
    .logo {
        height: 56px;
    }
}

/*
 * main
--------------------------------------- */
.main {
    margin: 100px 0 0;
}

.main p {
    margin: 0 0 2em;
}

.main h2 {
    margin: 0 0 1.8em;
    text-align: center;
    font-size: var(--f-top-h2);
}

.main h2 > span {
    display: block;
    margin: 1.4em 0 0;
    font-size: var(--f-top-h2-span);
    color: var(--ud-blue);
}

@media screen and (max-width: 960px) {
    .main {
        margin: 75px 0 0;
    }
}

@media screen and (max-width: 750px) {
    .main h2 {
        margin-bottom: 1.25em;
    }
    .main h2 > span {
        margin: 1em 0;
    }
    .main p {
        font-size: var(--f-normal);
        line-height: 1.75;
    }
}

/* hero */
.hero {
    position: relative;
    height: calc( 100vh - 100px);
    max-height: 840px;
    /* background-image: url(img/hero.jpg); */
    background-position: center;
    background-size: cover;
    color: var(--white);
    z-index: 1;
}

.hero::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    background: inherit;
    filter: brightness(70%);
    z-index: -1;
}

.hero {
    display: flex;
    align-items: center;
}

.hero .copy {
    position: absolute;
    margin: 70px 68px 70px;
    z-index: 1;
}

.hero p {
    /* text-shadow: 0 2px 2px #333; */
    font-weight: bold;
    font-size: var(--f-large);
    line-height: 2;
    margin: 0 0 1em;
    letter-spacing: .5px;
}

.swiper-container .swiper-slide img {
    object-fit: cover;
    width: 100%;
    height: calc( 100vh - 100px);
    max-height: 840px;
    filter: brightness(70%);
}

@media screen and (max-width: 750px) {
    .hero {
        height: calc( 100vh - 75px);
        max-height: 546px;
    }
    .hero .copy {
        margin: 0 40px 0;
    }
    .hero .copy p {
        font-size: var(--f-normal)
    }
    .swiper-container .swiper-slide img {
        height: 100%;
    }
}

/* news */
.top-news {
    position: relative;
    padding: 90px 20px 100px;
    background: var(--fill-primary-blue);
    color: var(--white);
    z-index: 2;
}

.top-news-list {
    width: 100%;
    max-width: 762px;
    margin: 72px auto 64px;
}

.top-news-list-item {
    margin: 0 0 1em;
}

.top-news-list .date {
    margin: 0 0 0 0;
    font-size: var(--f-small);
}

.top-news-list .text {
    margin: 0 0 0 1.25em;
    font-size: var(--f-normal);
}

.top-news a {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: var(--white);
    transition: .4s;
}

.top-news a:hover {
    opacity: .5;
}

.top-news h2 > span {
    color: var(--white);
}

.top-news .more {
    text-align: center;
}
.top-news .more .btn {
    padding-right: 3em;
    padding-left: 3em;
}

/* bussiness */
.main .top-bussiness {
    width: 100%;
    padding: 185px 0 0;
    color: var(--black);
}

.main .top-bussiness h2 {
    margin-bottom: 1em;
    font-size: 2.5rem;
}
@media screen and (max-width: 750px) {
    .main .top-bussiness h2 {
        font-size: var(--f-top-h2);
    }
}

.top-main-section-unit {
    margin: 0 0 0;
    padding: 84px 0 0;
}

.section-header {
    position: relative;
}

.top-main-section-num {
    position: absolute;
    bottom: -23px;
    left: 0;
    margin: 0 0 0 -34px;
    line-height: 1;
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 192.25px;
    color: var(--fill-light-blue);
}

.top-main-section-copy {
    margin: 0 0 0 150px;
    padding: 0 0 0 40px;
    font-size: var(--f-top-section-copy);
    font-weight: bold;
    letter-spacing: 1px;
}

.unit-contents {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin: 52px 0 100px;
    padding: 0 150px 0 150px;
}

.unit-contents.reverse {
    flex-direction: row-reverse;
}

.unit-contents .image {
    width: calc(100% * 694 / 1066);
}

.unit-contents .text {
    width: calc(100% * 322 / 1066);
    letter-spacing: 0.85px;
}

.unit-contents .text h3 {
    margin: 0 0 0.85em;
    font-size: var(--f-top-h3);
    color: var(--ud-blue);
}

.unit-contents img {
    display: block;
    width: 100%;
}

@media screen and (max-width: 1200px) {
    .unit-contents {
        padding-right: 50px;
        padding-left: 50px;
    }
}

@media screen and (max-width: 980px) {
    .unit-contents {
        padding-right: 20px;
        padding-left: 0;
    }
    .unit-contents.reverse {
        padding-right: 0;
        padding-left: 20px;
    }
}

@media screen and (max-width: 750px) {
    .main .top-bussiness {
        padding-top: 120px;
    }
    .top-main-section-unit {
        margin-top: 60px;
        padding: 0;
    }
    .top-main-section-num {
        top: -5px;
        bottom: auto;
        margin-left: -15px;
        font-size: 76px;
    }
    .top-main-section-copy {
        margin-left: 60px;
        padding-left: 16px;
        padding-right: 16px;
    }
    .unit-contents {
        display: block;
        margin-top: 20px;
        padding: 0;
    }
    .unit-contents.reverse {
        flex-direction: row;
        padding-left: 0;
    }
    .unit-contents .text h3 {
        margin-bottom: 0.5em;
    }
    .unit-contents .image {
        width: 100%;
        margin: 0 0 1em;
        padding: 0 20px;
    }
    .unit-contents .text {
        width: 100%;
        padding: 0 20px;
    }
}

/* more */
.btn,
a.btn,
button.btn {
    position: relative;
    display: inline-block;
    padding: .75em 2em .7em;
    border-radius: 0.5rem;
    line-height: 1.5;
    text-align: center;
    vertical-align: middle;
    text-decoration: none;
    letter-spacing: 0.1em;
    font-size: var(--f-normal);
    color: #212529;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    cursor: pointer;
}

.btn--more,
a.btn--more {
  color: var(--ud-blue);
  border: 1px solid var(--ud-blue);
}

.btn--more span,
a.btn--more span {
    position: relative;
    padding: 0 0 0 1.4em
}

.btn--more span::after,
a.btn--more span::after {
    position: absolute;
    content: "";
    top: 3px;
    left: 0;
    width: 13px;
    height: 13px;
    background: url(img/arrow-blue.svg);
}

.btn--more:hover,
a.btn--more:hover {
  color: #fff;
  background: var(--ud-blue);
}

.btn--more:hover span::after,
a.btn--more:hover span::after {
    background: url(img/arrow-white.svg);
}

a.btn--radius {
   border-radius: 100vh;
}

a.btn--white {
    border-color: var(--white);
    background-color: var(--white);
}


@media screen and (max-width: 750px) {
    .more {
        text-align: center;
    }
    .btn, a.btn, button.btn {
        font-size: .875rem;
    }
}

/* download */
.download {
    background: var(--fill-primary-blue);
    color: var(--white);
}

.download .inner {
    width: 100%;
    max-width: var(--w-inner);
    margin: 0 auto;
    padding: 7.25em 20px 6.25em;
}

.download h2 > span {
    color: var(--white);
}

.download-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}

.download-list-item {
    display: table;
    width: calc( 100% / 4 - 30px );
}

.download-list-item:nth-child(4) {
    margin-right: 0;
}

.download-list-item a {
    display: table-cell;
    width: 100%;
    height: 100%;
    padding: 1.5em 1em;
    border: 3px solid var(--white);
    border-radius: 10px;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    font-size: var(--f-large);
    color: var(--white);
    transition: .4s;
}

.download-list-item a > span {
    font-weight: bold;
}

.download-list-item a:hover {
    background-color: var(--white);
    color: var(--ud-blue);
}

@media screen and (max-width: 980px) {
    .download-list {
        margin: 0 30px;
    }
    .download-list-item {
        width: calc( 100% / 4 - 15px );
        margin-right: 20px;
    }
}

@media screen and (max-width: 750px) {
    .download .inner {
        padding: 4em 20px 4em;
        width: 100%;
    }
    .download-list-item {
        width: calc( 50% - 10px );
        margin: .75em 20px 0 0;
    }
    .download-list-item:nth-child(2) {
        margin-right: 0;
    }
    .download-list-item a {
        padding-top: 1em;
        padding-bottom: 1em;
    }
}

@media screen and (max-width: 400px) {
    .download-list {
        display: block;
    }
    .download-list-item {
        width: 100%;
        margin: .75em 0;
    }
}

/*
 * footer
--------------------------------------- */
footer {
    display: flex;
    justify-content: space-between;
}

.footer-logo {
    width: 145px;
    margin: 0 30px 0;
    padding: 30px 0 0;
}

.footer-logo img {
    width: 100%;
}

.copyright {
    margin: 0 30px 0;
    padding: 74px 0 78px;
    line-height: 1;
    font-size: var(--f-small);
    color: var(--black);
}

@media screen and (max-width: 750px) {
    footer {
        display: block;
        padding: 24px 20px 44px;
        border-top: 1px solid #0068b7;
        text-align: center;
    }
    .footer-logo {
        width: 72px;
        margin: 0 auto;
        padding: 0;
    }
    .copyright {
        margin: 22px 0 0;
        padding: 0;
        font-size: 10px;
    }
}

/*
 * animation
--------------------------------------- */
body {
    -webkit-animation: fadeIn 1.5s ease 0s 1 normal;
    animation: fadeIn 1.5s ease 0s 1 normal;
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

.effect-fade {
    opacity: 0;
    transform: translate(0, 45px);
    transition: all 1.0s;
}

.effect-fade.effect-scroll {
    opacity: 1;
    transform: translate(0, 0);
}

/*
 * subpage / archive / single
--------------------------------------- */
.subpage, .archive .single {
    overflow-x: hidden;
}

.subpage .main,
.archive .main,
.single .main {
    overflow: hidden;
    margin: 100px 0 0;
    color: var(--black);
}

.subpage .main section,
.arhicve .main section,
.single .main section {
    margin: 48px 0 ;
}

.subpage .main section:not(1),
.archive .main section:not(1),
.single .main section:not(1) {
    margin: 100px 0 0;
}

.visual {
    position: relative;
    z-index: -1;
    width: 100%;
    height: 36.61vw; /* 500px */
    /* max-height: 840px; */
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: cover !important;
    background: #0056a8;
}

.mask {
    /* position: relative;
    z-index: -1;
    background: #0056a8;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-image: url(./img/mask.png);
            mask-image: url(./img/mask.png);*/
}

.visual::after {
    position: absolute;
    left: -63vw;
    top: 0;
    content: "";
    width: 100%;
    height: 100%;
    background: rgba(20, 108, 182, .8);
    transform: skewX(345deg);
    overflow: hidden;
    z-index: -1;
}

.engineering .visual::after {
    left: calc( -63vw + 6vw );
}

.visual .page-title {
    display: flex;
    align-items: center;
    height: 100%;
    margin: 0 0 0 9vw;
    color: #fff;
    z-index: 1;
}

.visual .page-title h1 {
    align-self: center;
    height: auto;
    margin: -1% 0 0;
    line-height: 1.65;
    /* font-size: 3.125rem; */
    font-size: 3.66033vw;
}

.visual .page-title h1 > span {
    display: block;
    /* font-size: var(--f-normal); */
    font-size: 32%;
}
/* visualなし */
.main .inner .page-title {
    display: flex;
    align-items: center;
    height: 100%;
    margin: 5vw 0 0 0;
    color: var(--black);
    z-index: 1;
}
.main .inner .page-title h1 {
    align-self: center;
    height: auto;
    margin: -1% 0 0;
    line-height: 1.65;
    font-size: 3.66033vw;
}
.main .inner .page-title h1 > span {
    display: block;
    /* font-size: var(--f-normal); */
    font-size: 32%;
}

.subpage .inner,
.archive .inner,
.single .inner {
    position: relative;
    z-index: 1;
    max-width: 1066px;
    margin: 0 auto;
    background: #fff;
    border-radius: 40px 40px 0 0;
}

@media screen and (max-width: 1106px) {
    .subpage .inner,
    .archive .inner,
    .single .inner {
        margin: 0 20px;
    }
}

.local-nav {
    margin: -38px 0 85px;
    padding: 20px 40px 20px;
    background: #fff;
    border-radius: 40px 40px 0 0;
    font-weight: bold;
}

.local-nav-list {
    display: flex;
    justify-content: center;
    flex-wrap: nowrap;
}

.local-nav-list li {
    border-left: 1px solid #9aaad5;
}
.local-nav-list li:last-child {
    border-right: 1px solid #9aaad5;
}

.local-nav-list a {
    display: block;
    width: auto;
    padding: 7px 32px 7px;
    text-decoration: none;
    color: var(--ud-blue);
    cursor: pointer;
}

.local-nav-list a:hover {
    transition: .4s;
    opacity: .7;
}

.subpage .main article,
.archive .main article,
.single .main article {
    margin: 48px 0 0;
}

.subpage .main a,
.archive .main a,
.single .main a {
    word-break: break-all;
}

.single .main h1 {
    margin: 3.25em 0 2em;
    font-size: var(--f-top-h2);
}

.subpage .main h2,
.archive .main h2,
.single .main h2 {
    margin: 3.25em 0 2em;
}

.subpage .main section:first-child h2,
.archive .main section:first-child h2,
.single .main section:first-child h2 {
    margin: 0 0 4.25em;
}

.subpage .main h2 > span,
.archive .main h2 > span,
.single .main h2 > span {
    margin: .85em 0 0;
}

.subpage .main h3,
.archive .main h3,
.single .main h3 {
    margin: 2.25em 0 1em;
    line-height: 1.25;
    font-size: 1.75rem;
    font-weight: bold;
}

.subpage .main h3.blue,
.archive .main h3.blue,
.single .main h3.blue {
    color: #1971b9;
}

.subpage .main h3.box-title,
.archive .main h3.box-title,
.single .main h3.box-title {
    margin-bottom: 1rem;
}

.subpage .main h4,
.archive .main h4,
.single .main h4 {
    margin: 1.75em 0 1em;
    line-height: 1.25;
    font-size: 1.5rem;
    font-weight: bold;
}

.subpage .main h5,
.archive .main h5,
.single .main h5 {
    margin: 2em 0 1em;
    line-height: 1.25;
    font-size: 1.25rem;
    font-weight: bold;
}

.subpage .main h6,
.archive .main h6,
.single .main h6 {
    margin: 2em 0 1em;
    line-height: 1.25;
    font-size: 1rem;
    font-weight: bold;
}

.subpage .main .small,
.archive .main .small,
.single .main .small {
    font-size: .875rem;
}

.subpage .main p,
.archive .main p,
.single .main p {
    line-height: 2;
}

.subpage .main figcaption,
.archive .main figcaption,
.single .main figcaption {
    margin: 0.5em 1em 1em;
    font-size: var(--f-normal);
}

.subpage .main table,
.archive .main table,
.single .main table {
    border: 1px solid #000;
    border-collapse: collapse;
}

.subpage .main th,
.archive .main th,
.single .main th {
    padding: 0.5em 0.75em;
    background: #1971b9;
    border: 1px solid #000;
    text-align: center;
    font-size: var(--f-normal);
    font-weight: bold;
    color: #fff;
}

.subpage .main td,
.archive .main td,
.single .main td {
    padding: 0.5em 0.75em;
    border: 1px solid #000;
    font-size: var(--f-normal);
}

/* セル背景用class */
tr.bg-green,
th.bg-green,
td.bg-green {
    background: rgb(146 235 133 / 30%);
}
tr.bg-yellow,
th.bg-yellow,
td.bg-yellow {
    background: rgb(249 248 113 / 30%);
}
tr.bg-blue,
th.bg-blue,
td.bg-blue {
    background: rgb(0 150 207 / 10%);
}

/* tableスクロール */
.scroll table {
    width:100%;
}
.scroll {
    overflow: auto;
    white-space: nowrap;
}
.scroll::-webkit-scrollbar {
    height: 5px;
}
.scroll::-webkit-scrollbar-track {
    background: #F1F1F1;
}
.scroll::-webkit-scrollbar-thumb {
    background: #BCBCBC;
}

table {
    width:100%;
    overflow: auto;
}

.subpage .main .box,
.archive .main .box,
.single .main .box {
    margin: 0 0 80px;
    padding: 1em 1.5em;
    border: 1px solid #333333;
    line-height: 2.14288714;
    font-size: var(--f-normal);
}

.subpage .main .box > p:last-child,
.archive .main .box > p:last-child,
.single .main .box > p:last-child {
    margin: 0;
}

.subpage .main .box.box-blue,
.archive .main .box.box-blue,
.single .main .box.box-blue {
    background: #1971b9;
    border: none;
    color: #fff;
}

.subpage .main .box.box-aster,
.archive .main .box.box-aster,
.single .main .box.box-aster {
    background: #d6e1ef;
    border: none;
}

.subpage .main dl,
.archive .main dl,
.single .main dl {
    margin: 2em 0;
}

.subpage .main dt,
.archive .main dt,
.single .main dt {
    float: left;
    margin: 0 0 1em;
    width: 10em;
    font-size: var(--f-normal);
    font-weight: bold;
}

.subpage .main dd,
.archive .main dd,
.single .main dd {
    margin: 0 0 0 13em;
    font-size: var(--f-normal);
}

.subpage .main dd::after,
.archive .main dd::after,
.single .main dd::after {
    content: "";
    display: block;
    clear: both;
}

/* 会社情報 */
.text-center {
    text-align: center;
}
.subpage .main dl.company-info,
.archive .main dl.company-info,
.single .main dl.company-info {
    display: inline-block;
    /* margin: 1em auto 2em; */
    width: auto;
    /* max-width: 600px; */
}
.subpage .main dl.company-info dt,
.archive .main dl.company-info dt,
.single .main dl.company-info dt {
    text-align: right;
}
.subpage .main dl.company-info dd,
.archive .main dl.company-info dd,
.single .main dl.company-info dd {
    text-align: left;
}
/* 見出し文字数 */
.subpage .main dl.dt_3em dt,
.archive .main dl.dt_3em dt,
.single .main dl.dt_3em dt {
    text-align-last: justify;
    text-justify: inter-ideograph;
    width: 3em;
}
.subpage .main dl.dt_3em dd,
.archive .main dl.dt_3em dd,
.single .main dl.dt_3em dd {
    margin-left: 5em;
}
.subpage .main dl.dt_5em dt,
.archive .main dl.dt_5em dt,
.single .main dl.dt_5em dt {
    text-align-last: justify;
    text-justify: inter-ideograph;
    width: 5em;
}
.subpage .main dl.dt_5em dd,
.archive .main dl.dt_5em dd,
.single .main dl.dt_5em dd {
    margin-left: 7em;
}
.subpage .main dl.dt_7em dt,
.archive .main dl.dt_7em dt,
.single .main dl.dt_7em dt {
    text-align: left;/* 左寄せに変更 */
    width: 7em;
}
.subpage .main dl.dt_7em dd,
.archive .main dl.dt_7em dd,
.single .main dl.dt_7em dd {
    margin-left: 7.25em;
}

.subpage .main .article ul,
.archive .main .article ul,
.single .main .article ul {
    margin: 0 0 2em 1em;
    font-size: var(--f-normal);
}

.subpage .main .article ul ul,
.archive .main .article ul ul,
.single .main .article ul ul {
    margin: .5em 0 0 2em;
}

.subpage .main .article ul ul ul,
.archive .main .article ul ul ul,
.single .main .article ul ul ul {
    margin: .5em 0 0 2em;
}

.subpage .main .article li,
.archive .main .article li,
.single .main .article li {
    margin: 0 0 .5em;
    list-style-type: disc;
}

/* 番号付きリスト */
.subpage .main .article ol,
.archive .main .article ol,
.single .main .article ol {
    margin: 0 0 2em 1em;
    font-size: var(--f-normal);
}
.subpage .main .article ol ul,
.archive .main .article ol ul,
.single .main .article ol ul {
    margin: .5em 0 0 2em;
}
.subpage .main .article ol ol,
.archive .main .article ol ol,
.single .main .article ol ol {
    margin: .5em 0 0 2em;
}
.subpage .main .article ol ul ul,
.archive .main .article ol ul ul,
.single .main .article ol ul ul {
    margin: .5em 0 0 2em;
}
.subpage .main .article ol ol ul,
.archive .main .article ol ol ul,
.single .main .article ol ol ul {
    margin: .5em 0 0 2em;
}
.subpage .main .article ol ol ol,
.archive .main .article ol ol ol,
.single .main .article ol ol ol {
    margin: .5em 0 0 2em;
}
.subpage .main .article ol li,
.archive .main .article ol li,
.single .main .article ol li {
    margin: 0 0 .5em;
    list-style-type: decimal;
}

.subpage .main section.sec-hero,
.archive .main section.sec-hero,
.single .main section.sec-hero {
    position: relative;
}

.subpage .main .sec-hero-orverwidth,
.archive .main .sec-hero-orverwidth,
.single .main .sec-hero-orverwidth {
    height: 44vw;
    max-height: 600px;
    overflow-y: hidden;
    margin: 0 -50vw;
    padding: 0 70vw 0;
    background: #eeeeee;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.subpage .main section .sec-hero-inner,
.archive .main section .sec-hero-inner,
.single .main section .sec-hero-inner {
    margin: -195px  0 0;
    padding: 3em 3em;
    background: #fff;
}

.subpage .main section.sec-hero h2,
.archive .main section.sec-hero h2,
.single .main section.sec-hero h2 {
    margin: 0 0 .75em;
    text-align: left;
    font-size: var(--f-top-h3);
    color: #1971b9;
}

@media screen and (max-width: 1106px) {
    .subpage .main section .sec-hero-inner,
    .archive .main section .sec-hero-inner,
    .single .main section .sec-hero-inner {
        margin-top: calc( -33vw / 2 );
    }
}

@media screen and (max-width: 750px) {
    .subpage .main,
    .archive .main,
    .single .main {
        margin: 75px 0 0;
    }
    .subpage .main p,
    .archive .main p,
    .single .main p {
        line-height: 1.5;
    }
    .visual {
        height: 53.333333vw;
    }
    .visual::before {
        left: -76vw;
    }
    .visual .page-title {
        margin: 0 20px 0;
    }
    .visual .page-title h1 {
        font-size: 6.8vw;
    }
    .visual .page-title h1 > span {
        font-size: .6em;
    }
    /* visualなし */
    .main .inner .page-title {
        margin: 24px 0 0;
    }
    .main .inner .page-title h1 {
        font-size: 6.8vw;
    }
    .main .inner .page-title h1 > span {
        font-size: .6em;
    }
    .subpage .inner,
    .archive .inner,
    .single .inner {
        margin: 0 20px;
    }
    .local-nav {
        margin: 0 0 24px;
        padding: 30px 0 20px;
        border-radius: 0;
    }
    .local-nav-list a {
        padding: 2px 8px 2px;
        font-size: .75rem;
    }
    .subpage .main article,
    .archive .main article,
    .single .main article {
        margin: 24px 0 0;
    }
    .subpage .main h2,
    .archive .main h2,
    .single .main h2 {
        margin: 2.25em 0 2.25em;
    }
    .subpage .main h2 > span,
    .archive .main h2 > span,
    .single .main h2 > span {
        margin: 0 0 0;
        font-size: .875rem;
    }
    .subpage .main section:first-child h2,
    .archive .main section:first-child h2,
    .single .main section:first-child h2 {
        margin: 0 0 2.25em;;
    }
    .subpage .main h3,
    .archive .main h3,
    .single .main h3 {
        font-size: 1.125rem;
    }
    .subpage .main h4,
    .archive .main h4,
    .single .main h4 {
        font-size: 1rem;
    }
    .subpage .main h5,
    .archive .main h5,
    .single .main h5 {
        font-size: .875rem;
    }
    .subpage .main h6,
    .archive .main h6,
    .single .main h6 {
        font-size: .75rem;
    }
    .subpage .main .small,
    .archive .main .small,
    .single .main .small {
        font-size: .75rem;
    }
    .subpage .main table,
    .archive .main table,
    .single .main table {
        border-top: none;
        border-left: none;
        border-right: none;
    }
    .subpage .main th,
    .archive .main th,
    .single .main th {
        /* display: block; */
        padding: .5em 1em;
        border-bottom: none;
        font-size: .75rem;
    }
    .subpage .main td,
    .archive .main td,
    .single .main td {
        /* display: block; */
        padding: .5em 1em;
        border-bottom: none;
        font-size: .75rem;
    }

    /* table ブレイク用class */
    .subpage .main .break table,
    .archive .main .break table,
    .single .main .break table {
        width: 100%;
        overflow: hidden;
        white-space: normal;
    }
    .subpage .main table.break,
    .archive .main table.break,
    .single .main table.break {
        width: 100%;
        overflow: hidden;
        white-space: normal;
    }
    .subpage .main .break th,
    .archive .main .break th,
    .single .main .break th {
        display: block;
    }
    .subpage .main .break td,
    .archive .main .break td,
    .single .main .break td {
        display: block;
    }

    .subpage .main .box,
    .archive .main .box,
    .single .main .box {
        padding: .75em 1em;
        font-size: .75rem;
    }
    .subpage .main .box p,
    .archive .main .box p,
    .single .main .box p {
        font-size: .75rem;
    }
    .subpage .main dt,
    .archive .main dt,
    .single .main dt {
        float: none;
        margin: 0 0 .5em;
        width: 100%;
        font-size: .75rem;
        font-weight: bold;
    }
    .subpage .main dd,
    .archive .main dd,
    .single .main dd {
        margin: 0 0 1.25em;
        font-size: .75rem;
    }
    /* 会社情報はブレイクなし */
    .subpage .main dl.company-info dt,
    .archive .main dl.company-info dt,
    .single .main dl.company-info dt {
        float: left;
    }
    .subpage .main .article ul,
    .archive .main .article ul,
    .single .main .article ul {
        font-size: .75rem;
    }
    .subpage .main .article li,
    .archive .main .article li,
    .single .main .article li {
        line-height: 2;
    }
    .subpage .main section .sec-hero-inner,
    .archive .main section .sec-hero-inner,
    .single .main section .sec-hero-inner {
        padding: 2em 2em;
    }
}

/*
 * pagination
--------------------------------------- */
ul#prevnext {
    display: flex;
    justify-content: space-between;
    margin: 50px 0 100px;
    font-size: var(--f-normal);
}

li.prev {
    width: 50%;
}

li.next {
    width: 50%;
}

ul#prevnext a {
    display: block;
    text-decoration: none;
    color: var(--black);
}

ul#prevnext li.next a {
    text-align: right;
}

ul#prevnext a:hover {
    opacity: .7;
    transition: .4s;
}

@media screen and (max-width: 750px) {
    ul#prevnext {
        margin: 0 0 50px;
        font-size: var(--f-normal);
    }
}


/*
 * single-news
--------------------------------------- */
.single.single-news .main h1 {
    margin-bottom: .5em;
    font-size: var(--f-top-h2);
}

.post-info {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    width: 12.5em;
    margin: 0 0 4em;
}

.post-info .date {
    width: 5.5em;
    margin: 0 0 0 0;
    font-size: var(--f-small);
}

.post-info .text {
    margin: 0 0 0 1.25em;
    font-size: var(--f-normal);
}

@media screen and (max-width: 750px) {
    .single-news .catLabel {
        float: none;
        margin: 0 0 0 2em;
    }
}


/*
 * archive
--------------------------------------- */
.subpage .main a .date, .archive .main a .date, .single .main a .date {
    word-break: initial;
}
.archive-news {
    padding: 100px 50px 0;
}

.archive-news-list {
    color: var(--black);
}

.archive-news-list-item {
    margin: 0 0 1em;
}

.archive-news-list-item a {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: var(--black);
}

.article-info {
    display: flex;
    flex-wrap: nowrap;
    width: 12.5em;
}

.archive-news-list .date {
    width: 5.5em;
    margin: 0 0 0 0;
    font-size: var(--f-small);
}

.archive-news-list .text {
    margin: 0 0 0 1.25em;
    font-size: var(--f-normal);
}

.archive-news a:hover {
    opacity: .5;
    transition: .4s;
}

.archive-news h2 > span {
    color: var(--white);
}

/* news */
.catLabel {
    background: #555;
    font-size: var(--f-small);
    padding: 4px 12px;
    margin: 0 0 0 2em;
    text-align: center;
    color: #ffffff;
    width: 9em;
}
.no-cat {
    background: #fff;
}
.cat-media {
    background: #256588;
}
.cat-topics {
    background: #247147;
}
.cat-information {
    background: #800000;
}
.cat-report {
  background: #2d50b3;
}
.cat-lecture {
    background: #90309c;
}
.cat-article {
    background: #bd6030;
}

@media screen and (max-width: 750px) {
    .archive-news-list-item,
    .top-news-list-item {
        margin: 0;
    }
    .archive-news-list-item a,
    .top-news-list-item a {
        flex-direction: column-reverse;
        margin: 0;
        padding: 0.5em 0 1em;
    }
    .archive-news-list-item a {
        border-bottom: 1px solid rgba(0, 0, 0, .1);
    }
    .top-news-list-item a {
        border-bottom: 1px solid rgba(255, 255, 255, .5);
    }
    .archive-news-list-item:first-child {
        border-top: 1px solid rgba(0, 0, 0, .1);
    }
    .top-news-list-item:first-child {
        border-top: 1px solid rgba(255, 255, 255, .5);
    }
    .article-info {
        display: block;
        width: 100%;
        margin: 0;
    }
    .archive-news-list .date,
    .top-news-list .date {
        float: left;
        width: 50%;
        opacity: .85;
    }
    .catLabel {
        float: right;
        margin: 0;
    }
    .archive-news-list .text,
    .top-news-list .text {
        width: 100%;
        margin: .5em 0 .5em;
    }
}

/* pagination */
.wp-pagenavi {
    margin: 50px 0;
    padding: 0;
    font-size: var(--f-normal);
    text-align: center;
}

.wp-pagenavi a {
    margin: .25em;
    padding: .5em;
    text-decoration: none;
    background: #1871b9;
    color: #fff;
}

.wp-pagenavi .current {
    padding: .5em;
    color: #1871b9;
}

.wp-pagenavi a:hover {
    opacity: .7;
    transition: .4s;
}

/*
 * WPのclass
--------------------------------------- */
/* youtube埋め込み */
.wp-block-embed .wp-block-embed__wrapper {
    position: relative;
    margin: 80px 0 95px;
    width: 100%;
}

.wp-block-embed .wp-block-embed__wrapper {
    content: "";
    display: block;
    padding-top: 56.25%;
}

.wp-block-embed iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.wp-block-image:not(.is-resized) img {
    width: 100%;
    height: auto;
}

/* キャプション */
.wp-block-image figcaption {
    font-size: 0.875rem;
    text-align: center;
}

.wp-block-image.left figcaption {
    text-align: left;
}

/* button wp normal style */
.wp-block-button__link {
    color: var(--ud-blue) !important;
    background-color: #fff !important;
    border: 1px solid var(--ud-blue);
    text-decoration: none !important;
}
.wp-block-button__link:hover {
    transition: .4s;
}
.wp-block-button__link:visited {
    color: var(--ud-blue);
}
.wp-block-button__link:active, .wp-block-button__link:focus, .wp-block-button__link:hover {
    color: #fff !important;
    background: var(--ud-blue) !important;
}
/* PDF download .is-style-outline */
.is-style-outline > .wp-block-button__link,
.wp-block-button__link.is-style-outline {
    /* border: 1px solid #333 !important; */
    border: 4px solid #0056a8;
    border-radius: 0.85em;
    font-weight: bold;
    color: #0056a8 !important;
}
.is-style-outline > .wp-block-button__link:active,
.is-style-outline > .wp-block-button__link:focus,
.is-style-outline > .wp-block-button__link:hover {
    color: #fff !important;
    background: var(--ud-blue) !important;
    opacity: 1;
}
@media screen and (max-width: 781px) {
    .wp-block-buttons>.wp-block-button.wp-block-button__width-25 {
        width: 49% !important;
    }
}
@media screen and (max-width: 599px) {
    .wp-block-buttons>.wp-block-button.wp-block-button__width-25 {
        width: 48% !important;
    }
    .wp-block-button__link {
        font-size: 1em;
    }
    .is-style-outline > .wp-block-button__link, .wp-block-button__link.is-style-outline {
        font-size: 1em;
    }
    .wp-block-buttons>.wp-block-button.has-custom-font-size .wp-block-button__link {
        font-size: 0.85em !important;
    }
}

.subpage .main .wp-block-column h3,
.archive .main .wp-block-column h3,
.single .main .wp-block-column h3 {
    margin: 0 0 0.5em;
    color: #1971b9;
}

.subpage .main .wp-block-column h3 a,
.archive .main .wp-block-column h3 a,
.single .main .wp-block-column h3 a {
    margin: 0 0 0.5em;
    color: #1971b9;
}

.subpage .main .wp-block-column h4,
.archive .main .wp-block-column h4,
.single .main .wp-block-column h4 {
    margin: 0 0 0.5em;
    color: #1971b9;
}

.subpage .main .wp-block-column h4 a,
.archive .main .wp-block-column h4 a,
.single .main .wp-block-column h4 a {
    margin: 0 0 0.5em;
    color: #1971b9;
}

.subpage .main .wp-block-column h5,
.archive .main .wp-block-column h5,
.single .main .wp-block-column h5 {
    margin: 0 0 0.5em;
    color: #1971b9;
}

.subpage .main .wp-block-column h5 a,
.archive .main .wp-block-column h5 a,
.single .main .wp-block-column h5 a {
    margin: 0 0 0.5em;
    color: #1971b9;
}

/* column / block */
.wp-block-columns a {
    display: block;
    text-decoration: none;
}

.wp-block-columns a:hover {
    opacity: .7;
    transition: .4s;
}

.subpage .main .wp-block-columns,
.archive .main .wp-block-columns,
.single .main .wp-block-columns {
    margin-bottom: 2em;
}

.subpage .main .wp-block-columns.text-small,
.archive .main .wp-block-columns.text-small,
.single .main .wp-block-columns.text-small {
    font-size: .875rem;
}

.subpage .main .wp-block-columns.text-small .wp-block-image,
.archive .main .wp-block-columns.text-small .wp-block-image,
.single .main .wp-block-columns.text-small .wp-block-image {
    margin-bottom: 1em;
}

.subpage .main .wp-block-image,
.archive .main .wp-block-image,
.single .main .wp-block-image {
    margin-bottom: 2em;
}

@media (min-width: 782px) {
    .subpage .main .wp-block-column:not(:first-child),
    .archive .main .wp-block-column:not(:first-child),
    .single .main .wp-block-column:not(:first-child) {
        margin-left: 3.661vw;
    }
}

@media (max-width: 599px) {
    .subpage .main .wp-block-columns.grid .wp-block-column,
    .archive .main .wp-block-columns.grid .wp-block-column,
    .single .main .wp-block-columns.grid .wp-block-column {
        flex-grow: 0;
        flex-basis: calc(50% - 2vw)!important;
    }
    .subpage .main .wp-block-columns.grid .wp-block-column:nth-child(2n),
    .archive .main .wp-block-columns.grid .wp-block-column:nth-child(2n),
    .single .main .wp-block-columns.grid .wp-block-column:nth-child(2n) {
        margin-left: 3.661vw;
    }
}

.wp-block-columns.text-bottom {
    align-items: flex-end;
}

.wp-block-columns.text-bottom .wp-block-image {
    margin-bottom: 0;
}

.wp-block-columns.text-bottom .wp-block-image img {
    display: block;
}

.wp-block-columns.text-bottom .wp-block-column p:last-child {
    margin-bottom: 0;
}

@media screen and (max-width: 750px) {
    .subpage .main .wp-block-image,
    .archive .main .wp-block-image,
    .single .main .wp-block-image {
        margin-bottom: 1em;
    }
    .wp-block-columns.text-bottom .wp-block-column p:last-child {
        margin-bottom: 2em;
    }
}

/* flexble-table */
.wp-block-flexible-table-block-table.wp-block-flexible-table-block-table>table.has-fixed-layout {
    table-layout: auto !important;
}
