/*システムサービス*/
@charset "utf-8";

body {
    margin: 0px;
    padding: 0px;
    background: #fff;
    color: #262729;
    font-family: Roboto, "Noto Sans JP", "Yu Gothic", "游ゴシック", YuGothic, "Hiragino Kaku Gothic Pro", "メイリオ", Helvetica, Arial, Verdana, sans-serif;
    font-size: 0.96rem;
    font-weight: 500;
    letter-spacing: .012em;
    line-height: 1.8;
}

h1,
h2,
h3,
h4,
h5,
p,
ul,
ol,
li,
dl,
dt,
dd,
form,
figure,
form {
    margin: 0px;
    padding: 0px;
    font-size: 100%;
}

ul {
    list-style-type: none;
}

ol {
    padding-left: 10px;
    padding-bottom: 15px;
}

img {
    border: none;
    max-width: 100%;
    height: auto;
    vertical-align: middle;
}

table {
    border-collapse: collapse;
    font-size: 100%;
    border-spacing: 0;
}

iframe {
    width: 100%;
}

h6 {
    margin: 0px auto 15px auto;
    width: 260px;
    font-size: 14px;
    position: relative;
    padding: 4px 4px;
    text-align: center;
    border: 2px solid #000;
    border-radius: 0 10px 10px 10px;
}

h6:before {
    font-size: 12px;
    position: absolute;
    top: -27px;
    left: -2px;
    height: 24px;
    padding: 0.1em 1.5em;
    content: '施工例';
    color: #fff;
    border-radius: 10px 10px 0 0;
    background: #000;
}

