@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/*アニメーション*/
/* スクロールでふわっと表示 */
.js-fadeup {
    opacity: 0;
    transform: translateY(30px);
    transition-property: opacity, transform;
    transition-timing-function: ease;
    transition-duration: 800ms;
    will-change: opacity, transform;
}

.js-fadeup.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* 左右から出したい時用（必要なら使う） */
.js-fadeleft {
    opacity: 0;
    transform: translateX(-30px);
    transition-property: opacity, transform;
    transition-timing-function: ease;
    transition-duration: 800ms;
    will-change: opacity, transform;
}
.js-fadeleft.is-visible {
    opacity: 1;
    transform: translateX(0);
}

.js-faderight {
    opacity: 0;
    transform: translateX(30px);
    transition-property: opacity, transform;
    transition-timing-function: ease;
    transition-duration: 800ms;
    will-change: opacity, transform;
}
.js-faderight.is-visible {
    opacity: 1;
    transform: translateX(0);
}

/* 動きを減らす設定の人向け */
@media (prefers-reduced-motion: reduce) {
    .js-fadeup,
    .js-fadeleft,
    .js-faderight {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

/*-------------- 共通設定 --------------*/
:root {
    --swl-fz--root: 3.6vw;
    --swl-fz--content: 4.2vw;
}
@media (min-width: 600px) {
    :root {
        --swl-fz--root: 24px;
    }
}
html {
    font-size: var(--swl-fz--root);
}
#lp-content .post_content, #main_content .post_content {
    font-size: var(--swl-fz--content, 20px);
}
a { 
    transition-property: opacity;
    transition-duration: 0.5s;
}
a:hover,img a:hover { 
    opacity: 0.7;
}
/*　電話
@media (min-width: 820px) {
    a[href^="tel:"] {
        pointer-events: none;
    }
}*/
/*元テンプレート打ち消し*/
.post_content h2:where(:not([class^="swell-block-"]):not(.faq_q):not(.p-postList__title)) {
    border-top: none;
    border-bottom: none;
}
.l-content {/*フッター前空白消去*/
    margin-bottom:0;
}
.w-beforeFooter {/*フッター前空白消去*/
    margin-top:0em;
}
/*-------------- ヘッダー --------------*/
.c-headLogo__link {
    min-width:50vw;
    padding-left:8vw;
}
.header_right {
    vertical-align: middle;
    padding-top:0.8em;
    padding-bottom:0.8em;
    padding-right:3.5vw;
}
.header_right div,.header_right p {
    display: inline;
    vertical-align: middle;
}
.is-style-btn_normal {
    max-width: 50vw;
}
.fv img {
    width: 40vw;
}
@media only screen and (min-width: 600px) and (max-width:1400px) {
    .c-headLogo__link {
        min-width:50vw;
        padding-left:1vw;
        font-size: 0.8em !important;
    }
    .header_right {
        padding-top:.3em;
        padding-bottom:.3em;
        padding-right:0vw;
    }
    .swell-block-button ,.is-style-btn_normal{
        font-size: 0.7em;
        padding:0.5em;
    }
}
@media only screen and (min-width: 1px) and (max-width:600px) {
    .c-headLogo__link {
        min-width:90vw;
        padding-top:1em;
        padding-left:0vw;
        font-size: 1em !important;
        margin-right: auto;
    }
    .c-headLogo.-txt {
        display: block;
        margin-top: .6em;
        margin-left: auto;
        margin-right: auto;
    }

    div.l-header__logo {
        padding-left:0;
        padding-right:0;
        width:100%;
        font-size:0.9em;
    }
}

.p-mainVisual__textLayer .p-blogParts{/*FVタイトル*/
    text-align: center;
    margin-left:auto;
    margin-right: auto;
}
@media only screen and (min-width: 770px) and (max-width:960px) {
    .fv img {
        width: 70vw;
    }
}
.swl-inline-icon:after {/*ヘッダーSNS*/
    background: #000000;
}

.p-mainVisual {
    background: #CADEE3;
}
.title,.post_content h2,.post_content h3,.post_content h4 {
    position: relative;
    z-index: 10;
}
.post_content h2 {
    font-size: 2em;
}
.post_content h3 {
    font-size: 1.6em;
}
.post_content h4 {
    font-size: 1.3em;
}
.swell-block-box-menu__inner{
	border:none;
}

/* SPのメニューアイコンを非表示 */
.l-header__menuBtn {
    visibility: hidden !important;
}
.post_content h2:where(:not([class^="swell-block-"]):not(.faq_q):not(.p-postList__title)) {
    background-color: transparent;
    border: none;
    color:#000000;
}
.post_content h2::after,.post_content h2::before,.post_content h3::before{
    display:none;
}
.contact-icon a{
	font-size:2em;
}
/* パンくずリスト非表示 */
.p-breadcrumb {
  display: none;
}
.swell-block-button__link {
    --the-btn-radius: 10px;
}
.c-gnav li a:hover {
    color:#333333
}
.c-fixBtn {
    border-radius: 0.5em;
}
/* 全幅指定 */
.full-width {
    display: block;
    position: relative;
    margin: 0 calc(50% - 50vw);
    padding: 0em calc(10vw - 50%) 5em;
}

@media only screen and (min-width: 1px) and (max-width: 700px) {
.full-width {
    padding-bottom: 3em;
 }
}
.mw_1600 {
    max-width: 1600px;
    width: calc(100% - 2em);
    margin-right:auto;
    margin-left:auto;
}
.mw_1440 {
    max-width: 1440px;
    width: calc(100% - 2em);
    margin-right:auto;
    margin-left:auto;
}
.mw_1200 {
    max-width: 1200px;
    width: calc(100% - 2em);
    margin-right:auto;
    margin-left:auto;
}
@media only screen and (min-width: 1px) and (max-width: 1600px) {
.mw_1600,.mw_1440,.mw_1200 {
    margin-right: auto;
    margin-left: auto;
    padding-right:1em;
    padding-left:1em;
}
}

/*.mw_1200_right {
    width: 1200px;
    max-width: 1200px;
    margin-right:auto;
    margin-left:auto;
}*/
 /*英語*/
.title_en {
    font-family: Impact,Arial, Helvetica, sans-serif;
    position: absolute;
    z-index: 1;
}
#problem .title_en {
    left: 3%;
    top: -75px;
    height: 600px;
    width: 1300px;
    content:'';
    background-image: url("img/en_problem.png");
    transform: rotate(-7deg);
    opacity: 0.1;
	background-size: 80vw auto;
	background-repeat: no-repeat;
}
#flow .title_en {
    right: 0;
    top: 0;
    height: 100vh;
    width: 10vw;
    content:'';
    background-image: url("img/en_area.png");
    opacity: 0.1;
	background-size: 8vw auto;
	background-repeat: no-repeat;
    background-position: top right;
    /*color:rgb(0 0 0 / .1);
    transform: rotate(90deg);*/
}
#construction .title_en {
    left: 0;
    top: 0;
    height: 1000px;
    width: 10vw;
    content:'';
    background-image: url("img/en_construction.png");
    opacity: 0.2;
	background-size: 8vw auto;
	background-repeat: no-repeat;
    background-position: top left;
    /*color:rgb(0 0 0 / .1);
    transform: rotate(90deg);*/
}
#qa .title_en {
    top: 0.5em;
    right: 0;
    left: 0;
    margin: 0 auto;
    height: 300px;
    width: 700px;
    content:'';
    background-image: url("img/en_qa.png");
    opacity: 0.2;
	background-size: auto 14.5vw;
	background-repeat: no-repeat;
    background-position: top right
}
#company .title_en {
    right: 0;
    top: 0;
    height: 300px;
    width: 800px;
    content:'';
    background-image: url("img/en_company.png");
    opacity: 0.3;
	background-size: auto 9vw;
	background-repeat: no-repeat;
    background-position: top right
}
#contact .title_en {
    left: 0;
    top: 0;
    height: 800px;
    width: 10vw;
    content:'';
    background-image: url("img/en_contact.png");
    opacity: 0.15;
	background-size: 9vw auto;
	background-repeat: no-repeat;
    background-position: top left;
}

