@charset "utf-8";
/*
 * Copyright 2025 マサクリエイツ
 * https://www.masa-cr.com/
 *
 * Breakpoint
 * 576px(sm) 768px(md) 992px(lg) 1200px(xl) 1400px(xxl)
 */
/* ------------------------------
	初期設定
------------------------------ */
html {
	line-height: 1.75;
	font-size:16px;
	font-family: "Open Sans", "Noto Sans JP", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	color:#111;
	background-color:transparent;
}
@media screen and (min-width: 1200px), print {
    html {font-size:18px;}
}
blockquote {border:dotted 1px #999}
dl {border:solid 1px #ccc}
table {border-top:solid 1px #ddd}
caption {background: #999;color: #fff}
th {background: #fff;border-bottom:solid 1px #ddd;padding:1.2em;font-weight:bold;color:#777;}
td {background:#fff;border-bottom:solid 1px #ddd;padding:1.2em;}
hr {color:#ccc;background-color:#ccc}
fieldset {border:1px solid #ccc}
a {text-decoration:underline;text-underline-offset:.3em;color:#3fa9f5}
a:hover {text-decoration:none;color:#24edef;}
a:active {text-decoration:none;color:#24edef}


/* ------------------------------
	class
------------------------------ */

/***** 文字色 *****/
.txc_01,a.txc_01 {color:#3fa9f5;}

/***** 背景 *****/
.bgc_01 {background-color:#111;}

/***** 見出し *****/
.h_01 {
    display:flex;
}
.h_01::before {
    content:"";
    display:block;
    width:24px;
    height:6px;
    background-color:#3fa9f5;
    background:linear-gradient(to right, #3fa9f5 50%, #24edef 50%);
    margin-top:.666em;
    margin-right:.333em;
}

/***** ボタン *****/
.btn_01,
.btn_02,
.btn_03 {
    display:inline-block;
    text-decoration:none;
    line-height:1.4;
    position:relative;
    text-align:center;
}
.btn_01.d_block,
.btn_02.d_block,
.btn_03.d_block {
    display:block;
}
.btn_01 {
    padding:1.5em 3em 1.5em 2em;
    border-radius:100vmax;
    background:#111;
    color:#fff;
}
.btn_01::after {
    content:"\f054";
    font-family:"Font Awesome 5 Free";
    font-weight:900;
    color:#3fa9f5;
    position:absolute;
    line-height:1;
    height:1em;
    right:1.5em;
    top:0;
    bottom:0;
    margin:auto;
    transition: all 0.2s ease-out;

}
.btn_01:hover {
    background: #24edef;
    color:#111;
    box-shadow:0 .4em .8em rgba(0, 0, 0, .25);
}
.btn_01:hover::after {
    color:#111;
    rotate:360deg;
}
.btn_01.blueGrad {
    background:transparent;
    position:relative;
    overflow:hidden;
}
.btn_01.blueGrad::before {
    content:"";
    position:absolute;
    z-index:-1;
    inset:0;
    background-color:#3fa9f5;
    background:linear-gradient(to right, #3fa9f5, #24edef);
}
.btn_01.blueGrad::after {
    color:#fff;
}
.btn_01.blueGrad:hover {
    background:#24edef;
}
.btn_01.blueGrad:hover::after {
    color:#111;
}
.btn_02 {}
.btn_03 {}

/***** その他 *****/
.serif {
	font-family: "EB Garamond", "Zen Old Mincho", serif;
}
.enHeading {
    font-size:3.75em;
    font-weight:600;
    line-height:1;
}
@media screen and (min-width: 576px), print {
    .enHeading {
        font-size:5.5em;
    }
}
@media screen and (min-width: 768px), print {
    .enHeading {
        font-size:7em;
    }
}
table.listTable th,
table.listTable td {
    border:solid 1px #ddd;
}
table.listTable th {
    background:#3fa9f5;
    color:#fff;
}
@media screen and (max-width: 767px), print {
    table.listTable th,
    table.listTable td {
        padding:.8em;
    }
}
@media screen and (max-width: 575px), print {
    .rpsTable th,
    .rpsTable td {
        display:block;
    }
    .rpsTable th {
        border-bottom:none;
        padding-bottom:0;
    }
}
.fade-in {
  opacity: 0;
  animation: fadeIn 2s ease forwards;
  animation-delay: 1s;
}
@keyframes fadeIn {
  to {
    opacity: 1;
  }
}


/* ------------------------------
	loading
------------------------------ */
#loading {
    width:100vw;
    height:100vh;
    transition:all 1s;
    background-color:#111;
    position:fixed;
    top:0;
    left:0;
    z-index:9999;
}
.spinner {
    width:100px;
    height:100px;
    margin:auto;
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
    background-color:#3fa9f5;
    border-radius:100%;
    animation:sk-scaleout 1.0s infinite ease-in-out;
}
/* animation:sk-scaleout */
@keyframes sk-scaleout {
    0% {
        -webkit-transform:scale(0);
        transform:scale(0);
    } 100% {
        -webkit-transform:scale(1.0);
        transform:scale(1.0);
        opacity:0;
    }
}
.loaded {
    opacity:0;
    visibility:hidden;
}


/* ------------------------------
	レイアウト
------------------------------ */
.mxW {
    max-width:1400px;
    margin-left:auto;
    margin-right:auto;
}
.pdLR {
    padding-left:7%;
    padding-right:7%;
}
.pdLRw {
    padding-left:8%;
    padding-right:8%;
}
.mgT {margin-top:4em}
.mgB {margin-bottom:4em}
.pdT {padding-top:4em}
.pdB {padding-bottom:4em}
@media screen and (min-width: 576px), print {
    .pdLR {
        padding-left:5%;
        padding-right:5%;
    }
    .mgT {margin-top:5em}
    .mgB {margin-bottom:5em}
    .pdT {padding-top:5em}
    .pdB {padding-bottom:5em}
}
@media screen and (min-width: 992px), print {
    .mgT {margin-top:7em}
    .mgB {margin-bottom:7em}
    .pdT {padding-top:7em}
    .pdB {padding-bottom:7em}
}
@media print {
    #container {width:1000px}
}


/* ------------------------------
	header
------------------------------ */
#header {
    display:flex;
    height:60px;
    align-items:center;
    padding:0 60px 0 5%;
    background-color:#111;
}
.headerLogo {
    margin:0;
    line-height:1;
    flex:1;
}
.headerLogo img {
    width:192px;
}
/* グローバールメニュー切り替え */
.nav-wrap {
    display:none;
    width:100%;
    height:calc(100vh - 60px);
    position:fixed;
    z-index:100;
    left:0;
    top:60px;
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior:none;
    background:#3fa9f5;
}
.nav-wrap.open {
    display:block;
    opacity:0;
    animation-name:fadein;
    animation-duration:.3s;
    animation-timing-function:ease-out;
    animation-fill-mode:forwards;
}
@keyframes fadein {
    0% {
       opacity: 0;
    }
    100% {
       opacity: 1;
    }
}
.catchcopy .serif {
    opacity:0;
    animation-name:fadein;
    animation-duration:.3s;
    animation-timing-function:ease-out;
    animation-fill-mode:forwards;
    
}
.nav-wrap.close {display:none}
.nav-button {
    display:block;
    width:60px;
    height:60px;
    position:absolute;
    z-index:101;
    top:0;
    right:0;
    cursor:pointer;
    background:#3fa9f5;
}
.nav-button.active {position:fixed}
.nav-button span {
    transition:all 0.2s;
    display:inline-block;
    width:28px;
    height:2px;
    box-sizing:border-box;
    position:absolute;
    left:16px;
    background:#fff;
}
.nav-button span:nth-of-type(1) {top:20px}
.nav-button span:nth-of-type(2) {top:29px}
.nav-button span:nth-of-type(3) {bottom:20px}
.nav-button.active span:nth-of-type(1) {
    -webkit-transform: translateY(9px) rotate(-45deg);
    transform: translateY(9px) rotate(-45deg);
}
.nav-button.active span:nth-of-type(2) {
    opacity:0;
}
.nav-button.active span:nth-of-type(3) {
    -webkit-transform: translateY(-9px) rotate(45deg);
    transform: translateY(-9px) rotate(45deg);
}
.nav-wrap ul.nav {
    list-style:none;
    margin:0;
    padding:0;
    border-top:solid 1px #111;
}
.nav-wrap ul.nav li {
    margin:0;
    padding:0;
    border-bottom:solid 1px #111;
}
.nav-wrap ul.nav li a {
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding: 1em;
    color:#fff;
    text-decoration:none;
    font-size:1em;
    line-height:1.4;
}
.nav-wrap ul.nav li a::after {
    content:"\f054";
    font-family:"Font Awesome 5 Free";
    font-weight:900;
    font-size:.875rem;
    color:#fff;
    padding-left:1rem;
    transition: all 0.2s ease-out;
}
@media screen and (min-width: 768px), print {
    #header {
        height:80px;
        padding:0 0 0 1.2em;
    }
    #header.sticky {
        position:fixed;
        top:0;
        width:100%;
        box-sizing:border-box;
        z-index:1000;
        animation: fadeInFromTop .5s;
    }
    @keyframes fadeInFromTop {
	    0% {
	       opacity: 0;
	       -webkit-transform: translateY(-80px);
	       transform: translateY(-80px);
	    }
	    100% {
	       opacity: 1;
	       -webkit-transform: translateY(0);
	       transform: translateY(0);
	    }
    }
    .headerLogo img {
        width:237px;
    }
    .nav-button {
        display:none;
    }
    .nav-wrap {
        display:block !important;
        position:relative;
        left:auto;
        top:auto;
        width:auto;
        height:auto;
        background:transparent;
    }
    .nav-wrap ul.nav {
        display:flex;
        align-items:center;
        border-top:none;
    }
    .nav-wrap ul.nav li {
        border-bottom:none;
        margin:0 1em;
    }
    .nav-wrap ul.nav li a {
        -webkit-transform: perspective(1px) translateZ(0);
        transform: perspective(1px) translateZ(0);
        box-shadow: 0 0 1px transparent;
        position: relative;
        overflow: hidden;
        height:80px;
        padding:0;
    }
    .nav-wrap ul.nav li a::after {
        content: "";
        position: absolute;
        z-index: -1;
        left: 0;
        right: 100%;
        bottom: 0;
        background:#24edef;
        height: 3px;
        -webkit-transition-property: right;
        transition-property: right;
        -webkit-transition-duration: 0.3s;
        transition-duration: 0.3s;
        -webkit-transition-timing-function: ease-out;
        transition-timing-function: ease-out;
        padding-left:0;
    }
    .nav-wrap ul.nav li a:hover::after, .nav-wrap ul.nav li a:focus::after, .nav-wrap ul.nav li a:active::after {
        right: 0;
    }
    #header .contactBtn {
        margin-left:1em;
    }
    #header .contactBtn a {
        display:flex;
        justify-content:center;
        align-items:center;
        width:80px;
        height:80px;
        background:#3fa9f5;
    }
    #header .contactBtn a:hover {
        background:#24edef;
    }
    #header .contactBtn a img {
        width:32px;
        opacity:1;
    }
    #header .contactBtn a:hover img {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
    #header.sticky {
        height:60px;
    }
    #header.sticky .headerLogo img {
        width:192px;
    }
    #header.sticky .nav-wrap ul.nav li {
        font-size:.888em;
    }
    #header.sticky .nav-wrap ul.nav li a {
        height:60px;
    }
    #header.sticky .contactBtn a {
        width:60px;
        height:60px;
    }
    #header.sticky .contactBtn a img {
        width:30px;
    }
}
@media screen and (min-width: 992px), print {
    #header {
        padding:0 0 0 2em;
    }
    .nav-wrap ul.nav li {
        margin:0 1.8em;
    }
}