h6 span {
    background: linear-gradient(transparent 90%, #fee100 90%);
}
.newsbox{padding: 0 10px;    max-width: 800px; width: 65%; margin: auto;}
.newsbox th{font-weight: normal;    width: 20px;    vertical-align: top;
    text-align: left;}
.newsbox td{text-align: left;}
.bold2{font-weight: 800; font-size:1.1rem;}
.flexbox4 {
    display: flex;
}

.graybox {    position: relative;
    display: flex;
    justify-content: space-between;
    width: 100%;
    padding-top: 30px;
    background-color: #f7f6f4;
}

.graybox2 {
    background-color: #f7f6f4;
}

.workpics2 {
    margin: 20px 30px;
    position: relative;
    width: 27%;
    text-align: left;
    display: flex;
    flex-wrap: wrap;
    background: #fff;
    justify-content: space-between;
}

i {
    margin-right: 5px;
    margin-left: 5px;
}

.examples {
    min-width: 170px;
    margin: auto;
    transform: rotate(-10deg);
    width: 30%;
    bottom: -3vw;
    position: relative;
    z-index: 3;
    max-width: 250px;
}

.afterclean {
    max-width: 380px;
    width: 80%;
    margin: auto;
    position: relative;
    z-index: 5;
}

.afterclean img {
    border-radius: 30px;
}

.yellowmark {
    left: -16%;
    width: 16%;
    position: absolute;
    z-index: 10;
    top: -22%;
}

.sekotitle {
    font-size: 1.1rem;
    font-weight: 700;
}

.sekotitle span {
    border-top: 2px solid #262729;
    margin-right: 3vw;
    font-size: 0.8rem;
}

.seko {
    background: #eee;
    position: relative;
    z-index: 2;
    padding-bottom: 10vw;
}

.contentW {
    max-width: 780px;
    width: 70%;
    text-align: center;
    padding: 0vw 3vw;
    border-radius: 10px;
    margin: auto;
}

.contentW p {
    font-weight: bold;
}

.whitebox2 {
    width: 70%;
    margin: auto;
    background: #eee;
}

.whitebox3 {
    background: #fff;
    border-radius: 6px;
    opacity: 0.9;
}

.whitebox2 p {
    text-align: left;
}

.blackline2,
.blackline3 {
    padding: 9px 10px 9px 25px;
    vertical-align: middle;
    text-align: left;
    background-color: #000;
    position: relative;
}

.blackline3 {
    margin-top: 80px;
}

.blackline2 p,
.blackline2 a,
.blackline3 p,
.blackline3 a {
    text-decoration-line: none;
    font-size: 0.95rem;
    font-weight: 600;
    color: #fff;
    letter-spacing: 1px;
}
.left{text-align: left;}
.rem075 {
    font-size: 0.75rem;
}

.flexbox {
    position: relative;
    max-width: 800px;
    width: 70%;
    min-height: 90px;
    justify-content: space-between;
    display: flex;
    margin: 2vw auto;
    line-height: 1.5;
}

.detail1,
.detail2 {
    margin: 1vw;
    border-radius: 5px;
    position: absolute;
    padding: 0.5vw 1vw;
    bottom: 0;
    right: 0;
}

.detail1 p,
.detail2 p {
    color: white;
}

.detail1 {
    background: #33bdbd
}

.detail2 {
    background: #eeb517;
}

.flexbox2,
.flexbox3 {
    justify-content: space-between;
    width: 85%;
    max-width: 880px;
    display: flex;
    position: relative;
    margin: 10px auto 55px auto;
}

.flexbox3 {
    background: #fffee091}

.flexbox2 span {
    color: #33bdbd;
    margin-right: 0.5vw;
}

.flexbox2 {
    margin: 10px auto 96px auto;
    background: #e2f8fe61;
}

.flexbox3 span {
    color: #eeb517;
    margin-right: 0.5vw;
}

.flex2img,
.flex3img {
    margin: auto;
    width: 59%;
}

.flex2text,
.flex3text {
    text-align: left;
    padding: 0 2vw;
    width: 40%;
    padding-bottom: 35px;
    background: #fff;;
}

.flex2text p2,
.flex3text p2 {
    font-size: 1.2rem;
    line-height: 1.4;
}

.flex2text p,
.flex3text p {
    font-size: 0.8rem;
    line-height: 1.4;
}

.flex2text p3,
.flex3text p3 {
    font-size: 0.7rem;
    line-height: 1.2;
    font-weight: 700;
}

.flexchd3 {
    font-size: 0.95rem;
    width: 50%;
    line-height: 1.8em;
    text-align: left;
    padding-left: 20px;
}

.flexchd1 {
    font-size: 0.8rem;
    bottom: 0;
    font-weight: 700;
    vertical-align: bottom;
    margin-bottom: 0;
    position: absolute;
    right: 0;
    font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

.flexchd1 p {
    text-align: right;
    line-height: 1.7;
}

.flexchd1 span {
    font-size: 1.15rem;
}

.flexchd2 {
    width: 50%;
    max-width: 300px;
}

.flexchd2 img {
    border-radius: 20px;
}

.workpics2 img {
    border-radius: 0px;
}

.workpics img {
    border-radius: 6px 6px 0px 0px;
}

.worktext1 span {
    font-size: 12px;
    font-weight: 100;
}

.worktext2 p {
    font-size: 12px;
    margin: 5px;
}

.worktext3 p {
    font-size: 13px;
    text-align: right;
    line-height: 30px;
}

.worktext1 p {
    line-height: 30px;
    font-size: 15px;
    font-weight: 600;
}

.worktext2 img,
.worktext3 img {
    width: 13px;
    height: 13px;
    margin: auto 0px;
}

.worktext3 {
    display: flex;
    height: 30px;
    width: 35%;
    text-align: right;
    margin-top: 5px;
}

.worktext2 {
    margin: 0px 10px 4px 20px;
    width: 100%;
    height: 25px;
    text-align: center;
    display: flex;
}

.worktext1 {
    height: 30px;
    margin-left: 20px;
    width: 48%;
    margin-top: 5px;
}

.workpics {
    margin: 20px 30px;
    border-radius: 6px;
    position: relative;
    width: 27%;
    text-align: left;
    display: flex;
    flex-wrap: wrap;
    background: #fff;
    justify-content: space-between;
}

.workbox {
    flex-wrap: wrap;
    background-color: #eee;
    position: relative;
    display: flex;
    justify-content: space-between;
    padding-bottom: 30px;
    padding: 20px 10px;
}

.workbox::after {
    content: "";
    display: block;
    width: 27%;
    margin: 20px 30px;
}

.worktop {
    background-image: url(/img/works.png);
    background-repeat: no-repeat;
    background-position: 50%;
    width: 100%;
    height: 300px;
    position: relative;
    padding-bottom: 20px;
    text-align: center;
    background-size: cover;
}

.goaisatsu1 {
    position: relative;
    width: 70%;
    display: block;
    margin: 30px auto;
    background: #fff;
}

.bottom2 a {
    font-size: 13px;
    line-height: 3.3;
    text-decoration: none;
    color: #000;
}

.whitebox4 {
    height: auto;
    background-color: white;
    position: relative;
    display: flex;
    justify-content: space-between;
    width: 100%
}

.whitebox4 .migi {
    display: block;
    margin: 4px 1px auto 0px;
    width: 13px;
    position: relative;
}

.whitebox4 .bottext2 {
    height: 25px;
    padding: 2px 5px;
    position: relative;
    background: #fff;
    display: block;
}

.pribox .bottom2 a {
    line-height: 1;
}

.pribox {
    margin: auto;
    width: 150px;
    height: auto;
    position: relative;
}

.pribox a {
    /* text-decoration: underline;*/
    line-height: 4;
    font-size: 11px;
}

.pri {
    margin-left: 0px;
    height: 25px;
    position: relative;
}

.pri a {
    text-decoration: none;
    line-height: 1;
    font-size: 12px;
    color: #000;
    margin-bottom: 0;
    letter-spacing: 0px;
}

.top {
    display: block;
    height: 40px;
    background-color: #000;
    width: 42px;
    position: absolute;
    right: 0;
    bottom: 0px;
}

.top a {
    text-decoration: none;
    color: #fff;
}

.top p {
    bottom: 4px;
    position: absolute;
    right: 12px;
}

.footerbox {
    text-align: center;
    width: 100%;
    position: relative;
    height: 20px;
    margin: 0;
    background: #000;
    display: flex;
}

.footerbox p {
    font-size: 11px;
    margin: auto;
    text-decoration: none;
    color: #fff;
}

.footerbox a {
    font-size: 12px;
    text-decoration: none;
    color: #fff;
}

.pri a {
    text-decoration: none;
    line-height: 1;
    font-size: 12px;
    color: #000;
    margin-bottom: 0;
    letter-spacing: 0px;
}

.privacy .num01 {
    padding-top: 20px;
}

ol,
ul {
    list-style: none;
}

.slidetext3 p {    font-size: 0.95rem;
    font-weight: 500;
}

.slidetext3 {font-size: 0.95rem; font-weight: 500;
 position: relative;
 text-align: left;
 margin: 0 20px;
}
.num01 li {
    margin-left: 10px;
    margin-bottom: 10px;
    list-style-type: decimal;
    font-weight: bold;
}

.num02 li {
    line-height: 1.6;
    margin-left: 10px;
    margin-top: 20px;
    list-style-type: none;
    list-style-position: inside;
    counter-increment: cnt;
    font-size: 100%;
    font-weight: normal;
    text-indent: -24px;
}

.num02 li:first-child {
    margin-top: 0;
}

.num02 li:before {
    display: marker;
    content: "("counter(cnt) ") ";
}

.num01>li>h2 {
    background-color: #fff;
    padding: 0px;
    font-weight: bold;
    margin-bottom: 10px;
}

/* 下から */

.fadeUp {
    animation-name: fadeUpAnime;
    animation-duration: 0.5s;
    animation-fill-mode: forwards;
    opacity: 0;
}

@keyframes fadeUpAnime {
    from {
        opacity: 0;
        transform: translateY(100px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.whiteboxtx5 {
    width: 70%;
    text-align: left;
    padding: 10px 0;
    position: relative;
    margin: 10px auto 20px auto;
}

.whiteboxtx5 p2 {
    font-size: 17px;
    font-weight: 900;
    line-height: 100px;
    display: block;
}

.whiteboxtx5 p4 {
    font-size: 15px;
    display: block;
}

.yellowbox {
    display: block;
    position: relative;
    width: 100%;
    background: #fee100;
    height: 200px;
    top: -182px;
}

.yellowbox2 {
    display: block;
    position: relative;
    width: 100%;
    background: #fee100;
    height: 200px;
    top: -182px;
}

/*.wave{display:block;position:relative}
canvas{
position: relative;
width: 100%;
}*/
.right2 {
    text-align: right;
}

.right2 p {
    vertical-align: bottom;
}

.right {
    text-align: right;
}

.toplogo {
    position: relative;
    width: 29%;
    display: block;
}

.menupc {
    position: relative;
    width: auto;
    width: 66%;
    margin: auto 0px;
}

.header {
    z-index: 70;
    background-color: #ffffff8f;
    position: fixed;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    justify-content: space-between;
}

.name5 img {
    margin-right: 7px;
    width: 15px;
}

.line-no {}

.blackline {
    display: flex;
    vertical-align: middle;
    text-align: left;
    width: 100%;
    height: 35px;
    background-color: #000;
    position: relative;
    margin: 0;
    padding: 5px 0;
}

.inblack2 p {
    text-decoration-line: none;
    line-height: 30px;
    font-size: 14px;
    font-weight: 500;
    color: #fff;
    letter-spacing: 1px;
}

.inblack1:hover {
    opacity: 0.8;
}

.toptext a {
    text-decoration-line: none;
    line-height: 30px;
    font-size: 14px;
    font-weight: 500;
    color: #fff;
    letter-spacing: 1px;
}

.toptext p:hover {
    color: #C0C0C0;
}

.toptext p:hover+.inblack1 {
    opacity: 0.8;
}

.toptext {
    width: 133px;
}

.bottexts img {
    margin-right: 0;
}

.inblack1 {
    vertical-align: middle;
    width: 30px;
    height: 30px;
    background: #000;
    margin: 4px 0 0px 14px;
}

.inblack2 {
    width: 320px;
    height: 30px;
    background: #000;
    margin: auto 0;
    display: flex;
}

.icon1 {
    display: block;
}

.inblack1 img {
    width: 18px;
    margin: 5px auto;
}

.apa {
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    font-size: 13px;
}

.homebar {
    text-decoration-line: none;
    line-height: 30px;
    font-size: 15px;
    width: 49%;
    font-weight: 500;
    color: #eeeeee;
    letter-spacing: 1px;
}

.logo2 {
    align-items: left;
    width: 190px;
    margin-left: 0;
}

.grayback {
    height: 600px;
    position: relative;
    margin-top: 0px;
    padding: 10px 0 40px 0;
    width: 100%;
    background: linear-gradient(180deg, #fff 0%, #fff 70%, #fee100 70%, #fee100 100%);
}

.plus1 {
    width: 52px;
    position: absolute;
    top: 64px;
    left: 87px;
}

.plus2 {
    width: 18px;
    position: absolute;
    top: 66px;
    left: 151px;
}

.plus3 {
    width: 89px;
    position: absolute;
    top: 64px;
    left: 177px;
}

.explanation {
    padding: 20px 0;
    display: flex;
    flex-direction: row;
    margin: 11px 35px 0 auto;
    top: 30px;
    z-index: 20;
    width: 242px;
}

.explanation p {
    font-size: 17px;
    font-weight: 600;
}

.slidetext {
    top: 25%;
    padding: 3vw 1vw 4vw 1vw;
    background: #ffffffb3;
    position: absolute;
    left: 7%;
    z-index: 30;
}

.slidetext1 {
    margin: 20px auto 0 auto;
    height: 40%;
    position: relative;
}

.slidetext1 p {
    font-size: 40px;
    font-weight: 900;
    line-height: 1.2;
}

.slidetext2 {
    margin: 0 auto;
    text-align: center;
}

.slidetext2 span {
    line-height: 2;
    background: linear-gradient(transparent 90%, #fee100 90%);
    font-size: 21px;
    font-weight: 700;
}

.slidetext3 p4 {
        font-size: 0.92rem;
}

.slidetext3 {
    position: relative;
    text-align: center;
    margin: 0 3vw;
}

p4 {
    font-size: 14px;
    text-align: left;
    margin-bottom: 10px;
    letter-spacing: 0px;
    line-height: 1.4em;
}

p5 {
    font-size: 14px;
    font-weight: 200;
    text-align: left;
    margin-bottom: 10px;
    letter-spacing: 0px;
    line-height: 1.4em;
    text-align: left;
}

p3 {
    font-size: 1.2rem;
    margin-bottom: 10px;
    letter-spacing: 0px;
    line-height: 1.4em;
}

p2 {
    font-size: 16px;
    font-weight: 900;
    margin-bottom: 10px;
    letter-spacing: 1px;
}

.mark2 {
    background: linear-gradient(transparent 60%, #fee100 60%);
}

.mark {
    FONT-WEIGHT: 800;
    background: linear-gradient(transparent 60%, #fee100 70%);
}

.comnameout {
    z-index: 10;
    /* object-fit: cover; */
    height: 450px;
    background-image: url(/img/river.png);
    background-repeat: no-repeat;
    background-position: 50%;
    animation: move 20s infinite both;
    width: 70%;
    position: relative;
    justify-items: center;
    vertical-align: middle;
    margin: 0 auto;
    bottom: -145px;
}

.comname {
    height: 100%;
    justify-content: center;
    display: flex;
    width: 40%;
    margin: auto;
    flex-wrap: wrap;
}

.contentK {
    position: relative;
    text-decoration: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    margin: auto;
}

.contentU {
    text-align: left;
    width: 100%;
    position: relative;
}

.plu {
    font-weight: 900;
}

.contentL {
    right: 15px;
    bottom: 25px;
    position: absolute;
    align-items: bottom;
    width: 70%;
    /* height: 200px; */
    margin-right: 0px;
    /* position: relative; */
    margin-top: 0px;
    text-decoration: none;
}

.contentL img {
    width: 100%;
}

.contentO {
    width: 224px;
    height: auto;
    background: #fff;
    margin: 30px auto;
    position: relative;
    text-decoration: none;
}

.contentO p2 {
    line-height: 2;
    font-size: 30px;
    font-weight: 900;
    color: #000;
}

.contentO p3 {
    line-height: 1;
    font-size: 18px;
    font-weight: 600;
    color: #000;
}

.quote span {
    line-height: 1.55;
    font-size: 1.3rem;
    font-weight: 900;
}

div.quote {
    margin: 50px auto 0 auto;
    width: 90%;
    display: flex;
    flex-flow: row nowrap;
    justify-content: center;
    align-items: stretch;
}

div.quote>span {
    flex: 0 0 auto;
    text-align: left;
}

div.quote::before,
div.quote::after {
    content: "";
    flex: 0 0 1px;
    height: auto;
    margin: 0px 20px;
    background: #000;
}

div.quote::before {
    transform: rotate(-30deg)
}

div.quote::after {
    transform: rotate(30deg)
}

.contentL1 {
    width: 70%;
    margin: 20px auto;
    text-align: left;
}

.contentL1 p4 {
    text-align: left;
}

.contentN {
    width: 49.5%;
    background: #fff;
    margin: 0px;
    text-decoration: none;
}

.contentM {
    border-radius: 14px;
    position: relative;
    /* border: solid 1px; */
    width: 341px;
    background: #fff;
    margin: 30px auto;
    padding: 10px 0;
}

.namebox2 {
    /* box-shadow: 6px 6px #fee100; */
    /* border: solid 2px #000; */
    /* background: #fff; */
    display: flex;
    position: relative;
    flex-wrap: wrap;
    justify-content: center;
    list-style-type: none;
    margin: -78px auto 10px auto;
    width: 239px;
    padding: 10px 0 10px 0;
    /* top: 450px; */
    z-index: 1;
}

.name4 {
    vertical-align: text-bottom;
    line-height: 1;
    text-align: left;
    margin: 1px 0;
    position: relative;
    padding: 5px 10px 5px 10px;
    text-align: left;
    width: 30px;
    line-height: 1;
}

.name5 {
    float: left;
    display: flex;
    vertical-align: text-bottom;
    line-height: 1;
    text-align: left;
    margin: 1px 0;
    position: relative;
    padding: 5px 10px 5px 10px;
    text-align: left;
    width: 80%;
    line-height: 1;
}

.name5 p4 {
    font-size: 14px;
    text-align: left;
}

.name6 p4 {
    font-size: 12px;
    text-align: left;
}

.name6 {
    vertical-align: text-bottom;
    margin: auto 5px;
    position: relative;
    padding: 10px 10px 5px 10px;
    text-align: center;
    border-bottom: 1px solid #fff;
    width: 80%;
    line-height: 1.3;
}

.name6 p {
    font-size: 14px;
    font-weight: 900;
}

.name7 {
    vertical-align: text-bottom;
    margin: auto 5px;
    position: relative;
    padding: 10px;
    text-align: left;
    /* border-bottom: 1px solid #fff; */
    width: 80%;
    line-height: 1.3;
}

.name7 p4 {
    font-size: 12px;
}

.namebox {
    height: 311px;
    opacity: 1;
    background: #ffffffcc;
    display: flex;
    position: relative;
    flex-wrap: wrap;
    justify-content: center;
    list-style-type: none;
    margin: 10px 10px;
    width: 297px;
    padding: 20px 5px;
}

.name1 {
    vertical-align: text-bottom;
    line-height: 1;
    text-align: left;
    margin: 0;
    position: relative;
    padding: 1px 1px 1px 1px;
    text-align: left;
    width: 127px;
    line-height: 1;
}

.name3 {
    vertical-align: text-bottom;
    margin: 10px 5px;
    position: relative;
    padding: 10px 10px 5px 10px;
    text-align: center;
    /* border-bottom: 1px solid #fff; */
    width: 80%;
    line-height: 1.3;
}

.name1 p {
    line-height: 1.4em;
    font-size: 14px;
    font-weight: 900;
}

.name3 p {
    font-size: 17px;
    font-weight: 900;
}

.name2 {
    vertical-align: text-bottom;
    margin: 0;
    position: relative;
    padding: 1px 1px 1px 1px;
    text-align: right;
    width: 55px;
    line-height: 1;
}

.name2 p {
    font-size: 9px;
}

.name9 {
    margin: auto 5px;
    width: 185px;
    text-align: left;
    position: relative;
}

.name9 p4 {
    font-size: 13px;
    line-height: 1em;
}

ul.listbus1 li:nth-child(even) {
    float: left;
}

ul.listbus1 li:nth-child(odd) {
    float: left;
    clear: left;
}

.business1,
.business2 {
    align-content: space-between;
    width: 100%;
    position: relative;
    height: auto;
    margin: auto;
    background-color: #eee;
    padding-bottom: 30px;
}

.business5 {
    background-color: #eee;
    width: 100%;
}

.business1 {
    margin: 0px auto 0px auto;
    padding-bottom: 0px;
}

.business3 {
    width: 100%;
    position: relative;
    margin-bottom: 0;
    background-color: #fff;
    padding-bottom: 20px;
}

.business4 {
    width: 100%;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    position: relative;
    background-color: #F9F3CE;
    margin: 0 0 50px 0;
    padding-bottom: 20px;
}

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

.afterclean img {
    margin: auto;
}

.yellowmark img {}

.migi {
    width: 18px;
    position: relative;
    padding-right: 8px;
}

.migi img {
    margin: auto;
}

.bottext {
    width: 100%;
    height: auto;
    position: relative;
    display: flex;
    justify-content: space-between;
    padding: 0 auto;
    margin: 5px auto 0 auto;
}

.bottext1 {
    padding: 10px;
    width: 80%;
    position: relative;
    /* margin: 0; */
}

.bottext2 {
    position: relative;
    background: #fff;
    padding: 15px 0px;
}

.f-container {
    width: 95%;
    max-width: 1000px;
    margin: 20px auto;
    position: relative;
    display: flex;
    justify-content: space-around;
}

.f-item {
    width: 30%;
    box-shadow: 0 0 4px grey;
    position: relative;
    text-align: left;
    display: flex;
    background-color: #fff;
    flex-wrap: wrap;
}

.f-item p {
    display: block;
    color: #000;
    letter-spacing: 0px;
    line-height: 13px;
    background-color: #fff;
    font-size: 17px;
    font-weight: bold;
}

.f-item span {
    font-size: 11px;
    font-weight: normal;
}

.listbox {
    width: 100%;
    margin: 10px auto 5px auto;
    position: relative;
    padding: 20px auto 20px auto;
}

.contentF p3,
.contentG p3,
.contentH p3 {
    padding-bottom: 20px;
    line-height: 1;
    font-size: 33px;
    font-weight: 900;
    color: #000;
}

.contentF p4 {
    font-size: 1.1rem;
    font-weight: 600;
    color: #000;
}

.p4center {
    text-align: center;
}

.contentF {
    max-width: 730px;
    overflow-wrap: break-word;
    width: 70%;
    text-align: left;
    height: auto;
    position: relative;
    margin: 0px auto;
}

.contentG {
    width: 400px;
    height: 80px;
    margin: 0 auto;
    position: relative;
    text-align: justify;
    padding-bottom: 20px;
}

.contentH {
    width: 400px;
    height: 80px;
    margin: 0 auto;
    position: relative;
    text-align: justify;
    padding-bottom: 20px;
}

.contentJ {
    width: 340px;
    height: 80px;
    margin: 0 auto;
    position: relative;
    text-align: justify;
    padding-bottom: 20px;
}

.yohaku {
    background: #fff;
    width: 100%;
    margin: 20px auto 20px 0;
    position: relative;
}

.listbus1 {
    opacity: 0.9;
    border-radius: 6px;
    background: #fff;
    display: flex;
    position: relative;
    flex-wrap: wrap;
    justify-content: center;
    list-style-type: none;
    margin: 20px auto 10px auto;
    width: 70%;
    max-width: 730px;
    padding: 10px 0 30px 0;
}

.item,
.item0 {
    vertical-align: text-bottom;
    margin: 1px 3px;
    position: relative;
    padding: 25px 10px 5px 10px;
    text-align: left;
    border-bottom: 1px solid #ccc;
    width: 40%;
    line-height: 1.4em;
}

.item0 {
    border-bottom: none;
}

.item2 {
    vertical-align: text-bottom;
    margin: 0 5px;
    position: relative;
    padding: 30px 10px 5px 10px;
    text-align: left;
    border-bottom: 1px solid #ccc;
    width: 80%;
    line-height: 1.4em;
}

.W-container {
    display: flex;
    justify-content: center;
}

.dot {
    list-style: disc;
}

.w-itemleft,
.w-itemright,
.w-item2left,
.w-item2right,
.w-item3left,
.w-item3right {
    margin: 5px;
    display: flex;
    flex-wrap: wrap;
}

.contentF p {
    font-weight: normal;
    font-size: 14px;
    line-height: 1.4em;
}

.w-itemleft,
.w-itemright {
    width: 220px;
}

.w-item2left,
.w-item2right {
    width: 330px;
}

.w-item3left,
.w-item3right {
    width: 260px;
}

.w-itemleft,
.w-item2left,
.w-item3left {
    justify-content: right;
    padding: 0.5vw;
    margin: 0.5vw;
}

.w-itemright,
.w-item2right,
.w-item3right {
    justify-content: left;
    padding: 0.5vw;
    margin: 0.5vw;
}

.w-img,
.w-img2,
.w-img3 {
    width: 100%;
    display: inline-block;
    overflow: hidden;
}

.w-img img {
    width: 100%;
    height: 280px;
}

.w-img2 img {
    width: 100%;
    height: 200px;
}

.w-img3 img {}

.before,
.after,
.before2,
.after2,
.before3,
.after3 {
    text-align: center;
    height: auto;
    width: 100%;
    position: relative;
    display: flex;
}

.after,
.after2,
.after3 {
    background-color: #09435c;
    padding: 3px;
}

.after p,
.after3 p,
.after3 p {
    color: #fff;
    font-weight: bold;
    margin: 0 auto;
    font-size: 12px;
}

.before,
.before2,
.before3 {
    background-color: #ffffff;
    padding: 3px;
}

.before p,
.before2 p,
.before3 p {
    color: #000;
    font-weight: bold;
    font-size: 12px;
    margin: 0 auto;
}

.arrow {
    opacity: 50%;
}

.arrow img {
    width: 70px;
    margin: auto;
}

/*.box5-2{
background-color: #fff;
    padding: 5px;
    position: relative;
    border: 3px double #000;
    margin: 0 auto 15px auto;
    width: 250px;
}
.box5-2 .box-title {
    background-color: #fff;
    font-size: 1em;
    font-weight: 800;
    color: #000;
    padding: 0 5px;
    line-height: 1;
    position: absolute;
    top: -8px;
    left: 20px;
}*/
ul.listbus1 li:nth-child(even) {
    float: left;
}

ul.listbus1 li:nth-child(odd) {
    float: left;
    clear: left;
}

.wreath {
    max-width: 400px;
    margin: 25px auto;
}

.wreath img {
    margin: auto;
    filter: drop-shadow(0px 0px 1px #d0d0d0);
}

.whiteboxtx3 {
    max-width: 800px;
    background-color: #fff;
    width: 65%;
    text-align: left;
    padding: 30px 0 50px 0;
    position: relative;
    margin: auto;
}

.whiteboxtx2 {
    padding-top: 20px;
    line-height: 1.8em;
    font-size: 0.95rem;
    width: 70%;
    max-width: 800px;
    text-align: left;
    position: relative;
    margin: auto;
}

.binw {
    color: #fff;
}

.Englishtitle {
    text-align-last: justify;
    text-justify: inter-ideograph;
    /* IE・Edge用 */
    width: 100%;
}

.line-left {
    border-left: 5px solid black;
    padding-left: 10px;
    margin: 20px 0;
}

.line-left p3 {
    color: #000;
    font-weight: 900;
}

.line-left2 {
    border-left: 5px solid #555555;
    padding-left: 10px;
    margin-bottom: 20px;
}

.line-left2 p3 {
    size: 20px;
    color: #000;
    font-weight: 900;
}

.yoko:before {
    content: "";
    display: inline-block;
    width: 3px;
    height: 40px;
    background-color: #0097A7;
    position: absolute;
    top: -2px;
    left: -5px;
}

.yoko p {
    font-size: 30px;
    padding-left: 10px;
}

.rectop p2,
.comtop p2,
.bustop p2,
.contop p2,
.pritop p2,
.worktop p2 {
    font-size: 40px;
    font-weight: 900;
    color: #fff;
    margin-bottom: 10px;
    letter-spacing: 1px;
    line-height: 300px;
    display: block;
    margin: auto;
}

.whitebox {
    padding-top: 40px;
    width: 100%;
    height: 300px;
    background-color: #fff;
    position: relative;
    margin: 0;
}

.pritop {
    background-image:
        url("/img/privacy.png");
    background-repeat: no-repeat;
    background-position: 50%;
    width: 100%;
    height: 300px;
    position: relative;
    padding-bottom: 20px;
    text-align: center;
    background-size: cover;
}

.bustop {
    background-image:
        url("/img/top2.png");
    background-repeat: no-repeat;
    background-position: 50%;
    width: 100%;
    height: 300px;
    position: relative;
    padding-bottom: 20px;
    text-align: center;
    background-size: cover;
}

.comtop {
    background-image:
        url("/img/company4.png");
    background-repeat: no-repeat;
    background-position: 50%;
    width: 100%;
    height: 300px;
    position: relative;
    padding-bottom: 20px;
    text-align: center;
    background-size: cover;
}

.rectop {
    background-image:
        url("/img/recruit2.png");
    background-repeat: no-repeat;
    background-position: 50%;
    width: 100%;
    height: 300px;
    position: relative;
    padding-bottom: 20px;
    text-align: center;
    background-size: cover;
}

.contop {
    background-image:
        url("/img/contact.png");
    background-repeat: no-repeat;
    background-position: 50%;
    width: 100%;
    height: 300px;
    position: relative;
    padding-bottom: 20px;
    text-align: center;
    background-size: cover;
}

.whiteboxtx {
    background-color: #fff;
    width: 70%;
    text-align: left;
    padding-top: 30px;
    position: relative;
    margin: 50px auto 20px auto;
}

.whiteboxtx p {
    font: 26px;
}

.bustopin {
    width: 520px;
    height: 80px;
    vertical-align: middle;
    text-align: center;
    vertical-align: middle;
    margin: 50px auto 0 auto;
    position: relative;
    padding-bottom: 20px;
}

.bustop p {
    margin: 80px auto 0 auto;
    font-size: 26px;
    color: #fff;
    font-weight: 900;
    letter-spacing: 1px;
}

.contentE {
    width: 330px;
    height: 80px;
    margin: 20px auto 50px auto;
    position: relative;
    text-align: justify;
    padding-bottom: 20px 0
}

.contentF p2,
.contentJ p2 {
    padding-bottom: 20px;
    text-align: justify;
    line-height: 1.3;
    font-size: 25px;
    font-weight: 900;
    color: #000;
}

.contentD p2 {
    line-height: 2;
    font-size: 30px;
    font-weight: 900;
    color: #000;
}

.contentD p3,
contentO p3 {
    font-size: 18px;
    color: #000;
    margin-bottom: 10px;
    letter-spacing: 0px;
    line-height: 1.4em;
}

.contentE p2 {
    padding-bottom: 20px;
    text-align: justify;
    line-height: 1.3;
    font-size: 30px;
    font-weight: 900;
}

.contentE h4,
.contentF h4,
.contentG h4,
.contentH h4,
.contentJ h4 {
    position: relative;
    padding: 0;
    text-align: left;
}

.contentQ p2 {
    line-height: 1;
    font-size: 2rem;
    font-weight: 900;
    color: #000;
}

.contentQ span,
.contentO span {
    font-size: 13px;
    font-weight: 600;
    line-height: 2.5;
}

.contentQ {
    display: block;
    margin: 30px auto 30px auto;
}

.contentR {
    background-color: #f7f6f4;
    position: relative;
    padding: 30px 0;
}

.f-item img:hover {
    opacity: 0.5;
}

.contentE h4:before,
.contentJ h4:before {
    position: absolute;
    top: calc(50% - 1px);
    left: 0;
    width: 100%;
    height: 2px;
    content: '';
    background: #000;
}

.contentE h4 span,
.contentG h4 span,
.contentH h4 span,
.contentJ h4 span {
    font-size: 15px;
    position: relative;
    padding: 0 1em 0 0;
    background: #fff;
}

.contentF h4:before {
    position: absolute;
    top: calc(50% - 1px);
    left: 0;
    width: 100%;
    height: 2px;
    content: '';
    background: #000;
}

.contentG h4:before,
.contentH h4:before {
    position: absolute;
    top: calc(50% - 1px);
    left: 0;
    width: 100%;
    height: 2px;
    content: '';
    background: #000;
}

.contentF h4 span {
    font-size: 18px;
    position: relative;
    padding: 0 1em 0 0;
    background: #B8EDD6;
}

.contentG h4 span {
    font-size: 18px;
    position: relative;
    padding: 0 1em 0 0;
    background: #CFEBF0;
}

.contentH h4 span {
    font-size: 18px;
    position: relative;
    padding: 0 1em 0 0;
    background: #F9F3CE;
}

.contentJ h4 span {
    font-size: 18px;
    position: relative;
    padding: 0 1em 0 0;
    background: #fff;
}

.cu {
    display: flex;
    flex-wrap: wrap;
    margin: auto;
}

.cu li {
    width: calc(100%/4);
    /*←画像を横に4つ並べる場合*/
    padding: 10px 10px;
    box-sizing: border-box;
    background: url("images/icon.clean.png") no-repeat;
    position: relative;
    display: inline-block;
    align-items: center;
}

.cu img {
    max-width: 90%;
    height: auto;
    margin: 0 auto 30px auto;
}

.cu img:hover {
    opacity: 0.5;
}

.mainbox {
    width: 100%;
    position: relative;
}

.blank {
    height: 10px;
    width: 100%;
    display: flex;
    text-align: center;
    margin: 10px;
}

.title {
    font-size: 20px;
    font-weight: 900;
    letter-spacing: 1px;
    margin: 0 auto;
    text-align: center;
}

.blue {
    width: 100%;
    background-color: #ebf5f5;
    margin: 30px auto 30px auto;
    padding: 30px auto 30px auto;
    border-radius: 20px;
}

.none {
    width: 100%;
    background-color: #fff;
    padding: 20px auto;
    margin: 20px auto;
}

h2 {
    background-color: #ebf5f5;
    padding: 30px 0 0 0;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
}

h3 {
    border-bottom: 2px solid #000;
}

.bar1 {
    display: block;
    width: 50%;
    height: 1px;
    background-color: #000;
    border: 0;
}

.center1 {
    width: 100%;
    position: relative;
    margin: 0 auto;
}
.center2{margin: auto;}

.logoimage {
    width: 50px;
}

.logotexts {
    width: 250px;
    text-align: left;
    align-items: bottom;
}

.service {
    display: flex;
    flex-wrap: wrap;
    margin: auto;
}

.vision {
    background-color: #fff;
    width: 100%;
    text-align: center;
    position: relative;
    margin: 50px auto 20px auto;
}

.headline {
    background-color: #fff;
    width: 100%;
    text-align: center;
    position: relative;
    margin: 1px auto 1px auto;
}

.container {
    width: 100%;
    display: flex;
}

.container .target {
    flex: 0 1 auto;
    width: 70%;
    margin: 20px auto;
}

.contentA,
.contentB {
    width: 49.5%;
    height: 100px;
    background: #FFFFFF;
    margin: 8px 0px 0px;
    border-bottom: solid 1px #555;
    text-decoration: none;
}

.contentA:hover {
    background-color: #99CCFF;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.contentB:hover {
    background-color: #99CCFF;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.contentA img,
.contentB img {
    width: 100px;
    float: left;
}

p5 {
    line-height: 100px;
    margin: 0 0 0 10px;
    text-decoration: none;
}

.business {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin: 0 0 0 10px;
}

.border0 {
    margin: 0 0 0 10px;
    text-decoration: none;
}

.right img {
    width: 20px;
}

.message {
    width: 100%;
    display: flex;
    text-align: center;
    margin-left: auto;
    position: relative;
    margin-right: auto;
    margin-bottom: 0;
    flex-wrap: wrap;
}

.message2 {
    width: 100%;
    height: 440px;
    display: flex;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px; flex-wrap: wrap;
}

.message3 {
    width: 100%;
    height: 50px;
    display: flex;
    text-align: center;
    margin: 0;
    background: #fff;
    flex-wrap: wrap;
}

.contentC {
    width: 49.5%;
    height: 400px;
    background: #fff;
    margin: 0px;
    text-decoration: none;
}

.contentD {
    width: 49.5%;
    height: 440px;
    background: #fff;
    margin: 0px;
    text-decoration: none;
}

.contentC img {
    width: 100%;
    height: 400px;
    object-fit: cover;
}

.contentD img {
    width: 100%;
    height: 440px;
    object-fit: cover;
}

.line-no p3 {
    font-size: 2rem;
}

.Englishtitle {
    text-align-last: justify;
    /* Chrome・Firefox用 */
    text-justify: inter-ideograph;
    /* IE・Edge用 */
    width: 100%;
}

.bold {
    font-size: 17px;
    font-weight: 900;
    letter-spacing: 0.1px;
}

.center {
    text-align: center;
    margin: 15% 0 5%;
}

.padding {
    margin: 20px;
    text-align: left;
}

.square {
    background-color: #f6f6f6;
    display: flex;
    flex-wrap: wrap;
    margin: auto;
}

.square li {
    width: calc(100%/2);
    padding: 0px;
    box-sizing: border-box;
    background: url("images/icon.clean.png") no-repeat;
    position: relative;
    display: inline-block;
}

.square img {
    max-width: 99%;
    height: auto;
    margin: 0 auto;
}


.maru {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    margin: 0 auto;
}

.maru li {
    box-shadow: 0 0 8px gray;
    width: 25%;
    /*←画像を横に3つ並べる場合 calc(100%/3)*/
    padding: 10px 10px;
    box-sizing: border-box;
    background: url("images/icon.clean.png") no-repeat;
    position: relative;
    display: inline-block;
    align-items: center;
    margin: 20px;
}

.maru img {
    max-width: 90%;
    height: auto;
    margin: 0 auto 30px auto;
}

.maru img:hover {
    opacity: 0.5;
}

.ourbusiness {
    width: 100%;
    height: 300px;
    background-color: #efc;
    display: flex;
}

.ourbusiness,
.target {
    flex: 0 1 auto;
    width: 70%;
    margin: auto;
}

.backimage1 {
    position: relative;
    margin: 0;
    width: 100%;
    height: 500px;
    background-image:
        linear-gradient(140deg,
            #00f3ffA0,
            #0028b960 40%,
            #00f3ff60 60%,
            #00f3ffA0),
        url("http://belltex.sub.jp/apanne/img/haikan.jpg");
    background-repeat: no-repeat;
    background-position: 50%;
    animation: move 20s infinite both;
}

@keyframes move {
    0% {
        background-size: 100% auto;
    }

    50% {
        background-size: 140% auto;
    }

    100% {
        background-size: 100% auto;
    }
}

.vision1 {
    width: 100%;
    padding: auto;
    text-align: center;
    position: relative;
    height: 40%;
}

.visioninner {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    width: 80%;
    height: 3.2rem;
}

.visioninner2 {
    display: flex;
    position: relative;
    width: 80%;
    text-align: left
}

.graytoumei {
    height: 60%;
    width: 100%;
    opacity: 0.9;
    background-color: #f6f6f6;
    display: flex;
    padding: auto;
    position: relative;
    text-align: center;
}

.graytoumei p {
    opacity: 1;
}

p7 {
    font-size: 28px;
    font-weight: 900;
    color: #ffffff;
    margin: auto;
}

p8 {
    font-size: 16px;
    letter-spacing: 0px;
    font-weight: 400;
    color: #333;
    margin: auto;
    opacity: 1;
}

.pc {
    display: block !important;
}

.sp,
.ss {
    display: none !important;
}

a {
    -webkit-transition: 0.5s;
    transition: 0.5s;
}

a:hover {
    color: #CCCCCC;
    /*マウスオン時の文字色*/
    text-decoration: none;
    /*マウスオン時に下線を消す設定。残したいならこの１行削除。*/
}

/*フッター	
---------------------------------------------------------------------------*/
.bottom {
    width: 290px;
    padding: 0px;
    position: relative;
    margin: auto;
    text-align: left;
}

.bottom span {
    line-height: 1.8;
    font-size: 16px;
    font-weight: 600;
}

.bottom p {font-size: 0.83rem;
    line-height: 1.45;
}

.bottom1 {
    margin-bottom: 10px;
    width: 65%;
    position: relative;
}

.bottom2 {
    text-align: left;
    position: relative;
}

footer {
    width: 100%;
    position: relative;
    height: auto;
    clear: both;
    padding: 10px 0;
    /*text-align: center;	*/
    background: #000;
    color: #fff;
}

/*コンテナー（HPを囲むブロック）																									
---------------------------------------------------------------------------*/
#container {
    width: 100%;
    /*コンテナーの最大幅*/
    margin: 0 auto;
    text-align: center;
    position: relative;
}

/*ヘッダー（サイト名ロゴが入ったブロック）																									
---------------------------------------------------------------------------*/
/*ヘッダーブロック*/
header {
    position: relative;
    width: 100%
}

/*ロゴ画像*/
#logo img {
    margin: 10px;
    width: 260px;
}

#menubar {
    float: right;
    margin: 0 0 0 auto;
    display: block;
}

/*メニュー１個ごとの設定*/
#menubar li {
    padding: 0 17px;
    float: left;
    width: 12vw;
}

#menubar li a {
    margin: 0 auto;
    /* width: 100%; */
    font-size: 1.02rem;
    color: #000;
    text-decoration: none;
    display: block;
    text-align: center;
    font-weight: bold;
    letter-spacing: 0.18em;
    /*    border-right: 1px solid #ccc; */
    border-bottom: 1px solid transparent;
}

#menubar li a:hover {
    color: #CCCCCC;
    border-bottom: 2px solid #fee100;
    /*下線の幅、線種、色*/
}

#menubar li.current a {
    color: #CCCCCC;
    border-bottom: 2px solid #fee100;
    /*下線の幅、線種、色*/
}

/*英語表記の設定*/
#menubar a span {
    display: block;
    font-size: 10px;
    /*文字サイズ*/
    font-weight: normal;
    /*太字を標準に戻す設定。*/
    color: #999;
    /*文字色*/
}

/*小さい端末用(画面幅800px以下)メニューを表示させない*/
#menubar-s {
    display: none;
}

/*３本バーアイコンを表示させない																									
#menubar_hdr {																									
display: none;																									
}	*/
/*コンテンツ（mainとsubを囲むブロック）																									
---------------------------------------------------------------------------*/
#contents {
    /*padding-top: 7px;       上に空ける余白*/
}

/*メインコンテンツ（右側ブロック）																									
---------------------------------------------------------------------------*/
#main {
    float: right;
    /*右側に流し込み*/
    width: 100%;
    /*コンテンツ幅*/
    padding-bottom: 0px;
}

/*mainコンテンツのh2タグの設定*/
/*mainコンテンツのh3タグの設定*/
/*メインコンテンツのp(段落)タグ設定*/
/*#main p {																									
padding: 0px 15px 14px;    																								
}			     */
#main h2+p,
#main h3+p {
    margin-top: -5px;
}

/*top image -------------------------------------------------------------------------*/

img {
    display: block;
    width: 100%;
    height: auto;
}

.out {
    position: relative;
    width: 100%;
    margin: 0 auto 20px auto;
}

.in img {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transition: .5s;
    z-index: 0;
}


input {
    display: none;
}

.in {
    display: flex;
    justify-content: center;
}

.outs label span,
.out label span {
    display: block;
    width: 11px;
    height: 11px;
    padding: 9px;
    margin: 5px 3px 3px;
    border-radius: 100%;
    cursor: pointer;
    position: relative;
    z-index: 2;
}

.outs label span::before,
.out label span::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: #CCCCCC;
    opacity: 0.5;
    border-radius: 100%;
}