@media only screen and (min-width: 1px) and (max-width:1000px) {
#qa .title_en {
    right:-120px;
    top:3em;
    width: 200px;
    background-position: right top;
	background-size: 150px auto;
}
#flow .title_en {
    width: 80px;
	background-size: 80px auto;
    left:-2px;
}
}
@media only screen and (min-width: 1px) and (max-width:600px) {
#construction .title_en {
    width: 80px;
	background-size: 80px auto;
}
#company .title_en {
    width: 500px;
	background-size: auto 80px;
}
#contact .title_en {
    width: 20vw;
	background-size: 15vw auto;
}
}
/*ボタン*/
.is-style-btn_normal a { transition-property: opacity; transition-duration: 0.5s;}
.is-style-btn_normal a:hover{ opacity: 0.8; }

@media only screen and (min-width: 1px) and (max-width: 768px) {
.wp-block-group {
    padding:0.2em;
}
.swell-block-step__item {
    padding:0.1em;        
}
}

/* 見出しの下に短い下線 */
.center_h3 {
  position: relative;
  text-align: center;
  padding-top:20px;
}
.center_h3::before {
  background-color: #d87390; /* 線の色 */
  border-radius: 5px; /* 線の両端を丸く */
  bottom: -10px; /* 線の位置 */
  content: "";
  height: 4px; /* 線の高さ */
  left: 50%; /* 線の中央寄せ */
  position: absolute;
  transform: translateX(-50%); /* 線の中央寄せ */
  width: 30px; /* 線の長さ */
}
h2:before,h2:after {
    position: absolute;
    width: 100%;
    bottom: 0;
    content: '';
}
h2:before {
  border-bottom: 3px solid #db657f;
}
h2:after {
  border-bottom: 3px solid #cccccc;
}
.triangle {
    height: calc(8vw / 2);
    width:28vw;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    position: absolute;
    top:-3px;
    right: 0;
    left: 0;
    margin: 0 auto;
    z-index:1;
}