/* ------------------------------
	footer
------------------------------ */
#footer {
    background:#111;
    color:#ccc;
}
#footer > .row {
    padding:1em 7%;
}
#footer > .row > .col {
    padding:3em 7%;
}
#footer > .row > .col.topLine {
    border-top:solid 1px #666;
}
#footer > .row > .col:last-child {
    padding:0;
}
#footer > .row > .col > .wrapper {
    width:fit-content;
    margin:auto;
}
ul.footerNav {
    list-style:none;
    padding:0;
}
ul.footerNav li {
    text-align:center;
    margin:1.1em auto;
}
ul.footerNav li a {
    color:#ccc;
    text-decoration:none;
}
ul.footerNav li a:hover {
    color:#24edef;
}
@media screen and (min-width: 768px), print {
    #footer > .row {
        padding:0;
    }
    #footer > .row > .col {
        border-right:solid 1px #666;
        box-sizing:border-box;
        padding:3em 1em;
        display:flex;
        justify-content:center;
        align-items:center;
        width:86%;
    }
    #footer > .row > .col.topLine {
        border-top:none;
    }
    #footer > .row > .col:last-child {
        border-right:none;
    }
}
#pagetop a {
    display:block;
    padding:.8em;
    background:#3fa9f5;
    color:#fff;
    text-decoration:none;
    text-align:center;
    font-size:1.25em;
}
#pagetop a:hover {
    background:#24edef;
}
#pagetop a .fas {
    transition: all 0.2s ease-out;
}
#pagetop a:hover .fas {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
}
@media screen and (min-width: 768px), print {
    #pagetop {
        position:fixed;
        right:0;
        bottom:0;
        z-index:1000;
    }
    #pagetop a {
        width:60px;
        height:45px;
        padding:15px 0 0;
        font-size:1em;
    }
}