input:nth-of-type(1):checked~.in label:nth-of-type(1) span::before,
input:nth-of-type(2):checked~.in label:nth-of-type(2) span::before,
input:nth-of-type(3):checked~.in label:nth-of-type(3) span::before {
    background: #000;
    opacity: 1;
}

.outs label span::before,
.out label span::before {
    animation: slidebutton 14s infinite;
}

@keyframes slidebutton {
    0% {
        opacity: 0.5;
        background: #CCCCCC;
    }

    3.5% {
        opacity: 1;
        background: #000;
    }

    /* b÷x×100=y */
    25% {
        opacity: 1;
        background: #000;
    }

    /* 100÷c=z */
    28.5% {
        opacity: 0.5;
        background: #CCCCCC;
    }

    /* y+z */
}

label:nth-of-type(2) span::before,
label:nth-of-type(2) img {
    animation-delay: 3.5s;
}

label:nth-of-type(3) span::before,
label:nth-of-type(3) img {
    animation-delay: 7s;
}

input:nth-of-type(1):checked~.in label:nth-of-type(1) img,
input:nth-of-type(2):checked~.in label:nth-of-type(2) img,
input:nth-of-type(3):checked~.in label:nth-of-type(3) img {
    opacity: 1;
    z-index: 1;
}

.in img {
    animation: slide 14s infinite;
    /* (a+b)×c=x */
    opacity: 0;
}