@media only screen and (min-width: 1px) and (max-width: 768px) {
.triangle {
    height: calc(17vw / 2);
    width:42vw;
    clip-path: polygon(0 0, 100% 0, 50% 100%);

}
}
/*-------------- サービス --------------*/
#service {
	background-repeat: no-repeat;
    background-position: -18% 15%;
    background-image: url("img/0en_woman.png");
	background-size: 46% auto;
    margin-top:-2px;
    padding-top:2em;
    z-index: 10;
    position: relative;
}

.square {
    position: relative;
    margin-right: auto;
    margin-left: auto;
    p {
        content:"";
        height: 1em;
        margin: 1em auto .5em;
    }
    .square1 {
        background-color: rgb(255 255 255 /.5);
    }
    .square2 {
        background-color: rgb(255 255 255 /.3);
        width: 80%;
    }
}

#service .title {
    z-index: 10;
    position: relative;
    text-align: right;
    margin:4em auto 1em;
    img {
        width: 50vw;
    }
}
#service .q {
    text-align: right;
    margin:1.5em auto 0em;
    img {
        width: 68vw;
    }
}
#service .q_check {
    text-align: right;
    font-size:0.95em;
    margin:2em auto 0em;
    padding-left:4.5em;
    padding-right:0em;
    ul {
    list-style-type:none;
    font-size: 1.4em;
    font-weight: bold;
    text-shadow:1px 1px 5px #ffffff;
    text-align: left;
    }
    li {
    background-image:url("img/service_check.png");
    background-repeat:no-repeat;
    background-position:left top;
    background-size:2.4vw;
    font-size:105%;
    padding-left:1.5em;
    margin-top:1em;
    margin-bottom:2em;
    line-height:1.5em;
    }
}
.service_pc {
    display: block;
}
.service_sp {
    display: none;
}

@media only screen and (min-width: 600px) and (max-width:1300px) {
    #service {
        background-position: -10em 5em;
        background-image: url("img/0en_woman.png");
	    background-size: 60% auto;
    }
    #service .title {
        margin-right:3em;
        img {
            width: 65%;
        }
    }
    #service .q_check {
        li {
        background-image:url("img/service_check.png");
        background-size:4vw;
        }
    }
}
@media only screen and (min-width: 1px) and (max-width:600px) {
    #service {
        background-position: -140px 300px;
        background-image: url("img/0en_woman.png");
	    background-size: 110% auto;
        padding-top:0em;
        padding-bottom:7em;
    }
    #service .title {
        z-index: 10;
        position: relative;
        text-align: right;
        margin-top:2em;
        margin-right:1em;
        margin-left:1em;
        margin-bottom:.3em;
        img {
            width: 100%;
        }
    }
    #service .q {
        text-align: right;
        margin:0em 2em 1em auto;
        img{
            width:38%;
        }
    }
    .service_pc {
        display: none;
    }
    .service_sp {
        display: block;
    }
    #service .q_check {
    text-align: left;
    font-size: .7em;
    letter-spacing: .8;
    margin:2em auto 1em;
    padding-left:0em;
    padding-right:0em;
    }
    #service .q_check ul {
    text-align: left;
    margin:1em auto 0em;
    padding-left:0.3em;
    padding-right:0em;
    ul {
        list-style-type:none;
        font-size: 1.3em;
        text-align: left;
        }
    li {
        background-position:left top;
        background-size:30px;
        padding-left:1.8em;
        margin-top:1em;
        margin-bottom:2em;
        line-height:1.5em;
        }
    }
    #service .end{
        padding:1.3em;
        line-height: 1.5;
    }
}
#service .end{
    position: relative;
    z-index: 10;
    text-align: center;
    font-weight: bold;
    background-color: #ffffff;
    border-radius: 1em;
    padding:1em;
    
}

