@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: 'Manrope', 'Noto Sans JP', 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, sans-serif;
	color:#1e1e1e;
	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:none}
caption {background: #999;color: #fff}
th {padding:1em;background:transparent;border-bottom:solid 1px #0070c0}
td {padding:1em;background:transparent;border-bottom:solid 1px #ddd}
hr {color:#ccc;background-color:#ccc}
fieldset {border:1px solid #ccc}
a {text-decoration:underline;text-underline-offset:.3em;color:#0070c0}
a:visited {text-decoration:;color:#3b8dc8}
a:hover {text-decoration:none;color:;}
a:active {text-decoration:underline;color:#1e1e1e}


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

/***** 文字色 *****/
.txc_01,a.txc_01 {color:#0070c0}/* 水色 */
.txc_02,a.txc_02 {color:#b8cde7}/* 薄水色 */
.txc_03,a.txc_03 {}/*  */

/***** 背景 *****/
.bgc_f6 {background:#f6f6f6;}
.bgc_01 {}/*  */
.bgc_02 {}/*  */
.bgc_03 {}/*  */

/***** 見出し *****/
.h_01 {
    /*background:#0070c0;
    color:#fff;
    padding:1em;*/
    padding:1.25em 0 1.25em .75em;
    background:#f1f7fc;
    color:#0070c0;
    border-left:solid 5px #0070c0;
    border-radius:5px;
}
.h_02 {}
.h_03 {}

/***** ボタン *****/
.btn_01,
.btn_02,
.btn_03 {
    display:inline-block;
    text-decoration:none!important;
    line-height:1.4;
    position:relative;
    text-align:center;
}
.btn_01 {
    background:#0070c0;
    color:#fff;
    padding:.5em 1.5em;
    border-radius:100vmax;
}
.btn_01:hover {
    opacity:.7;
}
a.btn_02 {
    display:flex;
    align-items:center;
    width:fit-content;
    background:#0070c0;
    color:#fff;
    padding:1.25em 1.25em 1.25em 1.75em;
    border-radius:100vmax;
    font-weight:bold;
}
a.btn_02.d_block {
    justify-content:space-between;
    width:auto;
}
a.btn_02::after {
    content:"\f061";
    font-family:"Font awesome 5 free";
    font-weight:700;
    font-size:.666em;
    display:inline-block;
    width:1em;
    height:1em;
    margin-left:1.75em;
    padding:.75em;
    line-height:1;
    border-radius:50%;
    text-align:center;
    transition: all .2s;
    background:#fff;
    color:#0070c0;
}
a.btn_02:hover {
    background:#b8cde7;
    color:#0070c0;
}
a.btn_02:hover::after {
    background:#0070c0;
    color:#fff;
}
@media screen and (min-width: 576px), print {
    a.btn_02 {
        padding-left:2.5em;
    }
    a.btn_02::after {
        margin-left:2.5em;
    }
}
.btn_03 {}

/***** リスト *****/
.list_01 {}
.list_02 {}
.list_03 {}

/***** その他 *****/
@media screen and (max-width: 575px) {
    table.rpsTable th,
    table.rpsTable td {
        display:block;
    }
    table.rpsTable th {
        border-bottom:none;
        padding-bottom:.25em;
    }
    table.rpsTable td {
        padding-top:.25em;
    }
}
.boderBox_01 {
    border:solid 1px #ddd;
    border-radius:5px;
}

/* ------------------------------
	loading
------------------------------ */
#loading {
    width:100vw;
    height:100vh;
    transition:all 1s;
    background-color:#fff;
    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:#ddd;
    border-radius:100%;
    animation:sk-scaleout 1.0s infinite ease-in-out;
}
/* animation:sk-scaleout */
@keyframes sk-scaleout {
    0% {
        transform:scale(0);
    } 100% {
        transform:scale(1.0);
        opacity:0;
    }
}
.loaded {
    opacity:0;
    visibility:hidden;
}


/* ------------------------------
	レイアウト
------------------------------ */
#container {overflow:hidden}
.mxW {
    max-width:1366px;
    margin-left:auto;
    margin-right:auto;
}
.pdLR {
    padding-left:1em;
    padding-right:1em;
}
.pdLRw {
    padding-left:5%;
    padding-right:5%;
}
.mgT {margin-top:3em}
.mgB {margin-bottom:3em}
.pdT {padding-top:3em}
.pdB {padding-bottom:3em}
@media screen and (min-width: 576px), print {
    .pdLR {
        padding-left:5%;
        padding-right:5%;
    }
    .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: 992px), print {
    .mgT {margin-top:5em}
    .mgB {margin-bottom:5em}
    .pdT {padding-top:5em}
    .pdB {padding-bottom:5em}
}
@media print {
    #container {width:1000px}
}


/* ------------------------------
	header
------------------------------ */
#header {
    padding:1em;
}
#header .mxW {
    display:flex;
    align-items:center;
}
.headerLogo {
    margin:0;
    line-height:1;
    font-size:1em;
}
.headerLogo a:hover {
    opacity:.7;
}
.headerLogo a img {
    opacity:1;
    vertical-align:middle;
}
.headerLogo a img.logo {
    width:78px;
    margin-right:.5em;
}
.headerLogo a img.company-name {
    width:91px;
}
ul.nav {
    list-style:none;
    margin:0;
    padding:100px 10%;
}
ul.nav li {
    margin:0;
    padding:1em 0;
}
ul.nav li a {
    padding:1em;
    color:#fff;
    text-decoration:none;
}
@media screen and (min-width: 576px), print {
    #header {
        padding:2em;
    }
    .headerLogo a img.logo {
        width:117px;
        margin-right:1em;
    }
    .headerLogo a img.company-name {
        width:137px;
    }
}
@media screen and (min-width: 992px), print {
    #header {
        padding:3em 2em;
    }
    .nav-wrap {
        flex:1;
    }
    ul.nav {
        display:flex;
        justify-content:flex-end;
        align-items:center;
        margin:0;
        padding:0;
    }
    ul.nav li {
        margin:0 0 0 2em;
        padding:0;
    }
    ul.nav li a {
        padding:.5em .5em;
        color:#1e1e1e;
        border-top: solid 3px transparent;
        border-bottom: solid 3px transparent;
    }
    ul.nav li a:hover {
        border-bottom-color:#0070c0;
    }
    ul.nav li a.btn_01 {
        color:#fff;
        padding:.5em 1.5em;
    }
}

/* ハンバーガーメニュー */
.nav-button {display:block}
.nav-wrap {display:none}
@media screen and (min-width: 992px), print {
	.nav-button {display:none}
    .nav-wrap {display:block !important}
}
@media screen and (max-width: 991px) {
    .nav-button {
        width:50px;
        height:50px;
        position:absolute;
        z-index:101;
        top:2em;
        right:2em;
        cursor:pointer;
        border-radius:50%;
        background:#fff;
    }
    .nav-button.active {
        position:fixed;
    }
    .nav-button span {
        transition:all 0.3s;
        display:inline-block;
        width:22px;
        height:2px;
        box-sizing:border-box;
        position:absolute;
        left:14px;
        background:#0070c0;
    }
    .nav-button span:nth-of-type(1) {top:18px}
    .nav-button span:nth-of-type(2) {top:24px}
    .nav-button span:nth-of-type(3) {bottom:18px}
    .nav-button.active span:nth-of-type(1) {
        -webkit-transform: translateY(6px) rotate(-45deg);
        transform: translateY(6px) rotate(-45deg);
    }
    .nav-button.active span:nth-of-type(2) {
        opacity:0;
    }
    .nav-button.active span:nth-of-type(3) {
        -webkit-transform: translateY(-6px) rotate(45deg);
        transform: translateY(-6px) rotate(45deg);
    }
    .nav-wrap {
        width:100%;
        height:100%;
        position:fixed;
        z-index:100;
        left:0;
        top:0;
        overflow-x:hidden;
        overflow-y:auto;
        overscroll-behavior:none;
        background:#0070c0;
        color:#fff;
        font-size:1.125em;
    }
    .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;
        transform: translateY(16px);
        }
        100% {
        opacity: 1;
        transform: translateY(0);
        }
    }
    .nav-wrap.close {display:none}
    /*.nav-wrap .nav {position:relative}*/
    .nav-wrap .btn_01 {
        background:#fff;
        color:#0070c0;
        padding:1.25em 2em;
    }
}
@media screen and (max-width: 575px) {
    .nav-button {
        top:5px;
        right:5px;
    }
}


/* ------------------------------
	footer
------------------------------ */
#footer {
    position:relative;
    background:#0070c0;
    color:#fff;
}
#footer .row {
    align-items:center;
}
#footer .row .fs_ll {
    margin:1em 0;
}
.footerLogo a:hover {
    opacity:.7;
}
.footerLogo a img {
    opacity:1;
    vertical-align:middle;
}
.copyright {
    position:absolute;
    right:1em;
    bottom:1em;
}
@media screen and (min-width: 992px), print {
    .copyright {
        right: auto;
        left:1em;
        bottom:1em;
    }
}
#pagetop a {
    display:block;
    padding:1em;
    background:#1e1e1e;
    color:#fff;
    text-align:center;
    text-decoration:none;
}
@media screen and (min-width: 768px), print {
    #pagetop a {
        width:50px;
        height:34px;
        padding:16px 0 0;
        line-height:1;
        position:fixed;
        right:1em;
        bottom:2em;
        background:#fff;
        color:#0070c0;
        border-radius:100vmax;
    }
    #pagetop a:hover {
        background:#b8cde7;
    }
}