@keyframes slide {
    0% {
        opacity: 0;
    }

    3.5% {
        opacity: 1;
        z-index: 1;
    }

    /* b÷x×100=y */
    25% {
        opacity: 1;
    }

    /* 100÷c=z */
    28.5% {
        opacity: 0;
        z-index: 0;
    }

    /* y+z */
}

input:checked~.in img,
input:checked~.in span::before {
    animation: none;
}

.in:hover img,
.in:hover span::before {
    animation-play-state: paused;
    /* マウスを載せると一時停止 */
}

.flexbox2,
.flexbox3 {
    width: 95%;
}

.out {
    display: block !important;
}

.outs {
    display: none !important;
}

/*サービス紹介ページの各ブロック																									
---------------------------------------------------------------------------*/
/*各ボックスの設定*/
#main .list {
    border: 1px solid #bcbcbc;
    /*枠線の幅、線種、色*/
    margin-bottom: 15px;
    /*ボックスの下に空ける余白*/
    background: -webkit-linear-gradient(#FFF, #ebebeb);
    /*グラデーション*/
    background: linear-gradient(#FFF, #ebebeb);
    /*同上*/
    -webkit-box-shadow: 0px 2px 5px #CCC, 0px 0px 1px 1px #FFF inset;
    /*影の設定。右・下・ぼかし幅・色の設定, ＋内側への影を右・下・ぼかし幅・色を設定*/
    box-shadow: 0px 2px 5px #CCC, 0px 0px 1px 1px #FFF inset;
    /*同上*/
    position: relative;
    overflow: hidden;
}

#main .list a {
    padding: 3%;
    /*ボックス内の余白*/
    text-decoration: none;
    display: block;
    overflow: hidden;
}