/*-------------- お悩み --------------*/
.problem_triangle {
    right: 0;
    top: -1px;
    height: 70vh;
    width: 100%;
    z-index: 1;
    position: absolute;
    content:'';
    background-image: url("img/problem_triangle.png");
	background-repeat: no-repeat;
    background-size: 108vw;
    background-position: top center;
}
#problem {
    padding-bottom: 2em;
}
#problem .title {
    text-align: center;
}
#problem .whitebox {
    position: relative;
    z-index: 10;
    background: #ffffff;
    text-shadow:0 0 13px #ffffff, 0 3px 0 #ffffff, 2.1px 2.1px 0 #ffffff, 3px 0 0 #ffffff, 2.1px -2.1px 0 #ffffff, 0 -3px 0 #ffffff, -2.1px -2.1px 0 #ffffff, -3px 0 0 #ffffff, -2.1px 2.1px 0 #ffffff;
    font-weight: bold;
    padding:1.8em 2.8em 1.6em;
    background-repeat: no-repeat;
    border-radius: 1em;
    margin-top: 2em;
    margin-bottom: 2em;
    font-size:1.4em;
}
#problem .left{
    text-align: left;
    background-position: 90% 103%;
    background-image: url("img/problem_woman.png");
	background-size:9vw auto;
}
#problem .right{
    text-align: right;
    background-position: 10% 103%;
    background-image: url("img/problem_man.png");
	background-size: 12vw auto;
}
@media only screen and (min-width: 1px) and (max-width:600px) {
    #problem {
        padding-top: 1em;
        padding-bottom:2em;
    }
    .problem_triangle {
        top: -3px;
        background-image: url("img/problem_triangle_sp.png");
    }
    #problem .title {
        margin:auto;
        img{
            width: 100%;
        }
    }
    #problem .title {
        margin: -3em auto .5em;
    }
    #problem .whitebox {
        font-size:1.1em;
        padding:1.5em 2em;
        max-width: calc(100% - 2em);
        line-height: 1.2;
    }
    #problem .left{
        background-position: 95% 103%;
	    background-size: 23vw auto;
    }
    #problem .right{
        padding-left:2em;
        background-position: 3% 103%;
	    background-size: 30vw auto;
    }
}
/*-------------- 流れ --------------*/
.triangle_bk {
    height: calc(30vh / 2);
    width: 100%;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    position: absolute;
    top:0px;
    right: 0;
    left: 0;
    margin: -3px auto;
    background-color: #555555;
    z-index:1;
}
#flow {
	background-repeat: no-repeat;
    background-position: right -3vw top -6vw;
    background-image: url("img/area_map.png");
	background-size: 55vw auto;
    padding-top:10em;
    .title {
        padding-bottom:1.5em;
    }
    .red0_ {
        color:#BF0909;
        font-size:1em;
        font-weight: bold;
    }
    .red0 {
        color:#BF0909;
        font-size:0.9em;
        font-weight: bold;
        text-decoration: underline;
        line-height: 0.9;
    }
}
#flow .flow_box {
    border:#005F75 solid 0.4em;
    border-radius: 1.6em;
    margin: 2em auto;
    padding:3em 4em 4em;
    h3 {
        text-align: center;
        color: #005F75;
        font-size: 1.5em;
    }
}
#flow .title h2 {
    text-align: center;
    z-index: 20;
    position: relative;
    padding:0.3em 0;
    margin-block-end: 0.3em;
    img {
        width: 25vw;
        padding-right: 0.3em;
    }
    span {
        vertical-align: 1em;
    }
}
#flow .title_pc {
    text-align: center;
}
#flow .title_sp {
    display: none;
}
@media only screen and (min-width: 1px) and (max-width: 1400px) {
    #flow .title_pc {
        display: none;
    }
    #flow .title_sp {
        display: block;
        text-align: center;
    }
}
.swell-block-step__title span{
    font-size:1.4em;
    padding-left:1.8em;
    line-height: 2.5;
}
.swell-block-step__body p{
    font-size:1.1em;
    padding-left:2.5em;
}
.swell-block-step__title span,.swell-block-step__body p {
    text-shadow:0 0 13px #ffffff, 0 3px 0 #ffffff, 2.1px 2.1px 0 #ffffff, 3px 0 0 #ffffff, 2.1px -2.1px 0 #ffffff, 0 -3px 0 #ffffff, -2.1px -2.1px 0 #ffffff, -3px 0 0 #ffffff, -2.1px 2.1px 0 #ffffff;
}
.swell-block-step__item::before {
    border-left-width :3px;
    left:1.9em;
}
#flow .end{
    text-align: center;
    font-weight: bold;
    font-size: 1.3em;
    line-height: 1.7;
}
.swell-block-step__item .swell-block-step__title span {
    font-size:0.9em;
    padding-left:60px;
}
.swell-block-step__item {
    padding-bottom:2em;
}
.swell-block-step:not(.is-style-big):not(.is-style-small)>.swell-block-step__item>.swell-block-step__body {
    margin-left:0;
    font-size: 0.9em;
}

.swell-block-step__number {
    height: 3.8em;
    width: 3.8em;
    .__label {
        font-size:0.7em;
    }
}
.swell-block-step__number:after {
        padding-top:0.1em;
        font-size:1.4em;
}
.flow_box .step1 {
	background-repeat: no-repeat;
    background-position: right 15% top;
    background-image: url("img/flow_1.png");
	background-size: 15vw auto;
}
.flow_box .step2 {
	background-repeat: no-repeat;
    background-position: right top 1em;
    background-image: url("img/flow_2.png");
	background-size: 8vw auto;
}
.flow_box .step3 {
	background-repeat: no-repeat;
    background-position: right bottom;
    background-image: url("img/flow_3.png");
	background-size: 10vw auto;
}
.flow_box .step4 {
	background-repeat: no-repeat;
    background-position: right 15% bottom;
    background-image: url("img/flow_4.png");
	background-size: 15vw auto;
}
.flow_box .step5 {
	background-repeat: no-repeat;
    background-position: right bottom;
    background-image: url("img/flow_5.png");
	background-size: 10vw auto;
}

/*
@media only screen and (min-width: 655px) and (max-width: 895px) {
    .triangle_bk {
    height: calc(15vh / 2);
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    }
}*/
@media only screen and (min-width: 800px) and (max-width: 1000px) {
    #flow {
        background-position: right -6em top -3em;
	    background-size: 80vw auto;
        padding-top:10em;
        .title {
            font-size: 1.3em;
            }
        }
    }