/* ------------------------------
	pageTitle
------------------------------ */
.pageTitle {
    padding:20% 1em 40px;
    background-repeat:repeat;
    background-position:center center;
    background-size:cover;
    background-color:#666,gray;
    color:#fff;
    position:relative;
}
.pageTitle::before {
    content:"";
    position:absolute;
    z-index:0;
    inset:0;
    background:rgba(17, 17, 17, .5);
}
.pageTitle::after {
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:-20px;
    display:block;
    width:3px;
    height:40px;
    margin:auto;
    background:#3fa9f5;
}
.page-business .pageTitle {
    background-image:url('../images/photo_1440_machine_01.jpg');
}
.page-equipment .pageTitle {
    background-image:url('../images/photo_1440_factory_01.jpg');
}
.page-company .pageTitle {
    background-image:url('../images/photo_1440_entrance_01.jpg');
}
.page-recruit .pageTitle {
    background-image:url('../images/photo_1440_employee-group_01.jpg');
}
.page-contact .pageTitle {
    background-image:url('../images/photo_1440_tools_01.jpg');
}
.pageTitle .wrapper {
    position:relative;
    z-index:1;
    text-align:center;
}
.pageTitle h1 {
    margin:0;
    letter-spacing:.2em;
}
@media screen and (min-width: 768px), print {
    .pageTitle {
        padding:15% 1em 60px;
    }
    .pageTitle::after {
        bottom:-30px;
        height:60px;
    }
}
@media screen and (min-width: 1200px), print {
    .pageTitle {
        padding:300px 1em 60px;
    }
}