/*マウスオン時のボックス*/
#main .list a:hover {
    background: #fff;
    /*背景色*/
}

/*ボックス内の段落タグ設定*/
#main .list p {
    padding: 0px;
}

/*ボックス内の写真設定*/
#main .list figure img {
    float: left;
    /*画像を左へ回り込み*/
    width: 20%;
    /*写真の幅*/
    background: #FFF;
    /*画像の背景色。ここでは枠線と画像の間の色になります。*/
    padding: 1%;
    /*余白。ここに上の行で設定した背景色が出ます。*/
    border: 1px solid #CCC;
    /*枠線の幅、線種、色*/
    margin-right: 1%;
}

/*ボックス内のh4タグ設定*/
#main .list h4 {
    margin-bottom: 0.5em;
    color: #99CCFF;
    /*文字色*/
    border-bottom: 1px solid #CCC;
    /*下線の幅、線種、色*/
}

/*ボックス内のh4タグの１文字目への設定*/
#main .list h4::first-letter {
    border-left: 3px solid #99CCFF;
    /*左側の線の幅、線種、色*/
    padding-left: 10px;
    /*線と文字との余白*/
}

/*h4タグ直下に画像がある場合の段落タグ設定*/
#main .list h4+figure~p {
    margin-left: 24%;
    /*左側の写真幅とのバランスをとって設定*/
}

/*h4タグ直下に画像がある場合のtableタグ設定*/
#main .list h4+figure~table {
    margin-left: 24%;
    /*左側の写真幅とのバランスをとって設定*/
    width: 75%;
    /*テーブル幅*/
}