@media only screen and (min-width: 1px) and (max-width: 800px) {
    .triangle_bk {
        margin: -1px auto;
        height: calc(13vh / 2);
        clip-path: polygon(0 0, 100% 0, 50% 100%);
        }
    #flow {
        background-position: right -6em top 9em;
	    background-size: 140vw auto;
        padding-top:5em;
        .title {
            font-size: 1.3em;
            }
        }
}

@media only screen and (min-width: 1px) and (max-width: 1000px) {
    #flow .title h2 {
    position: relative;
    font-size: 0.9em;
    padding:0.3em .3em;
    img {
        width:  75vw;
        padding-right: 0.3em;
        }
    }
    .title_sp img {
        width:  75vw;
        }
    #flow .flow_box {
        padding:2em 1em;
    }
    .swell-block-step__number {
        height: 3.5em;
        width: 3.5em;
        .__label {
        font-size:0.6em;
        }
    }
    .swell-block-step__item .swell-block-step__title span{
        padding-left:3.5em;
    }
    .swell-block-step__body p{
        padding-top:0.5em;
        padding-left:0.8em;
        padding-right:0em;
        font-size: 1.1em;
        line-height: 1.5;
    }
    #flow .end{
    font-size: 1em;
    line-height: 1.4;
    }
    
    .flow_box .step1 {
	background-size: 25vw auto;
    background-position: right bottom;
    padding-bottom: 3em;
    }
    .flow_box .step2 {
	background-size: 12vw auto;
    background-position: right bottom;
    }
    .flow_box .step3 {
	background-size: 17vw auto;
    background-position: right bottom;
    padding-bottom: 4em;
    }
    .flow_box .step4 {
	background-size: 24vw auto;
    background-position: right bottom;
    }
    .flow_box .step5 {
	background-size: 16vw auto;
    background-position: right bottom;
    padding-bottom: 4em;
    }
}

/*-------------- 施工事例 --------------*/

#construction {
    padding-top:4em;
}

@media screen and (max-width: 1000px) {
    #construction {
    padding-top:2em;
    }
}
#construction .title {
    z-index: 10;
    position: relative;
    margin :0em auto 1em;
    text-align: center;
}
#construction .title h2 {
    color:#ffffff;
    text-align: center;
    z-index: 20;
    position: relative;
    padding:0 auto;
}
#construction h3 {
    margin-bottom:1em;
    border-bottom:3px solid #CE703B;
}
#construction .whitebox {
    position: relative;
    padding:2em 3em;
    gap: 5px;
}
.construction_flex { /*横並び要素　要素中央寄せ　写真とアクセス*/
    display: flex;
    justify-content:center;
    align-items:stretch;
    z-index: 10;
    position: relative;
    margin-bottom:1.5em;
    width: 100%;
    gap:2em;
    .construction_img {
    flex-basis: 70%; 
    padding-top:10px;
    }
    .construction_img img{
    width: 100%;
    max-width: 700px;
    margin:auto;
    }
}
.fsama {
    background-position: bottom right 1em;
    background-image: url("img/construction_fsama.png");
	background-size: 9vw auto;
	background-repeat: no-repeat;
}
.construction_table {
    position: relative;
    display: block;
    height: auto;
    width: 100%;
    margin: 0;
    text-align: left;
    padding:0px 5px;
    border-radius: 3em;
    h4 {
        color:#005F75;
        font-weight: bold;
        margin:5px 0;
        border: none;
    }
    span {
        background: #005F75;
        color:#ffffff;
        padding:0.2em;
        width: 9vw;
        display: block;
        text-align: center;
    }
}
.construction_table tr, .construction_table th, .construction_table td {
    border: none;
    background-color: transparent;
    vertical-align:top;
    padding-right:0;
    padding-left:0;
}
.construction_table th, .construction_table td {
    padding-top: 1em;
    padding-bottom: 1em;
}
.construction_table th {
    width: 25%; 
    text-align: left;
    font-weight: normal;
}
.construction_table td {
    text-shadow:0 0 13px #ffffff, 0 3px 0 #ffffff, 2.1px 2.1px 0 #ffffff, 3px 0 0 #ffffff, 2.1px -2.1px 0 #ffffff, 0 -3px 0 #ffffff, -2.1px -2.1px 0 #ffffff, -3px 0 0 #ffffff, -2.1px 2.1px 0 #ffffff;
}
@media screen and (max-width: 1400px) {
    .construction_table {
    padding:0px;
    span {
        width: auto;
    }
    }
    .construction_table th, .construction_table td {
        padding-top: 0em;
        padding-bottom: 0em;
    }
    .construction_table tr {
        padding-top: .5em;
        padding-bottom: .5em;
    }
    .construction_table th {
        width: 100%; 
        padding-bottom: .5em;
    }
    #construction .whitebox {
        h3 {
            font-size: 1.4em;
        }
        padding:2.5em 2em;
        gap: 0px;
    }
    .construction_flex { /*要素中央寄せ　写真とアクセス*/
        display: table;
        justify-content:center;
        align-items:center;
        width: 100%;
        padding:30px 0px 10px 0px;
        .construction_img {
        padding-top:0px;
        text-align: center;
        }
    }
    .construction_table,.construction_table tr,.construction_table td,.construction_table th {
        display:block;
        padding-left:0;
        padding-right:0;
    }
    .construction_table th {
        width:auto;
        width: 100%; 
        text-align: left;
        font-style: normal;
    }
    .fsama {
        background-position: bottom right 1em;
        background-image: url("img/construction_fsama.png");
	    background-size: 20vw auto;
	    background-repeat: no-repeat;
    }
}