/* ------------------------------
	main
------------------------------ */
@media screen and (min-width: 768px), print {
    .landingPoint {
        margin-top:-80px;
        padding-top:80px;
    }
}

/* twoColumn */
.twoColumn .secondary {
    margin-bottom:3em;
}
@media screen and (min-width: 1200px), print {
    .twoColumn {
        display:flex;
        align-items:start;
        gap:5%;
    }
    .twoColumn .secondary {
        width:250px;
        position:sticky;
        top:0;
        margin-top:-80px;
        padding-top:80px;
    }
    .twoColumn .primary {
        flex:1;
    }
}

/* contentNav */
.contentNav {
    background:#f0f8fe;
    padding:1em 7%;
    border-radius:1em;
}
.contentNav ul {
    list-style:none;
    margin:0;
    padding:0;
}
.contentNav ul li {
    margin:.8em auto;
	padding-left:1.5em;
	text-indent:-1.5em;
}
.contentNav ul li::before {
    content:"\f107";
    font-family:"Font Awesome 5 Free";
    font-weight:bold;
    margin-right:.5em;
    color:#3fa9f5;
}
.contentNav ul li a {
    text-decoration:none;
    color:#111;
}
.contentNav ul li a:hover {
    color:#111;
}

/* contactBlock */
.contactBlock {
    background:url('../images/back_logomark.png') repeat-y center center;
    background-size:105%;
    border-top:solid 1px #111;
    overflow:hidden;
}
.contactBlock .enHeading {
    text-align:center;
    margin-bottom:-.25em;
    text-shadow:0 1px 0 #fff;
}
.contactBlock img {
    position:relative;
    z-index:-1;
}
@media screen and (min-width: 768px), print {
    .contactBlock .enHeading {
        font-size:4em;
    }
    .contactBlock img {
        border-radius:1em;
    }
}
@media screen and (min-width: 992px), print {
    .contactBlock .wrapper {
        display:flex;
        justify-content:left;
    }
    .contactBlock .wrapper > div:last-child {
        flex:1;
    }
    .contactBlock .enHeading {
        margin-right:.2em;
        text-align:left;
        writing-mode: vertical-rl;
    }
}
@media screen and (max-width: 767px) {
    .contactBlock.pdLR img {
        width:100vw;
        max-width:none;
        margin-left:-7vw;
    }
}