/*一覧ページの各物件ボックス内のテーブル																									
---------------------------------------------------------------------------*/
#main .list table {
    font-size: 12px;
    /*文字サイズ*/
    background: #FFF;
    /*背景色*/
    width: 100%;
    /*テーブル幅*/
    margin-bottom: 5px;
}

#main .list table,
#main .list table td,
#main .list table th {
    border: 1px solid #bcbcbc;
    /*枠線の幅、線種、色*/
}

#main .list table td,
#main .list table th {
    padding: 1%;
    /*テーブル内の余白*/
}

/*色のついた見出しブロック*/
#main .list table th {
    width: 18%;
    /*幅*/
    text-align: center;
    /*文字をセンタリング*/
    font-weight: normal;
    /*デフォルトの太字を標準にする設定*/
    background: #99CCFF;
    /*背景色*/
}

/*白い説明用ブロック*/
#main .list table td {
    width: 30%;
    /*幅*/
}

/*商品詳細ページの画像切り替え																									
---------------------------------------------------------------------------*/
/*大きな画像のボックスと説明文を入れるボックス*/
#item-image {
    position: relative;
}

/*大きな画像の１行目*/
#item-image #item_image1 {
    z-index: 2;
    position: relative;
    overflow: hidden;
}

/*大きな画像の２行目*/
#item-image #item_image2 {
    z-index: 1;
    position: absolute;
    left: 0px;
    top: 0px;
    overflow: hidden;
}

/*サムネイル画像*/
.thumbnail {
    width: 100px;
    /*画像の幅*/
    height: 100px;
    /*画像の高さ*/
    border: 1px solid #ccc;
    /*枠線の幅、線種、色*/
    margin-bottom: 5px;
}

.thumbnail:hover {
    border: 1px solid #000;
    /*マウスオン時の枠線の幅、線種、色*/
}

/*サブコンテンツ（左側ブロック）																									
---------------------------------------------------------------------------*/

/*サブコンテンツ内のメニュー																									
---------------------------------------------------------------------------*/

/*テーブル１																									
---------------------------------------------------------------------------*/
.ta1,
.ta2 {
    width: 100%;
}

.ta2 {
    border-radius: 6px;
    position: relative;
    margin: 3px auto;
    width: 90%;
}

.ta2,
.ta2 td,
.ta2 th,
.ta1,
.ta1 td,
.ta1 th {
    font-size: 13px;
    border-bottom: 1px solid #CCC;
    /*テーブルの枠線の幅、線種、色*/
    line-height: 1.6;
}

.ta2 td {
    text-align: left;
    padding: 9px;
}

.ta2 th {
    font-weight: normal;
    width: 100px;
    padding-left: 9px;
    text-align: left;
}

.ta2 tr:last-child td,
.ta2 tr:last-child th {
    border-bottom: hidden;
}

