@charset "UTF-8";
/*
    Template: swell
    Theme Name: RIGHTARMS 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
*/

/* 画面サイズによって限定br */
/* スクリーンサイズが767px以下の場合に適用(スマホ用) */
@media screen and (max-width: 767px) {
    .pc-only { display:none; }
    .sp-only { display:inline; }
}
/* スクリーンサイズが767px以上の場合に適用(デスクトップ用) */
@media screen and (min-width: 767px){   
    .pc-only { display:inline; }
    .sp-only { display:none; }
  }
    

/* グローバルナビ */
.c-gnav > .menu-item > a .ttl{
    font-size: 16px;
    font-weight: bold;
    letter-spacing: 0.08em;
}

/************************************************/
/* dlテーブル */
/* dlを使用したテーブル */
/************************************************/

.c-dltable,
.c-dltable > dt,
.c-dltable > dd {
    box-sizing: border-box;
}

.c-dltable > dt,
.c-dltable > dd {
    padding: 1em;
    margin: 0px 0px 0px 0px;
}

.c-dltable > dt {
    background-color: #F7F7F7;
    color: #333333;
}

.c-dltable > dd {
    background-color: #FFFFFF;
}

dl.c-dltable > dd > ul{
    margin-bottom: 0px;
}

@media screen and (max-width: 767px) {
    .c-dltable > dt {
        border: 1px solid #DBDBDB;
        border-bottom: none;
    }
    .c-dltable > dd {
        border: 1px solid #DBDBDB;
        border-top: none;
    }
    .c-dltable > dt,
    .c-dltable > dd {
        text-align: center;
    }
    .c-dltable > dd > ul {
        text-align: left;
    }
}
@media print, (min-width: 768px) {
    .c-dltable {
        display: flex;
        flex-wrap: wrap;
        border-bottom: 1px solid #DBDBDB;
    }
    .c-dltable > dt,
    .c-dltable > dd {
        display: flex;
        flex-direction: column;
        justify-content: center;
        border-top: 1px solid #DBDBDB;
    }
    .c-dltable > dt {
        width: 20%;
    }
    .c-dltable > dd {
        width: 80%;
        border-right: 1px solid #FFFFFF;
    }
}

.c-dltable-form{
    margin-bottom: 30px;
}



/************************************************/
/* 問い合わせフォームのカスタマイズ */
/************************************************/

/*ラベル(テキスト)部分を太字にする*/
.wpcf7{
	font-weight: bold;
}

/*フォームの下に余白を入れる*/
.wpcf7 input {
 margin-bottom: 15px;/*ここが余白サイズなので好みで調整*/
}

/*フォームの幅を広くする(100%)*/
/*テキスト*/
.wpcf7-form-control.wpcf7-text.wpcf7-validates-as-required {
        width: 100%;
}
/*テキストエリア*/
.wpcf7-textarea {
        width: 100%;
}

.wpcf7 input{
    width: 100%; 
}

.c-dltable-form input{
    width: auto;
}

/* 問い合わせフォーム必須 */
.haveto{
    font-size:10px;
    padding:5px;
    background:#E03523;
    color:#fff;
    border-radius:2px;
    margin-right:5px;
    position:relative;
    bottom:1px;
}

/*送信ボタンを目立たせる*/
.submit_button_box{
    width: 100%;
    margin: 20px auto 25px auto;
    text-align: center;
}
.wpcf7 .wpcf7-submit{
    width: 50%;
    padding: 10px;
    margin: 20px auto 25px auto;
    border-radius: 5px;/*ボタンの角に丸み*/
    background-color: #2282B7;/*ボタン色*/
    color: #fff;/*ボタン文字色*/
    font-size: 1.1rem;/*ボタン文字サイズ*/
    font-weight: bold;/*ボタン文字を太く*/
}

div.wpcf7 .wpcf7-spinner {
    display: block;
}

.form-type-text input{
    width: 100%;
}
/************************************************/
/* footer */
/************************************************/

.footer-address{
    font-size: 1.0em;
    margin-bottom: 0.25em;

}

.footer-tel{
    font-size: 1.5em;
    font-weight: bold;
    letter-spacing: 0.015em;

}


ul.footer-link-list {
    position: relative;
    list-style-type: none;
    padding: 1rem 1rem 1rem 2rem;
    column-count: 3;
    font-weight: 700;
}

ul.footer-link-list a {
    color: #333333;
}

ul.footer-link-list a:hover {
    color: #1558A7;
}



@media screen and (max-width: 768px) {
    ul.footer-link-list {
        font-size: 0.85em;
        padding: 0;
    }

    ul.footer-link-list {
        column-count: 2;
    }
}

ul.footer-link-list li {
    padding: 0.25em 2em;
    line-height: 130%;
}

ul.footer-link-list li::before {
    position: absolute;
    left: 1rem;
    padding-left: 0.2em;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: '\f105';
}