@media screen and (max-width: 600px) {
    #construction .whitebox {
        padding:2.5em 1em;
    }
    #construction h3 {
        margin-bottom:0em;
    }
    .construction_img {
    padding-bottom:2em;
    }
}
/*-------------- Q&A --------------*/
#qa {
    padding-top:4em;
}
@media screen and (max-width: 1000px) {
    #qa {
    padding-top:2em;
    }
}
#qa .title {
    z-index: 10;
    position: relative;
    margin :0em auto 1em;
    margin :0 auto;
    text-align: center;
}
#ga .title h2 {
    text-align: center;
    z-index: 20;
    position: relative;
    padding:0.3em 0;
}
.swell-block-faq__item .faq_q {
    background-color: rgb(255 255 255 /.9);
}

@media only screen and (min-width: 1px) and (max-width: 770px) {
    .swell-block-faq__item {
        font-size:0.9em;
        .faq_q,.faq_a {
            padding-right:.5em;
        }
    }
}
/*-------------- Company --------------*/
#company {
    padding-top:4em;
}
#company .theme {
    z-index: 20;
    position: absolute;
    top:5%;
    left:3%;
    height: 200px;
    width: 1000px;
    text-align: left;
    content:"";
    transform:rotate(-2deg);
    background-image: url("img/company_theme.png");
	background-size: auto 10vw;
	background-repeat: no-repeat;
    background-position: left top;
}
#company .title {
    z-index: 10;
    position: relative;
    margin-top :2em;
}
#company .title h2 {
    color:#ffffff;
    text-align: right;
    z-index: 20;
    position: relative;
    padding:0.3em 0;
    font-size: 1.5em;   
    font-weight: normal;
}
.orangebox{
    position: relative;
    padding:4em;
    gap: 5px;
    box-shadow: 10px 10px #FFFFFF;
}
.company_flex { /*横並び要素　要素中央寄せ　写真とアクセス*/
    display: flex;
    justify-content:center;
    align-items:stretch;
    z-index: 10;
    position: relative;
    margin-bottom:1.5em;
    width: 100%;
    gap:2.5em;
}
.company_img {
    flex-basis: 50%;
    padding-top: 0.3em;
}
.company_img img{
    width: 100%;
    margin:auto;
}

/* Company概要テーブル */
.company_table {
    position: relative;
    display: block;
    height: auto;
    width: 100%;
    margin: 0;
    font-size:1em;
    text-align: left;
    padding:0px;
    border-radius: 3em;
    color:#ffffff;
}
.company_table h3{
    padding:0px;
    margin-bottom:0.7em;
    font-size: 1.3em;
}
.company_table tr, .company_table th, .company_table td {
    border: none;
    background-color: transparent;
    vertical-align:top;
    font-size: 1.0em;
}
.company_table th,.company_table td {
    padding-top: 0.7em;
    padding-bottom: 0.7em;

}
.company_table th {
    width: 20%; 
    text-align: left;
}
@media screen and (max-width: 1000px) {
    #company .theme {
        top:1%;
        left:-2%;
        height: 100px;
        width: 800px;
        text-align: center;
        font-size:2.5em;
    }
    .orangebox{
        position: relative;
        padding:2em;
        gap: 0px;
    }
    .company_flex { /*要素中央寄せ　写真とアクセス*/
        display: table;
        justify-content:center;
        align-items:center;
        width: 100%;
        padding:1em 0px 10px 0px;
        gap: 0px;
    }
    .company_table,.company_table tr,.company_table td,.company_table th {
        display:block;
    }
    .company_table tr{
        padding-left:0px;
        padding-right:3px;
    }

    .company_table td {
        padding-top: 0em;
    }
    .company_table th {
        width:auto;
        width: 100%; 
        text-align: left;
        font-style: normal;
    }
    .company_img {
        padding-top:0;
        img{
        height: 250px;
        object-fit: cover;
        object-position: 0 80%;
        margin: auto;
        }
    }
}