/*テーブル１行目に入った見出し部分*/
.ta1 th.tamidashi {
    width: auto;
    text-align: left;
    color: #FFF;
    /*文字色*/
    background: #fff;
    /*背景色（古いブラウザだとここの色のみが出ます）*/
    background: -webkit-linear-gradient(#4b4b4b, #333);
    /*グラデーション*/
    background: linear-gradient(#4b4b4b, #333);
    /*同上*/
}

/*テーブル内の左側*/
.ta1 th {
    width: 100px;
    padding: 10px 20px;
    text-align: left;
}

/*テーブル内の右側*/
.ta1 td {
    padding: 10px;
}

.bus1 {
    width: 70%;
    margin: 20px auto;
    background: #fff;
}

.bus1,
.bus1 td,
.bus1 th {
    border-bottom: 1px solid #CCC;
    /*テーブルの枠線の幅、線種、色*/
    line-height: 2;
    padding: 10px auto 2px auto;
}

/*テーブル１行目に入った見出し部分*/
.bus1 th.tamidashi {
    width: auto;
    text-align: left;
    color: #FFF;
    /*文字色*/
    background: #fff;
    /*背景色（古いブラウザだとここの色のみが出ます）*/
    background: -webkit-linear-gradient(#4b4b4b, #333);
    /*グラデーション*/
    background: linear-gradient(#4b4b4b, #333);
    /*同上*/
}

/*テーブル内の左側*/
.bus1 th {
    width: 50%;
    padding: 10px 20px;
    text-align: left;
}

/*テーブル内の右側*/
.bus1 td {
    padding: 10px;
}

.ta5 {
    width: 100%;
    margin-bottom: 15px;
    background: #fff;
    /*背景色*/
}

.ta5,
.ta5 td,
.ta5 th {
    border-bottom: 1px solid #4b4b4b;
    /*テーブルの枠線の幅、線種、色*/
    line-height: 2;
}

/*テーブル１行目に入った見出し部分*/
.ta5 th.tamidashi {
    width: auto;
    text-align: left;
    color: #FFF;
    /*文字色*/
    background: #fff;
    /*背景色（古いブラウザだとここの色のみが出ます）*/
    background: -webkit-linear-gradient(#4b4b4b, #333);
    /*グラデーション*/
    background: linear-gradient(#4b4b4b, #333);
    /*同上*/
}

/*テーブル内の左側*/
.ta5 th {
    width: 100px;
    padding: 10px 20px;
    text-align: left;
}

/*テーブル内の右側*/
.ta5 td {
    padding: 10px;
}

/*inputボタンの設定																									
---------------------------------------------------------------------------*/
input[type="submit"],
input[type="button"],
input[type="reset"] {
    width: 250px;
    /*ボタン幅*/
    padding: 10px;
    /*ボタン内の余白*/
    margin-bottom: 20px;
    border-radius: 30px;
    /*角丸のサイズ*/
    background: #e5e5e5;
    /*背景色（古いブラウザだとここの色のみが出ます）*/
    background: -webkit-linear-gradient(#FFF, #e5e5e5);
    /*グラデーション*/
    background: linear-gradient(#FFF, #e5e5e5);
    /*同上*/
    font-size: 16px;
    /*文字サイズ*/
    letter-spacing: 0.1em;
    /*文字間隔を少し広くする設定*/
    border: 1px solid #999;
    /*枠線の幅、線種、色*/
}

/*ボタンのマウスオン時の設定*/
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover {
    background: #FFF;
    /*背景色（古いブラウザだとここの色のみが出ます）*/
    background: -webkit-linear-gradient(#e5e5e5, #FFF);
    /*グラデーション*/
    background: linear-gradient(#e5e5e5, #FFF);
    /*同上*/
}

/*PAGE TOP設定																									
---------------------------------------------------------------------------*/
#pagetop {
    clear: both;
}

#pagetop a {
    color: #FFF;
    /*文字色*/
    font-size: 10px;
    /*文字サイズ*/
    background: #000;
    /*背景色*/
    text-decoration: none;
    text-align: center;
    width: 50px;
    /*幅*/
    line-height: 50px;
    /*高さ*/
    display: block;
    float: right;
}

/*マウスオン時*/
#pagetop a:hover {
    background-color: #666;
    /*背景色*/
    color: #FFF;
    /*文字色*/
}

/*一覧ページのボックス右下のオプションマーク																									
（CMSの場合は管理ページの「オプション1」～のプルダウンと、setup.phpの「オプション選択肢」に関連します）																									
---------------------------------------------------------------------------*/
.option1 {
    font-size: 10px;
    color: #FFF;
    background: #F00;
    text-align: center;
    display: block;
    width: 120px;
    position: absolute;
    right: 0px;
    bottom: 0px;
    -webkit-transform: rotate(-45deg) translate(37px, 10px);
    -ms-transform: rotate(-45deg) translate(37px, 10px);
    transform: rotate(-45deg) translate(37px, 10px);
}

h2 span.option1 {
    width: auto;
    padding: 0px 5px;
    position: static;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    display: inline-block;
}

.option2 {
    font-size: 10px;
    color: #FFF;
    background: #069;
    text-align: center;
    display: block;
    width: 120px;
    position: absolute;
    right: 0px;
    bottom: 0px;
    -webkit-transform: rotate(-45deg) translate(37px, 10px);
    -ms-transform: rotate(-45deg) translate(37px, 10px);
    transform: rotate(-45deg) translate(37px, 10px);
}

h2 span.option2 {
    width: auto;
    padding: 0px 5px;
    position: static;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    display: inline-block;
}

faq,
.link {
    padding: 0px 15px;
}

/*質問（又はサイト名）の設定*/
.faq dt,
.link dt {
    color: #99CCFF;
    font-weight: bold;
    padding-top: 15px;
}

.faq dd,
.link dd {
    border-bottom: 1px solid #ccc;
    overflow: hidden;
    padding-bottom: 15px;
}

-----------------------------------------------------------------*/ body {
    margin: 0;
}

.look {
    color: #fff;
    background: #666;
    padding: 5px;
    border-radius: 4px;
}

.mb15,
.mb1em {
    margin-bottom: 15px;
}

.clear {
    clear: both;
}

ul.disc {
    padding: 0em 25px 1em;
    list-style: disc;
}

.color1 {
    color: #99CCFF !important;
}

.pr {
    font-size: 10px;
}

.wl {
    width: 96%;
}

.ws {
    width: 50%;
}

.c {
    text-align: center;
}

.r {
    text-align: right;
}

.l {
    text-align: left;
}

img.fr {
    float: right;
    margin-left: 10px;
    margin-bottom: 10px;
    width: 30%;
}

img.fl {
    float: left;
    margin-right: 10px;
    margin-bottom: 10px;
    width: 30%;
}

.big1 {
    font-size: 30px;
    letter-spacing: 0.2em;
}

.mini1 {
    font-size: 11px;
}

.sh {
    display: none;
}

.dn {
    display: none;
}

/*画面幅1200px以下の設定	----------------*/
@media screen and (max-width:1200px) {

    /*コンテナー（HPを囲むブロック）------*/
    #container {
        margin: 0;
    }

    #menubar li {
        padding: 0 7px;
        float: left;
    }

    .worktext3 {
        width: 24%;
    }

    .worktext1 {
        width: 54%;
    }
}

@media screen and (max-width:1000px) {
    .menupc {
        margin: auto 5px auto 0px;
        position: relative;
        width: 70%;
    }

    #menubar li {
        float: left;
        width: 14vw;
        padding: 0;
    }

    .workpics {
        width: 45%;
        margin: 10px 10px;
    }

    .workbox::after {
        display: block;
        content: "";
        width: 45%;
    }

    #menubar li a {
        letter-spacing: 0.12rem;
        font-size: 0.9rem;
    }

    .toplogo {
        width: 27%;
    }
}

/*画面幅800px以下の設定			
---------------------*/
@media screen and (max-width:800px) {
    .outs {
        width: 100%;
        position: absolute;
        margin-top: 100px;
        top: -19px;
    }

    .out {
        display: none !important;
    }

    .outs {
        display: block !important;
    }

    .wave {
        display: none !important;
    }

    .noimage {
        margin-top: 80px;
    }

    .outs img {
        object-fit: cover;
        width: 100%;
        height: 560px;
    }

    .workbox {
        margin-bottom: 20px;
    }

    .flexbox4 {
        display: block;
    }

    .blackline2,
    .blackline3 {
        padding: 9px 10px 9px 15px;
    }

    .goaisatsu1 {
        width: 85%;
    }

    .logocon {
        width: 85%;
    }

    .topimage {
        margin-top: 80px;
    }

    .message {
        width: 100%;
        height: auto;
        display: flex;
        margin-left: auto;
        position: relative;
        flex-flow: column;
        margin-right: auto;
    }

    .contentO {
        width: 224px;
        height: auto;
        background: #fff;
        margin: 30px auto 0 auto;
        position: relative;
        text-decoration: none;
    }

    .contentC {
        width: 100%;
        height: 400px;
        background: #fff;
        margin: 0px;
        text-decoration: none;
    }

    .yellowbox2 {
        height: 169px;
        top: -58px;
    }

    .yellowbox {
        display: none;
    }

    .grayback {
        background: #fff;
    }

    .inblack2 p,
    .toptext a {
        text-decoration-line: none;
        line-height: 30px;
        font-size: 13px;
        font-weight: 500;
        color: #fff;
        letter-spacing: 1px;
    }

    .f-item p {}
    .contentL {
        right: 10px;
        bottom: 25px;
        position: absolute;
        width: 70%;
        margin-right: 0px;
        margin-top: 0px;
        text-decoration: none;
    }

    .mainbox {
        position: relative;
        top: 670px;
    }

    .listbus1 {
        width: 90%;
    }

    .contentW {
        width: 85vw;
    }

    .comnameout {
        width: 100%;
    }

    .slidetext {
        padding: 34px 5px 15px 5px;
        height: 278px;
        width: 240px;
        position: absolute;
        top: 115px;
        left: 0;
        z-index: 30;
        display: block;
    }

    .slidetext1 {
        margin: 20px auto 0 auto;
        height: 40%;
        position: relative;
    }

    .slidetext1 p {
        font-size: 28px;
        font-weight: 900;
        line-height: 1.2;
    }

    .slidetext2 {
        margin: 0 auto 20px auto;
        text-align: center;
    }

    .slidetext2 span {
        line-height: 3;
        font-size: 18px;
        line-height: 1;
    }


    .business1 img,
    .business2 img {
        height: 250px;
        object-fit: cover;
    }



    .w-img img,
    .w-img2 img,
    .w-img3 img {
        width: 100%;
        height: auto;
    }

    .w-itemleft,
    .w-itemright {
        width: 170px;
    }

    .arrow img {
        width: 65px;
        height: auto;
    }

    .in img {
        position: absolute;
        top: 0;
        left: 0;
        opacity: 0;
        transition: .5s;
        z-index: 0;
    }

    .whiteboxtx3,.newsbox {
        width: 70%;
    }

    .whiteboxtx2,
    .flexbox {
        width: 80vw;
    }

    .pc {
        display: none !important;
    }

    .sp {
        display: block !important;
    }

    /*ヘッダー（サイト名ロゴが入ったブロック）-----------------------------------------------------------*/
    #logo img {
        margin: auto 10px;
        opacity: 1 !important;
        z-index: 85;
        width: 250px;
    }

    .header {
        margin: 0;
        height: 80px;
        background-color: #ffffffb3;
        z-index: 65;
        position: fixed;
        display: block;
        flex-wrap: wrap;
        width: 100%;
        justify-content: space-between;
    }

    .toplogo {
        left: 5px;
        top: 19px;
        z-index: 70;
        margin: auto 0px;
        position: fixed;
        width: 100%;
        display: block;
    }

    /*メインメニュ
---------------------------------------------------------------------------*/
    #menubar-s {
        width: 100%;
        overflow: hidden;
        display: block;
        margin-bottom: 10px;
        /*メニューブロックの下にあけるスペース*/
    }

    #menubar-s .menu-content {
        width: 100%;
        height: 100%;
        position: fixed;
        top: 0;
        left: 100%;
        z-index: 80;
        background-color: #000;
        transition: all 0.5s;
    }

    #menubar-s .menu-content ul {
        padding: 70px 10px 0;
    }

    #menubar-s .menu-content ul li {
        margin: 5vw 0;
        list-style: none;
    }

    #menubar-s .menu-content ul li a {
        font-weight: 600;
        text-align: center;
        display: block;
        width: 100%;
        font-size: 1rem;
        box-sizing: border-box;
        color: #ffffff;
        text-decoration: none;
        padding: 9px 15px 10px 0;
        position: relative;
        letter-spacing: 0.4em;
    }

    #menubar-s .menu-content ul li a span {
        font-weight: 100;
        letter-spacing: 0.1em;
        text-align: center;
        font-size: 13px;
    }

    /*
#menubar-s .menu-content ul li a::before {
    content: "";
    width: 7px;
    height: 7px;
    border-top: solid 2px #ffffff;
    border-right: solid 2px #ffffff;
    transform: rotate(45deg);
    position: absolute;
    right: 11px;
    top: 16px;
}*/
    #menubar-s .menu-btn {
        opacity: 0.5;
        position: fixed;
        top: -1px;
        right: 0px;
        display: flex;
        height: 60px;
        width: 60px;
        justify-content: center;
        align-items: center;
        z-index: 90;
        background-color: #fff;
        border: solid 1px;
        margin: 10px;
    }

    #menubar-s .menu-btn span,
    #menubar-s .menu-btn span:before,
    #menubar-s .menu-btn span:after {
        content: '';
        display: block;
        height: 2px;
        width: 25px;
        border-radius: 2px;
        background-color: #000;
        position: absolute;
    }

    #menubar-s .menu-btn span:before {
        bottom: 8px;
    }

    #menubar-s .menu-btn span:after {
        top: 8px;
    }

    #menu-btn-check:checked~.menu-btn span {
        background-color: rgba(255, 255, 255, 0);
    }

    #menu-btn-check:checked~.menu-btn span::before {
        bottom: 0;
        transform: rotate(45deg);
    }

    #menu-btn-check:checked~.menu-btn span::after {
        top: 0;
        transform: rotate(-45deg);
    }

    #menu-btn-check {
        display: none;
    }

    #menu-btn-check:checked~.menu-content {
        left: 0;
    }

    /*大きな端末用(画面幅801px以上)メニューを非表示にする*/
    #menubar {
        display: none;
    }

    .gray {
        width: 100%;
        background-color: #EEEEEE;
        display: flex;
        flex-wrap: wrap;
        padding: 0px;
        margin: 0;
        text-align: center;
        position: relative;
    }

    .title {
        font-size: 20px;
        font-weight: 900;
        letter-spacing: 1px;
        margin: 10px auto;
    }

    .a title {
        text-align: center;
    }

    .service {
        display: flex;
        flex-wrap: wrap;
        margin: auto;
    }

    .service li {
        width: calc(100%/3);
        /*←画像を横に4つ並べる場合*/
        padding: 5px 20px;
        /*2=上下　左右  3=上 左右 下 4=上 右 下 左*/
        box-sizing: border-box;
        background: url("images/icon.clean.png") no-repeat;
        position: relative;
    }

    .icon {
        letter-spacing: 0em;
        font-size: 14px;
        font-weight: 900;
        margin: 10px 0;
    }

    /*main,subコンテンツ																									
---------------------------------------------------------------------------*/
    #main,
    #sub {
        float: none;
        width: auto;
    }

    /*トップページ内「更新情報・お知らせ」ブロック																									
---------------------------------------------------------------------------*/
    section#new h2.open {
        background: url(../images/btn_minus.png) no-repeat right center/34px 34px, url(../images/mark1.png) no-repeat 10px center, #99CCFF;
        /*マイナスアイコンと背景画像など*/
    }

    section#new h2.close {
        background: url(../images/btn_plus.png) no-repeat right center/34px 34px, url(../images/mark1.png) no-repeat 10px center, #99CCFF;
        /*プラスアイコンと背景画像など*/
    }

    /*その他																									
---------------------------------------------------------------------------*/
    body.s-n #sub {
        display: none;
    }
}

/*画面幅600px以下の設定	*/
@media screen and (max-width:600px) {
    .f-container {
        margin: 0 auto;
        flex-flow: column;
    }

    .f-item {
        width: 60%;
        margin: 20px auto;
    }

    .f-item p {}

    .contentR {
        margin-bottom: 0px;
        padding-top: 30px;
    }

    .detail1,
    .detail2 {
        padding: 1vw 2vw;
        bottom: -37px;
        right: 8px;
    }

    .flexbox2,
    .flexbox3 {
        display: grid;
        width: 85vw;
    }

    .flex2img,
    .flex3img {
        width: 100%;
        order: 2;
        display: block;
    }

    .flex2text,
    .flex3text {
        background: #f7f6f4;
        padding-bottom: 5vw;
        order: 1;
        width: 100%;
    }
}