/* ------------------------------
	pageTitle / main common
------------------------------ */
.pageTitle {
    margin:1em 0;
    font-weight:bold;
}
.pageTitle::before {
    content:"―";
    margin-right:.25em;
}
.enTitle {
    color:#b8cde7;
    font-weight:bold;
    font-size:3em;
    line-height:1.3;
}
.jpTitle {
    font-weight:bold;
    font-size:1em;
}
.jpTitle::before {
    content:"―";
    margin-right:.25em;
}
@media screen and (min-width: 576px), print {
    .enTitle {
        font-size:4em;
    }
}
.imagePhoto {
    padding-top:60%;
    background-position:center center;
    background-repeat:no-repeat;
    background-size:cover;
    border-radius:1em;
}
@media screen and (min-width: 576px), print {
    .imagePhoto {
        padding-top:30%;
    }
}

dl.dlTable {
    display:flex;
    flex-wrap:wrap;
    border:none;
    padding:0;
}
dl.dlTable dt,
dl.dlTable dd {
    margin:0;
    padding:1em 0;
}
dl.dlTable dt {
    width:30%;
    border-bottom:solid 1px #0070c0;
}
dl.dlTable dd {
    width:70%;
    border-bottom:solid 1px #ddd;;
}
@media screen and (min-width: 576px), print {
    dl.dlTable dt,
    dl.dlTable dd {
        margin:0;
        padding:1.5em 5%;
    }
    dl.dlTable dt {
        width:20%;
    }
    dl.dlTable dd {
        width:60%;
    }
}