.w-beforeFooter {
    margin: 3em auto 0.5em;
}

.footer-parts-tel-box{
    width: 800px;
    margin: 0px auto 20px auto;
}

/* ボタンサイズ調整 */
.btn_footerparts{
    --the-padding :0.5em 1.0em !important;
}

.btn_footerparts_mitsumori span::before{
    position: relative;
    left:-0.5em;
    padding-left: 0.2em;
    font-family: "Font Awesome 5 Free";
    font-size: 1.25em;
    font-weight: 900;
    content: '\f15c';
}
.btn_footerparts_inquiry span::before{
    position: relative;
    left:-0.5em;
    padding-left: 0.2em;
    font-family: "Font Awesome 5 Free";
    font-size: 1.25em;
    font-weight: 900;
    content: '\f0e0';
}


/* 投稿リストブロックのカード型とサムネイル型を4列表示にする */
@media (min-width: 960px) {
    .-col4 .-type-card.-pc-col3 .p-postList__item, .-col4 .-type-thumb.-pc-col3 .p-postList__item{
      width: calc(100% / 4);
    }
  }

/************************************************/
/* 施工事例 WORKSページ */
/************************************************/
.workstax-list li{
    list-style: none;
    margin: 0;
}

@media screen and (max-width: 768px) {
    .workstax-list li{
        font-size: 0.75em;
    }
}

.workstax-list a{
    border: #2282B7 solid 1px;
    border-radius: 3px;
    background-color: #DEF;
    line-height: 200%;
    padding: 5px 15px;
}

.workstax-list a:hover{
    color: #6DA5DC;
    background-color: #EEF9FF;
}

.works_tax_list{
    display: inline;
    margin-right: 15px !important;
}


.tab_works_extract{
    background-color: #F1F3F8;
    padding: 0px 0px 30px 0px;
    border: 1px solid #CCC;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
  }

  .tab_works_extract  > .c-tabList li.c-tabList__item {
    padding: 0 0px;
  }



@media screen and (max-width: 768px) {
  .works_tmb .-type-thumb .p-postList__body {
    font-size: 0.5em;
    font-weight: normal;
    height: 20%;
  }
}

/************************************************/
/* FAQ */
/************************************************/


  .dl_faq{
    border-bottom: 1px dotted #CCCCCC;
  }

  [data-a="col-main"] .faq_a::before, [data-q="col-main"] .faq_q::before {
    color: #E03523;
  }


/************************************************/
/* トップページ */
/************************************************/
.companypoint{
    position: relative;
    border-radius: 5px;
}

@media screen and (max-width: 768px) {
    .wp-block-column.companypoint {
        margin-bottom: 30px !important;
    }
}

.companypoint_icon_handsign{
    border: 5px solid #FFF;
    border-radius: 100%;
    position: absolute;
    top: -30px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    
}

.companypoint_icon_handsign img{
    width: auto;
    height: 100px;
}

.signboard_type_list{
    column-count: 4;
    counter-reset: count 0;
}


.signboard_type_list li:before{
    content: counter(count) ;
    counter-increment: count 1;
    background-color: var(--color_list_num);

    border-radius: 50%;
    box-shadow: 0 0 0 1px var(--color_list_num);
    box-sizing: content-box;
    color: #fff;
    display: block;
    width: 1.8em;
    left: 1px;
    line-height: 1.8;
    padding: 5px;
    position: absolute;
    text-align: center;
    top: 0;
    -webkit-transform: scale(.75);
    transform: scale(.75);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    
}

.signboard_type_list li{
    padding-left: 35px;
    padding-top: 8px;
    list-style: none;
    margin: 0 0 0.25em 0;
}

/* 画面サイズによって限定br */
/* スクリーンサイズが767px以下の場合に適用(スマホ用) */
@media screen and (max-width: 767px) {
    .signboard_type_list{
        column-count: 1;
    }

    .signboard_type_list li a{
        padding-left: 10px;
    }
    
}

 /**************************************
 * スライダー
 **************************************/

 .works_swiper {
    /* wrapperのサイズを調整 */
    width: 100%;
    background:rgba(0, 0, 0, 0.0)
  }
  
  .works_swiper img{
    max-height: 600px;
    text-align: center;
  }
  
  .swiper-slide {
    /* スライドのサイズを調整、中身のテキスト配置調整、背景色 */
    color: #ffffff;
    width: 100%;
    text-align: center;
  }

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

.c-dltable ul {
    padding-left: 0px;
  }

.top_catchcopy p{
    line-height: 200%;
    font-size: 1.2rem;
    text-shadow: 1px 2px 3px #808080;
    margin-bottom: 0.1em;
}

/* スクリーンサイズが767px以下の場合に適用(スマホ用) */
@media screen and (max-width: 767px) {
    .top_catchcopy p{
        line-height: 160%;
        font-size: 1.0rem;
        text-shadow: 1px 2px 3px #808080;
        margin-bottom: 0.75em;
    }
    
}