@media only screen and (min-width: 1px) and (max-width: 770px) {
    #company {
        padding-top:5.5em;
    }
    #company .theme {
        top:1em;
        left:0%;
        height:  200px;
        width: 800px;
        text-align: left;
    	background-size: auto 15vw;
    }
    #company .title h2 {
        font-size:1.2em;
        text-align: center;
        padding-bottom:.8em;
    }
    .company_flex {
        padding:0em;
        h3{
        padding-left:1em;
        padding-right:1em;
        }
    }
    .company_table {
        padding:0;
    }
    .company_table th,.company_table td {
        padding-left:1em;
        padding-right:1em;
        padding-bottom:0.3em;
    }
    .company_table tr {
        padding-bottom:1em;
    }
    .orangebox{
        box-shadow: none;
        padding:0em;
        font-size:0.9em;
    }
}
/*-------------- 地元密着 --------------*/
#jimoto {
    padding-top:4em;
    margin-top:-1px;
}
.jimoto_theme {
    display: block;
    position: relative;
    margin: auto calc(50% - 50vw);
    width: 100vw;
    color:#ffffff;
    font-size:1.9em;
    font-weight: bold;
    text-align: center;
    letter-spacing: 0.1em;
    background: linear-gradient(180deg, #005F75 0%, #005F75 60%, #CE703B 60%, #CE703B 100%);
}
.jimoto_title {
    margin:0 auto;
    text-align: center;
    img {
        width: 88%;
        max-width: 950px;
    }
}
.jimoto_auto { /*横並び要素　要素中央寄せ　写真とアクセス*/
    display: flex;
    justify-content:center;
    align-items:center;
    z-index: 10;
    position: relative;
    margin-bottom:0.5em;
    padding-top:3em;
    width: 100%;
    gap:3em;
    .word {
        max-width: 550px;
    }
    .img img{
        margin:auto;
    }
}

@media only screen and (min-width: 1px) and (max-width: 1250px) {
    #jimoto {
        padding-top:2em;
    }
    .jimoto_theme {
        font-size:1.5em;
        letter-spacing: 0em;
    }
    .jimoto_auto { /*横並び要素　要素中央寄せ　写真とアクセス*/
    display: table;
    padding-top:2em;
    gap:0em;
    .word {
        width: 50wv;
        max-width: 100%;
        text-align: center;
        margin:3em auto;
        padding-top:1em;
    }
    .img {
        width: 80%;
        text-align: center;
        margin:0em auto;
    }
    }
}
@media only screen and (min-width: 1px) and (max-width: 700px) {
    #jimoto {
        padding-top:0em;
    }
    .jimoto_theme {
        font-size:1.2em;
        letter-spacing: 0em;
    }
    .jimoto_auto { /*横並び要素　要素中央寄せ　写真とアクセス*/
    display: table;
    padding-top:2em;
    .word {
        max-width: 90%;
    }
    .img {
        width: 92%;
    }
    }
}
/*-------------- 問い合わせ --------------*/
#contact .title {
    font-size: 0.9em;
}
.contact_auto { /*横並び要素　要素中央寄せ　写真とアクセス*/
    z-index: 10;
    position: relative;
    max-width: calc(100%-2em);
    width: 100%;
    margin-right:auto;
    margin-left: auto;
    padding-left:1em;
    padding-right: 1em;
    text-align: center;
    color: #005F75;
    font-size:1em;
    div {
        display:inline-block;
        margin:auto;
        text-align: center;
        font-weight: bold;
    }
    span{
         display: block;
         padding-top: 0.5em;
         padding-bottom: 0.5em;
         margin-left:.5em;
         margin-right: .5em;
        }
    .__icon{
        padding-top: 3px;
        padding-bottom: 0px;
    }
}
.contact_auto_qr { /*横並び要素　要素中央寄せ　写真とアクセス*/
    z-index: 10;
    position: relative;
    max-width: 90%;
    width: 80%;
    margin-right:auto;
    margin-left: auto;
    padding-left:1em;
    padding-right: 1em;
    text-align: center;
    color: #005F75;
    font-size:1em;
    div {
        display:inline-block;
        margin:auto;
        text-align: center;
        font-weight: bold;
    }
}

.button {
    width: 13em;
    margin: 0 auto 0.2em;
    padding: 1em 1.2em;
    border-radius: 0.5em;
    color:#ffffff;
    background: #005F75;
    opacity: 1;
    font-size:1.7em;
}
.button :hover {
    opacity: 0.7;
}

@media only screen and (min-width: 650px) and (max-width: 1000px) {
    .contact_auto { /*横並び要素　要素中央寄せ*/
        max-width: calc(100%-2em);
        width: 100%;
        text-align: center;
        padding-left:auto;
        padding-right: auto;
        div {
            text-align: center;
            margin:1em auto;
            }
        }
}
@media only screen and (min-width: 1px) and (max-width: 1000px) {
    .contact_auto_qr { /*横並び要素　要素中央寄せ　写真とアクセス*/
        width: 90%;
        padding:2em auto 2em ;
        div {
            width: 48%;
            img {
                width: 80%;
            }
            }
        .pr20 {
            padding-right: 0em;        
            }
        .pl20{
            padding-left: 0;        
            }
        }
    }
@media only screen and (min-width: 1px) and (max-width: 650px) {
    .button {
        min-width: calc(100% - 2em);
        padding: .7em 1em;
        }
    }

.w80 {
    width: 80%;
    max-width: 600px;
    margin: 0 auto;
    letter-spacing: 0.1em;
}

/* marginセンターがきかない時 */
.db-center {
    display: block;
    margin: 0 auto;
}
.center{
    text-align: center;
}

.pc {
    display: table;
}
.sp {
    display: none;
}
/* モバイル版 */
@media only screen and (min-width: 1px) and (max-width: 768px) {
.pc {
    display: none;
}
.sp {
    display: table;
}
.l-content { /*フッター直前の余白を消す*/
  margin-bottom: 0 !important;
}
}