/* ------------------------------
	main
------------------------------ */
.indexEyecatchWrap {
    padding-top:120px;
    background:url(../images/back_triangle.png) no-repeat right bottom;
    background-size:100%;
}
.indexEyecatchWrap .textWrap {
    margin-top:-120px;
}
.indexEyecatch {
    padding:4% 4% 55%;
    background-image:url(../images/back_index-eyecatch.png), url(../images/back_space.jpg);
    background-repeat:no-repeat;
    background-position:left top, center 5%;
    background-size:contain, cover;
    border-radius:0 0 1em 1em;
}
.indexEyecatch .txc_02 {
    font-size:.8125em;
}
.indexEyecatch h2 {
    font-size:1.75em;
    font-weight:bold;
    margin:0;
    text-shadow:1px 1px 0 #fff;
}
@media screen and (min-width: 420px), print {
    .indexEyecatchWrap {
        background-size:90%;
    }
    .indexEyecatch h2 {
        font-size:2em;
    }
}
@media screen and (min-width: 576px), print {
    .indexEyecatchWrap {
        background-size:70%;
    }
    .indexEyecatch {
        padding-bottom:45%;
    }
    .indexEyecatch .txc_02 {
        font-size:1em;
    }
    .indexEyecatch h2 {
        font-size:2.8em;
    }
}
@media screen and (min-width: 992px), print {
    .indexEyecatchWrap {
        padding-top:0;
        background-size:599px;
    }
    .indexEyecatchWrap .textWrap {
        margin-top:0;
    }
    .indexEyecatch {
        padding-bottom:35%;
    }
    .indexEyecatch .txc_02 {
        font-size:1.25em;
    }
    .indexEyecatch h2 {
        font-size:4em;
    }
}
@media screen and (min-width: 1200px), print {
    .indexEyecatch {
        padding-bottom:25%;
    }
}

.indexServiceWrap {
    background:url("../images/back_circle.png") no-repeat left bottom;
    background-size:100%;
}
@media screen and (min-width: 420px), print {
    .indexServiceWrap {
        background-size:90%;
    }
}
@media screen and (min-width: 576px), print {
    .indexServiceWrap {
        background-size:70%;
    }
}
@media screen and (min-width: 992px), print {
    .indexServiceWrap {
        background-size:600px;
        background-position:left center;
    }
}
.imagePhoto.service {
    background-image:url("../images/back_machine_01.jpg");
}

