@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;700;900&family=Noto+Sans+JP:wght@300;400;500;700;900&display=swap');
@font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham.otf') format('opentype');
}
@font-face {
    font-family: 'DINEngschrift';
    src: url('../fonts/DINEngschrift.ttf') format('truetype');
}
* {box-sizing:border-box;}
html, html a, * {-webkit-font-smoothing:antialiased; font-smoothing:antialiased; text-rendering:optimizeLegibility;}
body {position:relative; min-width:1280px; max-width:auto; margin:0; padding:0; padding-right:0 !important; color:#000; -webkit-text-size-adjust:none; font-family:'Roboto', 'Noto Sans JP', sans-serif; font-weight:900; font-size:20px; line-height:1.75; word-wrap:break-word;}
body.lock {overflow:hidden;}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {margin:0; font-weight:900; line-height:1;}
a {color:#000; transition:all .2s ease-in-out;}
a:link, a:visited {text-decoration:none;}
a:hover {text-decoration:none; color:#000;}
p {margin-bottom:0;}
figure {margin:0;}
ul, ol {margin-bottom:30px; padding-left:20px;}
img[src$='.svg'] {width:100%; height:auto;}
.img-arrow {max-width:200px;}
.btn {padding:20px 0; border:none; border-radius:0; text-align:center; font-size:30px; font-weight:900; line-height:1; white-space:nowrap; transition:all .3s ease-in-out;}
.btn-primary {background-color:#000;}
.btn-primary:hover,
.btn-primary:active,
.btn-primary:focus,
.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active {background-color:#000;}
.btn.focus, .btn:focus, button:focus {box-shadow:none; outline:none;}
.table th,
.table td {vertical-align:middle;}
.bg-gray {background-color:#efefef;}
.bg-black {background-color:#000; color:#fff;}
.container {max-width:1280px;}
.container-lg {max-width:1280px;}

#header {position:fixed; top:0; left:0; width:100%; z-index:1100;}
.navbar-global {height:70px; padding:0;}
.navbar-brand {margin:0 0 0 20px; padding:0;}
.navbar-brand a {display:block; width:250px; height:22px; margin:0 auto; background-image:url(../images/logo.svg); background-size:cover; background-position:top left; background-repeat:no-repeat;}
.scrolling .navbar-brand a {background-image:url(../images/logo-colored.svg);}
.navbar-button {position:absolute; top:0; right:0; display:block; padding:10px 20px; background-color:#000; color:#fff;}
.navbar-button:hover {color:#fff;}

#content {}

.section {padding-top:100px; padding-bottom:70px; background-image:url(../images/sep-default.jpg); background-size:100% auto; background-position:top 50px left; background-repeat:no-repeat;}
.section.no-bg {padding-top:50px; padding-bottom:70px; background-image:none;}
.section-header {margin-bottom:50px; text-align:center;}
.section-title {padding-bottom:20px; font-size:60px;}
.section-subtitle {font-size:30px;}
.section-description {margin-top:30px; font-size:25px;}

.section-hero {position:relative; height:785px; background-image:url(../images/hero-bg.jpg); background-repeat:no-repeat; background-size:cover; background-position:center center;}
.section-hero-overlay {position:absolute; color:#fff; font-size:40px;}
.section-hero-overlay:nth-child(1) {top:100px; left:50px;}
.section-hero-overlay:nth-child(1) b {font-size:125%;}
.section-hero-overlay:nth-child(2) {bottom:50px; left:50px;}

.section-troubles {}
.troubles-arrow {margin-bottom:20px; text-align:center;}
.troubles-text {margin-bottom:20px; padding:10px 0; text-align:center; font-size:30px;}

.different-text {margin-bottom:20px; padding:10px 0; text-align:center; font-size:30px;}
.different-title {margin-bottom:20px; padding-bottom:5px; border-bottom:4px solid #000; font-size:30px;}
.different-arrow {margin-bottom:20px; text-align:center;}

.section-features {}
.features-title {margin-bottom:20px; padding-bottom:5px; border-bottom:4px solid #000; font-size:30px;}
.features-point {font-size:100px; line-height:1.25;}
.features-item:not(:last-child) {margin-bottom:70px;}
.features-arrow {margin-top:50px; margin-bottom:50px; text-align:center;}

.correspondence-title {margin-bottom:20px; padding-bottom:5px; border-bottom:4px solid #000; font-size:30px;}
.correspondence-case {text-align:right; font-size:100px; line-height:1.25; line-height:1;}
.correspondence-text {margin-bottom:20px; padding:10px 0; text-align:center; font-size:30px;}

.structure-text {position:relative; overflow:hidden; margin-bottom:50px; padding:10px 0; text-align:center; font-size:30px; color:#fff100;}
.structure-text::before,
.structure-text::after {position:absolute; content:''; border:50px solid transparent;}
.structure-text::before {top:-50px; left:-50px; border-bottom-color:#fff100; transform:rotate(-45deg);}
.structure-text::after {bottom:-50px; right:-50px; border-top-color:#fff100; transform:rotate(-45deg);}
.structure-col {margin-bottom:20px; text-align:center;}
.structure-col-title {margin-bottom:20px; padding:10px 0; font-size:22px;}
.structure-col-number {font-size:100px; line-height:1;}
.structure-col-unit {margin-bottom:10px; padding-bottom:10px; border-bottom:3px solid #000; font-size:50px; line-height:1;}
.structure-col-note {margin-bottom:10px; padding:5px 0; font-size:15px;}
.structure-col-arrow {margin-bottom:10px;}
.structure-col-arrow .img-arrow {max-width:100px;}
.structure-col-price {font-size:40px; line-height:1;}
.structure-col-price-unit {font-size:15px; line-height:1.25;}
.structure-note {padding:15px; font-size:15px;}

.quote-table {table-layout:fixed; color:#000;}
.quote-table th,
.quote-table td {border-top:none; text-align:center; border-bottom:2px solid #fff;}
.quote-table thead th {background-color:#000; border-bottom:none; color:#fff; font-weight:900;}
.quote-table thead th:not(:last-child) {border-right:2px solid #fff;}
.quote-table tbody td {background-color:#efefef;}
.quote-table tbody td:not(:last-child) {border-right:2px solid #fff;}

.flow-text {margin-bottom:20px; padding:10px 0; text-align:center; font-size:25px;}
.flow-item {margin-bottom:20px; padding:10px 0; text-align:center; font-size:30px;}
.flow-arrow {margin-bottom:20px; text-align:center;}

.faq-item:not(:last-child) {margin-bottom:20px;}
.faq-title {position:relative; margin-bottom:5px; padding-bottom:10px; padding-right:30px; border-bottom:4px solid #000; font-size:25px; cursor:pointer;}
.faq-title::after {position:absolute; top:0; right:0; content:''; border:10px solid transparent;}
.faq-title[aria-expanded="false"]::after {border-top-color:#000; top:20px;}
.faq-title[aria-expanded="true"]::after {border-bottom-color:#000; top:10px;}
.faq-text {}
.faq-text-inner {padding:10px 0;}

.contact-form-inner {margin-bottom:20px; padding:50px; background-color:#efefef;}
.contact-form-inner .form-group {margin-bottom:0;}
.contact-form-inner .form-group:not(:last-child) {margin-bottom:20px;}
.contact-form-inner .form-control {padding:10px; border:2px solid #000; border-radius:0; color:#000; font-weight:900;}
.contact-form-inner input.form-control {height:calc(1.75rem + 20px + 4px);}

.company-table {table-layout:fixed; color:#000;}
.company-table th,
.company-table td {border-top:none; border-bottom:2px solid #fff;}
.company-table tbody th {width:20%; background-color:#000; border-right:2px solid #fff; text-align:center; color:#fff; font-weight:900;}
.company-table tbody td {background-color:#efefef;}

.section-footer {padding:10px 0; text-align:center; background-color:#000; color:#fff;}
.footer-text p {line-height:1;}

#pagetop {position:fixed; bottom:15px; right:15px; display:flex; justify-content:center; align-items:center; width:40px; height:40px; border-radius:0; background-color:#fff; color:#000; font-size:20px;}

@media (max-width:767px) {
    body {min-width:auto; max-width:auto; font-size:15px;}
    ul, ol {margin-bottom:10px;}
    .img-arrow {max-width:100px;}
    .btn {padding:15px 0; text-align:center; font-size:20px;}
    .container {max-width:auto;}
    .container-lg {max-width:auto; padding:0;}

    .navbar-global {height:44px;}
    .navbar-brand {margin-left:15px;}
    .navbar-brand a {width:150px; height:13px;}
    .navbar-button {}

    .section {padding-top:30px; padding-bottom:30px;}
    .section.no-bg {padding-top:30px; padding-bottom:30px;}
    .section-header {margin-bottom:30px;}
    .section-title {padding-bottom:10px; font-size:25px;}
    .section-subtitle {font-size:18px;}
    .section-description {margin-top:20px; font-size:13px;}

    .section-hero {height:100vh; background-image:url(../images/hero-bg-sp.jpg);}
    .section-hero-overlay {font-size:25px;}
    .section-hero-overlay:nth-child(1) {top:100px; left:15px; right:15px;}
    .section-hero-overlay:nth-child(2) {bottom:15px; left:15px; right:15px;}

    .troubles-text {font-size:15px;}

    .different-text {font-size:15px;}
    .different-title {font-size:15px;}

    .features-title {font-size:15px;}
    .features-point {font-size:30px;}
    .features-arrow {margin-top:30px; margin-bottom:30px;}

    .correspondence-text {font-size:13px;}
    .correspondence-title {font-size:15px;}
    .correspondence-case {margin-top:10px; text-align:left; font-size:30px;}

    .structure-text {margin-bottom:30px; font-size:15px;}
    .structure-text::before {border-width:30px; top:-30px; left:-30px;}
    .structure-text::after {border-width:30px; bottom:-30px; right:-30px;}
    .structure-col {margin-bottom:30px; padding-bottom:20px; border:3px solid #000;}
    .structure-col-title {font-size:15px;}
    .structure-col-number {font-size:70px;}
    .structure-col-unit {margin-bottom:20px; padding-bottom:0; border-bottom:none; font-size:30px;}
    .structure-col-note {display:inline-block; padding:5px 10px; font-size:13px;}
    .structure-note {font-size:13px;}

    .quote-table th,
    .quote-table td {padding:5px; font-size:13px;}
    .quote-table th:first-child,
    .quote-table td:first-child {width:60%;}

    .flow-text {font-size:15px;}
    .flow-item {font-size:15px;}

    .faq-title {font-size:15px;}
    .faq-text {font-size:13px;}

    .contact-form-inner {padding:20px}

    .company-table th,
    .company-table td {padding:5px; font-size:13px;}
    .company-table tbody th {width:30%;}

    .footer-text p {}
}