@media only screen and (min-width: 1px) and (max-width: 768px) {
    footer {
        padding-top: 2em;
        .swell-block-button__link {
            text-align: center;
            margin-left:auto;
            margin-right:auto;
            padding-left: 0;
            padding-right: 0;
            min-width: 100%;
        }
    }
.footer_title {
    padding:1em auto;
    font-size:0.8em;
    line-height: 1.1;
    img {
        width: 70vw;
    }
}
}


/*-------------- SP下部固定誘導ボタン --------------*/
@media screen and (max-width: 959px) {
    body {
        padding-bottom: 68px; /* 固定メニューの高さに合わせて余白を設定 */
    }
    .p-fixBtnWrap {
        bottom: 5.8em; /* 上に戻るボタンの位置を上に */
    }
    #fixed-bottom-menu {
        display: block;
        position: fixed;
        left: 0;
        bottom: 0;
        width: 100%;
        z-index: 99;
        background-color: #000;
        padding: .3em .3em;
    }
    #fixed-bottom-menu .swell-block-button a {
        border-radius: .5em;
        color:#333333;
    }
    #fixed-bottom-menu .swell-block-column {
        padding: .4em .5em;
    }
    #fixed-bottom-menu .swell-block-button__link[data-has-icon] {
        padding: 0.8em 1em;
    }    
}
@media screen and (min-width: 960px) {
    #fixed-bottom-menu, #fixed-sidebar-menu {
        display: none; /* PCでは非表示にする */
    }
    .copyright {
        margin-bottom:5em;
    }
}

/*-------------- 配置・空白 --------------*/
.fs070{font-size:0.70em;}
.fs075{font-size:0.75em;}
.fs080{font-size:0.80em;}
.fs085{font-size:0.85em;}
.fs090{font-size:0.90em;}
.fs095{font-size:0.95em;}
.fs110{font-size:1.1em;}
.fs120{font-size:1.2em;}
.fs130{font-size:1.3em;}
.p3{ padding: 3px; }
.p5{ padding: 5px; }
.p8{ padding: 8px; }
.p-auto10{ padding: auto 10px; }
.p15{ padding: 15px; }
.p20{ padding: 20px; }
.p25{ padding: 25px; }
.p30{ padding: 3em; }
.pt10{ padding-top: 1em; }
.pt20{ padding-top: 2em; }
.pt30{ padding-top: 3em; }
.pt40{ padding-top: 4em; }
.pt50{ padding-top: 5em; }
.pr10{ padding-right: 1em; }
.pr20{ padding-right: 2em; }
.pb20{ padding-left: 2em; }
.pb20{ padding-bottom: 2em; }
.m3{ margin: 3px; }
.m5{ margin: 5px; }
.m8{ margin: 8px; }
.m10{ margin: 10px; }
.m15{ margin: 15px; }
.m20{ margin: 20px; }
.m25{ margin: 25px; }
.m30{ margin: 30px; }
.m10a{ margin: 1em auto; }
.m20a{ margin: 2em auto; }
.m30a{ margin: 3em auto; }
.m40a{ margin: 4em auto; }
.m-150{ margin: 15px 0; }
.m-300{ margin: 30px 0; }
.m-500{ margin: 50px 0; }
.mt0{ margin-top: 0px; }
.mt20{ margin-top: 2em; }
.mt30{ margin-top: 3em; }
.mt40{ margin-top: 4em; }
.mr20{ margin-right: 2em; }
.mb10{ margin-bottom: 1em; }
.s10{ margin: 1em; content: ''; }
.s20{ margin: 2em; content: ''; }
.s30{ margin: 3em; content: ''; }
.s40{ margin: 4em; content: ''; }
.s50{ margin: 5em; content: ''; }
.ml15{ margin-left: 15px; }
.mb10{margin-bottom: 1em;}
.mb20{margin-bottom: 2em;}
.mb30{margin-bottom: 3em;}
.lh09{line-height: 0.9;}
.lh11{line-height: 1.1;}
.lh12{line-height: 1.2;}
.line_b{border:solid 1px #555555;}
.line_b_img img{border:solid 1px #555555;}
.mw80{max-width: 80%;}
.db_block{display: block; }
.gap5{gap: 5em;}
/* モバイル版 */
@media screen and (max-width: 480px) {
.center_sp-left {
    text-align: left;
}
}
/*.table_facility td {background-color: rgb(109 150 156 / .5);}*/
.bc_tra{background-color: transparent;}
.bc_w{background-color: #FFFFFF;}
.bc_w_tra{background-color: rgb(255 255 255 / .8);}
.bc_g{background-color: #EEEEEE;}
.bc_lb{background-color: #CADEE3;}
.bc_b{background-color: #005F75;}
.bc_k{background-color: #555555;}
.bc_o{background-color:#CE703B;}
.red {color:#BF0909;}
.orange {color:#CE703B;}
.blue{color:#005F75;}
.white{color: #FFFFFF;}
.green{color:#00a095;}
.pink {color:#db657f;}
.purple{color:#7c4d71;}
.green{color:#00a095;}
.cha {color:#51494b;}
.black{color: #000000;}
.bold{font-weight: bold;}
.normal{font-weight: normal;}