/*画面幅480px以下の設定																									
----------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:480px) {
    .header {
        margin: 0px;
        height: 70px;
    }

    /*ロゴ画像*/
    #logo img {
        width: 190px;
    }

    .barner-s a {}

    .blackline2 p,
    .blackline2 a,
    .blackline3 p,
    .blackline3 a {
        font-size: 0.9rem;
    }

    .ta1 th {
        width: 65px;
        padding: 10px 12px;
    }

    .ss {
        display: block !important;
    }

    .outs {
        margin-top: 90px;
    }

    /*メインメニュー																									
---------------------------------------------------------------------------*/
    /*======＝メニューバー============*/
    #menubar-s {
        width: 100%;
        overflow: hidden;
        display: block;
        margin-bottom: 10px;
        /*メニューブロックの下にあけるスペース*/
    }

    #menubar-s .menu-content {
        width: 100%;
        height: 100%;
        position: fixed;
        top: 0;
        left: 100%;
        z-index: 80;
        background-color: #000;
        transition: all 0.5s;
    }

    #menubar-s .menu-content ul {
        padding: 70px 10px 0;
    }

    #menubar-s .menu-content ul li {
        list-style: none;
    }

    #menubar-s .menu-content ul li a {}

    #menubar-s .menu-content ul li a span {}

    #menubar-s .menu-btn {
        top: 2px;
        height: 45px;
        width: 45px;
    }

    #menubar-s .menu-btn span,
    #menubar-s .menu-btn span:before,
    #menubar-s .menu-btn span:after {
        content: '';
        display: block;
        height: 2px;
        width: 25px;
        border-radius: 2px;
        background-color: #000;
        position: absolute;
    }

    #menubar-s .menu-btn span:before {
        bottom: 8px;
    }

    #menubar-s .menu-btn span:after {
        top: 8px;
    }

    #menu-btn-check:checked~.menu-btn span {
        background-color: rgba(255, 255, 255, 0);
    }

    #menu-btn-check:checked~.menu-btn span::before {
        bottom: 0;
        transform: rotate(45deg);
    }

    #menu-btn-check:checked~.menu-btn span::after {
        top: 0;
        transform: rotate(-45deg);
    }

    #menu-btn-check {
        display: none;
    }

    #menu-btn-check:checked~.menu-content {
        left: 0;
    }

    /*大きな端末用(画面幅801px以上)メニューを非表示にする*/
    #menubar {
        display: none;
    }

    .topimage {
        margin-top: 70px;
    }

    .afterclean {
        width: 87%;
    }

    .workpics {
        margin: 20px 20px;
        width: 90%;
    }

    .workbox {
        padding-top: 20px;
    }

    .noimage {
        margin-top: 26px;
    }

    .message {
        width: 100%;
        height: auto;
        display: flex;
        margin-left: auto;
        position: relative;
        flex-flow: column;
        margin-right: auto;
        margin-bottom: 20px;
    }

    .contentC {
        width: 100%;
        background: #ffff;
        margin: 0px;
        position: relative;
        text-decoration: none;
    }

    .contentD {
        width: 100%;
        height: 410px;
        background: #fff;
        margin: 0px;
        position: relative;
        text-decoration: none;
    }

    .contentC img {
        width: 100%;
        height: 350px;
        object-fit: cover;
    }

    .contentD img {
        width: 100%;
        height: 400px;
        object-fit: cover;
    }

    .listbus1 {
        opacity: 0.9;
        border-radius: 6px;
        background: #fff;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        list-style-type: none;
        margin: 20px auto 10px auto;
        vertical-align: bottom;
        width: 90%;
        padding: 10px 0 20px 0;
    }

    .h10 {
        background-color: #000080;
        position: fixed;
        z-index: 1;
        width: 100%;
        height: 80px;
    }

    .gray {
        width: 100%;
        background-color: #EEEEEE;
        display: flex;
        flex-wrap: wrap;
        padding: 0px;
        text-align: center;
        position: relative;
        margin: 0px;
    }

    .title {
        font-size: 20px;
        font-weight: 900;
        letter-spacing: 1px;
        margin: 10px auto;
    }

    .a title {
        text-align: center;
    }

    .service {
        display: flex;
        flex-wrap: wrap;
        margin: auto;
    }

    .service li {
        width: calc(100%/2);
        /*←画像を横に4つ並べる場合*/
        padding: 5px 20px;
        /*2=上下　左右  3=上 左右 下 4=上 右 下 左*/
        box-sizing: border-box;
        background: url("images/icon.clean.png") no-repeat;
        position: relative;
    }

    .whitebox2 {
        width: 90%;
    }

    .blackline {
        display: flex;
        vertical-align: middle;
        text-align: left;
        width: 100%;
        height: 35px;
        background-color: #000;
        position: relative;
        margin: 0;
        padding: 5px 0;
    }

    .contentF {
        width: 90%;
        padding-bottom: 1px;
    }

    .listbox {
        background-color: #eee;
        width: 100%;
        margin: 0px auto 30px auto;
        position: relative;
    }

    .contentF p3,
    .contentG p3,
    .contentH p3 {
        padding-bottom: 20px;
        line-height: 0.8;
        font-size: 28px;
        font-weight: 900;
    }

    .contentF p4 {
        font-size: 16px;
        font-weight: 900;
    }

    .blackline3 {
        margin-top: 16px
    }
.bottom {    width: 250px;}
    .bottom span {
        font-size: 16px;
        font-weight: 900;
    }

    .bottom2 p { font-size: 0.75rem;
        line-height: 1.2;
    }
    .bottom1 {
    }

    .bottom2 {
        text-align: left;
        margin: 0 auto;
    }

    .bottom1 img {
    }

    .bottext1 {}

    .p4center {
        text-align: center;
    }

    .postal {
        font-size: 8px;
    }

    div.quote {
        margin-top: 140px;
        display: flex;
        flex-flow: row nowrap;
        justify-content: center;
        align-items: stretch;
        width: 100%;
    }

    .quote span {
        font-size: 20px;
        font-weight: 900;
    }

    .whiteboxtx2,
    .flexbox {
        width: 90%;
    }

    .whiteboxtx3,.newsbox  {
        width: 80%;
    }

    .slidetext {
        padding: 20px 5px 15px 5px;
        height: 240px;
        width: 210px;
        position: absolute;
        top: 117px;
        left: 0;
        z-index: 30;
    }

    .slidetext1 {
        margin: 20px 0;
        height: 70px;
        position: relative;
    }

    .slidetext1 p {
        font-size: 22px;
        font-weight: 900;
        line-height: 1.2;
    }

    .slidetext2 {
        margin: 20px auto 10px auto;
        text-align: center;
    }

    .slidetext2 span {
        line-height: 1;
        font-size: 15px;
        font-weight: 900;
    }

    .slidetext3 p4 {
        display: block;
          font-size: 0.81rem;
        line-height: 1.6;
    }

    .slidetext3 {
        position: relative;
        text-align: left;
        margin: 20px;
    }

    .grayback {
        height: 490px;
        display: block
    }

    .comname {}

    .namebox {
        height: 250px;
        width: 220px;
        padding: 10px 0 10px 0;
    }

    .name1 p {
        font-size: 13px;
        font-weight: 600;
    }

    .name2 {
        vertical-align: text-bottom;
        margin: 0;
        position: relative;
        padding: 1px 1px 1px 1px;
        text-align: right;
        width: 50px;
        line-height: 1;
    }

    .name9 p4 {
        display: block;
        font-size: 12px;
        line-height: 1.2em;
    }

    .contentQ {
        margin: 10px auto 30px auto;
    }

    .contentU {
        margin: 0 auto 20px auto;
        text-align: left;
        width: 100%;
        position: relative;
    }

    .coontentL {
        right: 10px;
        bottom: 25px;
        position: absolute;
        width: 80%;
        margin-right: 0px;
        margin-top: 0px;
    }

    .contentO {
        width: 80%;
        height: auto;
        margin: 0px auto;
        ;
    }

    .logocon {
        width: 100%;
    }

    .contentM {
        width: 300px;
        margin: 30px auto;
    }

    .plus1 {
        position: absolute;
        top: 38px;
        left: 17px;
    }

    .plus2 {
        width: 18px;
        top: 40px;
        left: 76px;
    }

    .plus3 {
        top: 38px;
        left: 98px;
    }

    .explanation {
        margin: 32px 60px 0px auto;
        top: -8px;
        width: 218px;
        right: -32px;
    }

    .namebox2 {
        flex-wrap: wrap;
        justify-content: center;
        list-style-type: none;
        margin: 123px auto 10px auto;
        width: 239px;
        padding: 10px 0 10px 0;
        /* top: 450px; */
    }

    .name1 {
        line-height: 1;
        text-align: left;
        margin: 0;
        padding: 1px 1px 1px 1px;
        text-align: left;
        width: 91px;
        line-height: 1;
    }

    .name9 {
        margin: 5px 5px;
        width: 144px;
        text-align: left;
        position: relative;
    }

    .pritop p2 {
        font-size: 34px;
        font-weight: 900;
        color: #fff;
        margin-bottom: 10px;
        letter-spacing: 1px;
        line-height: 300px;
        display: block;
        margin: auto;
    }

    .line-no p3 {}

    .outs img {
        object-fit: cover;
        width: 100%;
        height: 510px;
    }

    #contents {
        padding-top: 34px;
    }

    .toplogo {
        position: fixed;
        z-index: 70;
        width: 100%;
        display: block;
    }

    .mainbox {
        position: relative;
        top: 463px;
    }

    .wave {
        display: block;
        position: relative;
        top: -113px;
    }


    .yellowbox2 {
        display: none;
    }

    .migi {}

    .footerbox p {}

    .num01 li {
        margin-left: 5px;
    }

    .num01 ol {
        padding-left: 0px;
        padding-bottom: 15px;
    }

    .whiteboxtx5 {
        width: 83%;
        margin: 5px auto;
    }

    .goaisatsu1 {
        width: 90%;
    }

    .logocon {
        width: 100%;
    }

    .f-item {
        width: 75%
    }

    .w-itemleft,
    .w-itemright {
        width: 145px;
    }

    .yellowmark {
        left: -19%;
        width: 20%;
        top: -25%;
    }

    .wreath {
        width: 100%;
    }

    #contents {
        padding-top: 34px;
    }

    #main .list p {
        margin-left: 0;
    }

    /*ボックス内の写真設定*/
    #main .list figure img {
        float: none;
        width: 100%;
        box-sizing: border-box;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        margin-bottom: 10px;
    }

    #main .list h4+figure~p {
        margin-left: 0;
    }

    /*h4タグ直下に画像がある場合のtableタグ設定*/
    #main .list h4+figure~table {
        margin-left: 0;
        width: 100%;
    }

    .ta1 {
        width: 100%;
    }

    /*テーブル内の左側の見出し部分*/
    .ta1 th {
        width: 75px;
        padding: 2px;
    }

    .ta1 th img {
        width: 100%;
    }

    .ta1 td {
        width: auto;
        padding: 5px;
    }

    .ws,
    .wl {
        width: 95%;
    }
}