/* historyDl */
dl.historyDl {
    border:none;
    padding:0;
}
dl.historyDl dt {
    display:flex;
    justify-content:space-between;
    color:#3fa9f5;
    padding:0;
}
dl.historyDl dd {
    margin-bottom:1.2em;
    padding:0;
}
dl.historyDl dt::after {
    flex:1;
    content:"";
    position:relative;
    top:.8em;
    display:block;
    height:1px;
    margin-left:.5em;
    margin-right:.5em;
    background:#3fa9f5;
}
dl.historyDl dt span {
    display:inline-block;
    width:5em;
}
@media screen and (min-width: 768px), print {
    dl.historyDl {
        display:flex;
        flex-wrap:wrap;
    }
    dl.historyDl dt {
        width:11em;
        margin-bottom:1.2em;
    }
    dl.historyDl dd {
        width:calc(100% - 11em);
    }
}

/* postList */
ul.postList {
    list-style:none;
    padding:0;
    border-top:solid 1px #ddd;
}
ul.postList > li {
    margin:0;
    padding:3em 0;
    border-bottom:solid 1px #ddd;
}
ul.postList > li .thumbnail img {
    border-radius:4px;
}
ul.postList h3 {
    margin-bottom:0;
}
@media screen and (min-width: 576px), print {
    ul.postList > li {
        display:flex;
    }
    ul.postList > li .thumbnail {
        width:38%;
        margin-right:5%;
    }
    ul.postList > li .detail {
        flex:1;
    }
    ul.postList h3 {
        margin-top:0;
    }
}

/* tagIcon */
ul.tagIcon {
    list-style:none;
    padding:0;
}
ul.tagIcon li {
    display:inline-block;
    margin:0 .2em .5em 0;
    padding:.1em 1em;
    border-radius:4px;
    background:#3fa9f5;
    color:#fff;
}