.indexCompanyWrap {
    background:url("../images/back_square.png") no-repeat right bottom;
    background-size:100%;
}
@media screen and (min-width: 420px), print {
    .indexCompanyWrap {
        background-size:90%;
    }
}
@media screen and (min-width: 576px), print {
    .indexCompanyWrap {
        background-size:70%;
    }
}
@media screen and (min-width: 992px), print {
    .indexCompanyWrap {
        background-size:600px;
        background-position:right top;
    }
}
.imagePhoto.company {
    background-image:url("../images/back_tokushima.jpg");
}

.indexNewsWrap {
    background:#f6f6f6;
}
dl.newsList {
    margin:0;
    padding:3em 5%;
    background:#fff;
    border:none;
}
dl.newsList dt {
    font-weight:bold;
    color:#0070c0;
}
dl.newsList dd {
    margin-bottom:1.25em;
}
@media screen and (min-width: 576px), print {
    dl.newsList {
        display:flex;
        flex-wrap:wrap;
    }
    dl.newsList dt {
        width:25%;
    }
    dl.newsList dd {
        width:75%;
    }
}
@media screen and (min-width: 768px), print {
    dl.newsList {
        padding:3em 10%;
    }
}

.contactWrap {
    background:url("../images/back_machine_02.jpg") no-repeat center center;
    background-size:cover;
    position:relative;
}
.contactWrap::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5);
}
.contactWrap > div {
    padding:3em 5%;
    background:#fff;
    border-radius:1em;
    position: relative;
    /*z-index: 1;*/
}
@media screen and (min-width: 992px), print {
    .contactWrap > div {
        padding:4em 10%;
    }
}
@media screen and (max-width: 575px) {
    .contactWrap .fs_l {
        font-size:1em;
    }
}

.policyWords {
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
}
.policyWords span {
    display:flex;
    margin:.5em;
    align-items:center;
    justify-content:center;
    width:5em;
    height:5em;
    border:solid 3px #fff;
    border-radius:50%;
    box-shadow:0 0 0 1px #0070c0;
    color:#ffff00;
    background:#0070c0;
}

.serviceLeadWrap {
    background:url("../images/back_yms.png") no-repeat bottom -5px right 0;
    background-size:90%;
}
@media screen and (min-width: 992px), print {
    .serviceLeadWrap {
        background-size:800px;
    }
}
dl.flowList {
    border:none;
    padding:0;
}
dl.flowList dt {
	margin:0;
    padding:.75em 5%;
    background: #0070c0;
    color:#fff;
    text-align:center;
    border-radius:.5em;
    font-weight:bold;
}
dl.flowList dd {
	margin:0 0 .8em;
    padding:.75em 5%;
    background:#fff;
    border-radius:0 0 .5em .5em;
}
@media screen and (min-width: 576px), print {
    dl.flowList {
        display:flex;
        flex-wrap:wrap;
        align-items:stretch;
    }
    dl.flowList dt {
        display:flex;
        justify-content:center;
        align-items:center;
        width:20%;
        margin:0 0 .8em;
        padding:1em 5%;
    }
    dl.flowList dd {
        width:60%;
        padding:1em 5%;
        border-radius:0 .5em .5em 0;
    }
}
ul.makerList {
    list-style:none;
    padding:0;
}
ul.makerList li {
    display:inline-block;
    margin:.4em 1.2em .4em 0;
}
ul.makerList li::before {
    content:"\f0da";
    font-family:"Font Awesome 5 Free";
    font-weight:700;
    color:#999;
    margin-right:.25em;
}
ul.makerList li a {
    text-decoration:none;
}
ul.makerList li a:hover {
    text-decoration:underline;
}


::-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:#f0f0f0;
    color:#222;
    padding:.6em .4em;
    box-shadow:none;
    border-radius:5px;
}
.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:1em 2em;
    border:none;
    border-radius:100vmax;
    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"] {
    background:#0c6;
    color:#fff;
}
.formArea input[type="submit"]:hover {
    background:#1d9f4e;
}
.formArea textarea {
    width:100%!important;
    height:12em!important;
}
.hissu {
    display:inline-block;
    margin:.5em;
    padding:2px .5em;
    border-radius:5px;
    background:#f33;
    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;
}