/* formArea */
::-webkit-input-placeholder {color:#999}
:-moz-placeholder {color:#999}
.formArea table {
    border-collapse:collapse;
    width:100%;
}
.formArea input[type="text"],
.formArea input[type="password"],
.formArea input[type="email"],
.formArea input[type="tel"],
.formArea select,
.formArea textarea {
    border:none;
    background:#f6f6f6;
    color:#222;
    padding:.6em .4em;
    border:solid 1px #ddd;
    box-shadow:none;
    border-radius:3px;
}
.formArea input[type="text"],
.formArea input[type="password"],
.formArea input[type="email"],
.formArea input[type="tel"],
.formArea textarea {
    box-sizing:border-box;
    width:100%;
    max-width:100%;
}
.formArea button,
.formArea input[type="submit"],
.formArea input[type="reset"],
.formArea input[type="button"] {
	-webkit-appearance:none;
    padding:1.5em;
    border:none;
    border-radius:6px;
    background:#ddd;
    color:#222;
    transition:all .2s;
}
.formArea button:hover,
.formArea input[type="reset"]:hover,
.formArea input[type="button"]:hover {
    background:#ccc;
    color:#000;
}
.formArea input[type="submit"] {
    display:block;
    width:100%;
    margin:auto;
    background:#3fa9f5;
    color:#fff;
}
.formArea input[type="submit"]:hover {
    background:#24edef;
}
.formArea textarea {
    width:100%!important;
    height:12em!important;
}
.hissu {
    display:inline-block;
    margin:.5em;
    padding:2px .5em;
    border-radius:3px;
    background:#d33;
    color:#fff;
    line-height:1.2;
    font-size:.666em;
    font-weight:700;
}
.mfp_element_submit, .mfp_element_reset, .mfp_element_button, button.mfp_next, button.mfp_prev {
    text-shadow:none;
    font-size:inherit;
}
@media screen and (min-width: 768px), print {
    .formArea .rpsTable th {
        width:13em;
    }
}
@media screen and (max-width: 767px) {
    .formArea .rpsTable th,
    .formArea .rpsTable td {
        padding-left:0;
        padding-right:0;
    }
}

/* indexEyecatch */
.indexEyecatch {
    height:112vw;
    max-height:calc(100vh - 60px);
    position:relative;
}
.indexEyecatch .catchcopy {
    color:#fff;
    background: linear-gradient(transparent, #111 75%);
    position:absolute;
    bottom:0;
    width:100%;
    padding:7% 0;
}
.indexEyecatch .catchcopy > p {
    font-size:2.125em;
    margin:5%;
    line-height:1.5;
}
.indexEyecatch .catchcopy > p > span {
    display:inline-block;
}
@media screen and (min-width: 576px), print {
    .indexEyecatch .catchcopy > p {
        font-size:3em;
    }
}
@media screen and (min-width: 768px), print {
    .indexEyecatch {
        height:calc(100vh - 80px);
    }
}
@media screen and (min-width: 992px), print {
    .indexEyecatch .catchcopy > p {
        font-size:3.75em;
        margin-left:10%;
        margin-bottom:2%;
    }
}

@media screen and (min-width: 768px), print {
    .enHeading.ourMind {
        margin-top:-.2em;
    }
}

/* indexService */
.indexService {
    overflow:hidden;
}
.indexService .serviceItem {
    margin-bottom:2em;
}
.indexService .serviceItem .heading {
    font-size:1.25em;
}
.indexService .serviceItem .fw_b::before {
    content:"01";
	font-family: "EB Garamond", "Zen Old Mincho", serif;
    font-size:3.5em;
    vertical-align:text-top;
    line-height:.6;
    margin-right:.1em;
    color:#3fa9f5;
}
.indexService .serviceItem.no_02 .fw_b::before {
    content:"02";
}
.indexService .serviceItem.no_03 .fw_b::before {
    content:"03";
}
.indexService .serviceItem .photo {
    width:100vw;
    height:56.25vw;
    margin:-.4em 0 0 -7vw;
    background-color: #ddd;
    background-repeat:no-repeat;
    background-position:center center;
    background-size:cover;
}
.indexService .serviceItem.no_01 .photo {
    background-image:url('../images/back_service_01.jpg');
}
.indexService .serviceItem.no_02 .photo {
    background-image:url('../images/back_service_02.jpg');
}
.indexService .serviceItem.no_03 .photo {
    background-image:url('../images/back_service_03.jpg');
}
@media screen and (min-width: 576px), print {
    .indexService .serviceItem .heading {
        font-size:1.5em;
    }
}
@media screen and (min-width: 768px), print {
    .indexService .serviceItem {
        float:left;
        width:44%;
    }
    .indexService .serviceItem.no_02,
    .indexService .serviceItem.no_03 {
        float:right;
        width:52%;
    }
    .indexService .serviceItem.no_02 {
        display:flex;
        flex-direction:column-reverse;
        text-align:right;
    }
    .indexService .serviceItem .heading {
        font-size:1.125em;
    }
    .indexService .serviceItem.no_02 .heading {
        margin-top:-.5em;
    }
    .indexService .serviceItem .fw_b::before {
        font-size:4em;
    }
    .indexService .serviceItem.no_02 .fw_b::before {
        vertical-align:text-bottom;
    }
    .indexService .serviceItem .photo {
        width:auto;
        height:0;
        padding-top:177.777%;
        margin:-.4em 0 0;
        border-radius:1em;
    }
    .indexService .serviceItem.no_02 .photo,
    .indexService .serviceItem.no_03 .photo {
        padding-top:66.666%;
    }
}

/* indexCompany */
.indexCompany {
    background:url('../images/back_1440_gaikan_01.jpg') no-repeat center center;
    background-size:cover;
    color:#fff;
}

.businessService {
    background:url('../images/back_line.png') top 10% left 10%;
}

/* businessItem */
.businessItem {
    display:flex;
    justify-content:flex-end;
    align-items:flex-start;
}
.businessItem.reverse {
    flex-direction:row-reverse;
}
.businessItem .heading {
    writing-mode:vertical-rl;
    letter-spacing:.1em;
    margin-left:3%;
    margin-right:3%;
    padding:0 .5em 0 .3em;
    position: relative;
    line-height:1;
}
.businessItem .heading::before {
    content:"";
    display:inline-block;
    width:3px;
    height:1em;
    background:#111;
    margin-bottom:.2em;
    position:absolute;
    top:0;
    right:0;
}
@media screen and (min-width: 576px), print {
    .businessItem .heading {
        margin-left:10%;
        margin-right:10%;
    }
}

/* businessStrengths */
.businessStrengths .enHeading {
    margin-top:-.4em;
}