@charset "utf-8";

/*----------------------------------------------------- */
/*　わたしたちのこと
/*----------------------------------------------------- */
article.lead {
    width: 100%;
    height: auto;
    min-height: 5rem;
    padding: .5rem calc(50% - 5.7rem) .5rem calc(50% - 5.7rem + 3.75rem);
    background: url("../images/overview/bg-about.png") center center no-repeat;
    background-size: cover;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    align-content: center;
}
main#primary article.lead>h2,
main#primary article.lead>p {
    width: auto;
    max-width: 8.25rem;
    color: #fff;
    letter-spacing: -.05em;
}
main#primary article.lead>h2 {
    margin-bottom: .4rem;
    font-size: 3.75em;
    font-weight: 700;
    line-height: 1.1em;
}
main#primary article.lead>h2 span {
    font-size: .567em;
    font-weight: 500;
    display: block;
}
article.lead>p {
    font-size: 1.5em;
    line-height: 1.75em;
}
table.orginfo {
    width: 100%;
    border-top: var(--color-border) .01rem solid;
    border-collapse: collapse;
}
table.orginfo th,
table.orginfo td {
    padding: .08rem 0 .12rem 0;
    border-bottom: var(--color-border) .01rem solid;
    line-height: 1.75em;
}
table.orginfo th {
    width: 15%;
    padding-left: .2rem;
    font-weight: 700;
}
table.orginfo td {
    padding-right: .2rem;
}
article#kyouchan {
    padding: .6rem 0;
    background: url("../images/overview/img-kyouchan.png") right .35rem center no-repeat, url("../images/overview/bg-kyouchan.png") center bottom no-repeat;
    background-size: auto, cover;
    position: relative;
}
article#kyouchan h2,
article#kyouchan p {
    margin: 0 auto;
}
article#kyouchan h2 {
    margin-bottom: .32rem;
    text-align: center;
 font-size: 1em;
}
article#kyouchan h2 span {
    font-size: 1.5em;
    font-weight: 500;
}
article#kyouchan h2 img {
    margin: .1rem auto 0;
    display: block;
}
article#kyouchan p {
    width: 5.1rem;
    line-height: 1.75em;
}
article#kyouchan a.to_official {
    width: 2.2rem;
    height: .52rem;
    background: #f19ec2;
    color: #fff;
    font-size: 1.125em;
    font-weight: 700;
    line-height: .52rem;
    text-align: center;
    display: block;
    position: absolute;
    right: 0;
    bottom: 0;
}
article#rofukukyo {
    padding: .6rem .8rem;
    background: #fff;
}
article#rofukukyo .symbol {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    gap: .32rem;
}
dl.access { 
    display: flex;
    flex-wrap: wrap;
}
dl.access dt,
dl.access dd {
    height: .48rem;
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}
dl.access dt:nth-of-type(1),
dl.access dt:nth-of-type(3){
    width: 25%;
    font-weight: 700;
}
dl.access dd:nth-of-type(1),
dl.access dd:nth-of-type(3) {
    width: 32%;
}
dl.access dt:nth-of-type(2),
dl.access dt:nth-of-type(4){
    width: 15%;
    font-weight: 700;
}
dl.access dd:nth-of-type(2),
dl.access dd:nth-of-type(4) {
    width: 28%;
}
@media screen and (max-width:768px) { /* スマホの場合 */
 main#primary article.lead>h2 {
    font-size: 2.2em;
  line-height: 1.3em;
  text-align: center;
}
 main#primary article.lead>h2 span {
    font-size: .567em;
  line-height: 1.1em;
  margin-top: 1em;
}
    article.lead {
        width: 100%;
        height: auto;
        padding: .4rem;
        background: url("../images/overview/bg-about.png") left bottom no-repeat;
        background-size: cover;
        display: block;
        position: relative;
    }
    article.lead::before {
        content: '';
        width: calc(100% - .4rem);
        height: calc(100% - .4rem);
        background: rgba(0,0,0,.4);
        position: absolute;
        top: .2rem;
        left: .2rem;
        display: block;
    }
    article.lead>h2,
    article.lead>p {
        position: relative;
    }
    article.lead>h2 {
        margin-bottom: .2rem;
        font-size: 1.5em;
        text-align: center;
    }
    article.lead>h2 span {
        font-size: .55em;
    }
    article.lead>p {
        font-size: 1.125em;
        line-height: 1.5em;
    }
    table.orginfo tr {
        display: flex;
        flex-wrap: wrap;
    }
    table.orginfo th,
    table.orginfo td {        
        width: 100%;
        padding-left: .2rem;
        padding-right: .2rem;
    }
    table.orginfo th {
        padding-bottom: 0;
        border: none;
    }
    table.orginfo td {
        padding-top: 0;
        line-height: 1.2em;
    }
    article#kyouchan {
        padding: .48rem .16rem 1.8rem;
        margin-bottom: .52rem;
        background: url("../images/overview/img-kyouchan.png") center bottom .2rem no-repeat, url("../images/overview/bg-kyouchan.png") center bottom no-repeat, #d5eff6;
        background-size: 1.225rem 1.485rem, 100% auto, cover;
    }
    article#kyouchan h2 span {
        font-size: 1.25em;
    }
    article#kyouchan h2 img {
        width: 80%;
        height: auto;
    }
    article#kyouchan p {
        width: 100%;
    }
    article#kyouchan a.to_official {
        width: 100%;
        height: .52rem;
        padding-right: 1em;
        text-align: right;
        bottom: -.52rem;
    }
    article#rofukukyo {
        padding: .4rem .2rem;
    }
    article#rofukukyo .symbol {
        flex-wrap: wrap;
        justify-content: center;
    }
    article#rofukukyo .symbol p {
        width: 100%;
    }
     dl.access { 
        display: block;
    }
    .innerBox section dl.access dt,
    .innerBox section dl.access dd {
        width: 100%;
     margin-bottom: 0;
    }
}


/*----------------------------------------------------- */
/*　労福協の理念と2030年ビジョン
/*----------------------------------------------------- */
main#primary .document2030 section {
 margin-top: 0.5rem;
 margin-bottom: 0.5rem;
}
@media screen and (max-width: 768px) {
 main#primary .document2030 section {
 margin-bottom: 50px;
}
}
.document2030 #tabmenu {
 display: flex;
 flex-wrap: wrap;
 /*align-items: center;*/
}
@media screen and (max-width: 768px) {
.document2030 #tabmenu {
 justify-content: space-between;
 gap: 0 5px;
}
}
.document2030 #tabmenu {

}
.document2030 #tabmenu a {
 /*display: block;*/
 font-size: 1.1em;
 background: #FFF;
 border: solid 1px #ccc;
 padding: 5px 40px;
 border-radius: 100vh;
 margin-right: 10px;
 line-height: 1.2;
 text-align: center;
}
.document2030 #tabmenu a br {
 display: none;
}
@media screen and (max-width: 768px) {
.document2030 #tabmenu a{
 display: flex;
 justify-content: center;
 align-items: center;
}
}
@media screen and (max-width: 768px) {
 .document2030 #tabmenu a {
  padding: 5px;
  margin: 0;
  width: calc((100% - 10px) / 3);
  border-radius: 20px;
 }
}
.document2030 #tabmenu a.current {
 background: var(--color-blue);
 border: solid 1px var(--color-blue);
 border-bottom: none;
 color: #FFF;
 font-weight: 700;
 position: relative;
}
.document2030 h2#r03 span{
 font-size: 0.55em;
 font-weight: 400;
}
@media screen and (max-width: 768px) {
.document2030 h2#r03 span{
 display: block;
}
}
main#primary .document2030 h3 {
margin-top:40px;
}
.document2030 h4{
margin-bottom:10px;
}
.document2030 h5{
font-weight:bold;
}
.document2030 .pdfbtn {
 text-align: right;
}
.document2030 .pdfbtn a{
 display: inline;
 padding: 5px 50px 5px 30px;
}
@media screen and (max-width: 768px) {
.document2030 .pdfbtn.center{
 text-align: center;
}
}
.document2030 section strong {
font-weight:bold;
}
.document2030 section{
margin-bottom:20px;
}

.document2030 section dl{
}

.document2030 section dd{
margin-left:2em;
margin-bottom:10px;
}
@media screen and (max-width: 768px) {
 .document2030 section dd{
 margin-left:0;
}
}

/*--ビジョン囲み--*/
.document2030 .box_vision.box_img{
margin-bottom: 60px;
 padding-bottom: 35px;
 position: relative;
}
.document2030 .box_vision.box_img .pdfbtn{
 top: auto;
 bottom: 10px;
 right: 20px;
}
.document2030 .box_vision.box_img .pdfbtn a{

}
.document2030 .box_vision.box_img img{
margin-bottom: 5px;
}
.document2030 .box_vision.box_img span{
     font-size: 0.85em
}
.document2030 .box_vision{
background: #E1EFF9;
padding:20px;
margin-bottom: 20px;
}
.document2030 .box_vision h4,.box_vision p{
font-weight: bold;
}
.document2030 .box_vision h4{
color:#3995D3;}

.document2030 .box_vision p{
font-size :90%;
color: #555555;
}

/*--box_visionに追記--*/
.document2030 .box_vision h4,.document2030 .box_vision h5,.document2030 .box_vision p,.document2030 .box_vision li{
font-weight: bold;
}

.document2030 .box_vision h4,.box_vision h5{
color:#3995D3;}

.document2030 box_vision p,.document2030 box_vision li{
font-size :90%;
color: #555555;
}

.document2030 .box_vision h5{
 margin: 0;
 margin-bottom: 10px;
}


.document2030 ol.ol_menu {
    list-style: decimal;
    margin-left: 3em;
}

/*--box_visionに追記ここまで--*/

/*--文字中央揃え--*/
.document2030 .txtCenter{
text-align: center;
}

/*--上破線--*/
.document2030 .topLine{
border-top:1px dotted #33B0E5;
margin: 10px 0;
}

/*--下破線--*/
.document2030 .bottomLine{
border-bottom:1px dotted #33B0E5 ;
margin: 10px 0;
}

.document2030 .bottomLine .note{
 text-align: center;
 font-size: 0.9em;
 margin-bottom: 20px;
 margin-top: -10px;
 color: #555;
}

.document2030 .bottomLine .pdfbtn{
 top: auto;
 bottom: 25px;
}
/*--ラベル風装飾--*/
.document2030 .label{
display: inline-block;
background:#D8F1F9;
padding: 8px;
margin:0px 10px 0px;
font-weight: bold;
}

/*--ケイ囲み--*/
.document2030 .box_frame{
border:1px solid #76B8D4;
padding: 10px;
}

/*--グレーの角R背景--*/
.document2030 .box_KadoRg{
background: #f4f4f2;
padding:20px;
margin-bottom: 20px;
 border-radius: 10px; 
-webkit-border-radius: 10px;
-moz-border-radius: 10px; 
}

/*--グレーの角R背景内でのテーブル--*/
.document2030.box_KadoRg table{
margin: 10px 0;
}

.document2030 .box_KadoRg tr {
}

.document2030 .box_KadoRg tr th{
text-align: left;
background: #E1EFF9;
border: 1px solid #aaaaaa;
padding: 8px;
}

.document2030 .box_KadoRg tr td{
background: #FCFCFC;
border: 1px solid #aaaaaa;
padding: 8px;
}

/*h2の設定*/
/*.document2030 .h2_rinen,
.document2030 .h2_shakaizo,
.document2030 .h2_vision{
font-weight: bold;
padding-bottom: 4px;
border-bottom: 8px solid #DDF0F8;
border-width: 20%;
margin: 0 auto 30px;
}*/



/*労福協の理念の設定*/
.document2030 .box_rinen{
padding: 40px 40px 20px;
color: #FFFFFF;
background: url("/images/about/bg_rinen.png") top center;
text-shadow:0px 0px 8px #07689e;
margin-bottom: 0px;/*追加*/
margin: 0 50px;
}
@media screen and (max-width: 768px) {
 .document2030 .box_rinen{
  padding: 20px;
  margin: 0;
 }
}
main#primary .document2030 .box_rinen h3{
margin:0;
padding: 0;
font-size: 2em;/*サイズ変更*/
text-align:center;
line-height: 140%;
  border: none;
}
@media screen and (max-width: 768px) {
main#primary .document2030 .box_rinen h3{
  font-size: 1.4em;
 }
}
main#primary .document2030 .box_rinen h3 span{
font-weight: bold;
display: inline-block;
}

.document2030 .box_rinen p{
background-color:rgba(64,162,211,0.7);
margin: 20px auto 20px;
width: 89%;   /*サイズ変更*/
padding: 10px 20px;
line-height: 140%;
text-align:justify;
}

.document2030 .txt_right{
text-align: right;
margin-top: 10px;
color: #555555; 
}


/*2030年にめざす社会像の設定*/
.document2030 .box_shakaizo{
margin-bottom: 120px;
padding: 30px 40px 30px ;
color: #FFFFFF;
background: url("/images/about/bg_shakaizo_g.png") center bottom;
/*text-shadow:0px 0px 8px #4c7671;*/
text-shadow:0px 0px 8px #046304;
margin: 0 50px;
}
@media screen and (max-width: 768px) {
 .document2030 .box_shakaizo{
  padding: 20px;
  margin: 0;
 }
}
.document2030 .box_shakaizo p{
line-height: 130%;
text-align:justify;
font-size: 115%;
background:  #54B945;
display: inline-block;
padding: 3px 10px;
font-weight: bold;
}

.document2030 .box_shakaizo .slogan{
background: none;
    margin: 0 0 20px 0;
    padding: 0;
    font-size: 2em;
    text-align: justify;
    line-height: 140%;
    border: none;
}
@media screen and (max-width: 768px) {
 .document2030 .box_shakaizo .slogan{
 font-size: 1.4em;
}
}
.document2030 .box_shakaizo .slogan span{
font-weight: bold;
display: inline-block;
}

.mb120{
margin-bottom:120px;
}

/*----------------------------------------------------- */
/*　役員一覧
/*----------------------------------------------------- */
.page-slug-officer {
 
}
.page-slug-officer .hedding{
 display: flex;
 flex-wrap: wrap;
 border-bottom: solid 2px #444;
}
@media screen and (max-width: 768px) {
 /*.page-slug-officer .hedding{
  display: none;
 }*/
}
.page-slug-officer .officer{
 display: flex;
 flex-wrap: wrap;
 border-bottom: solid 1px #CCC;
}
.page-slug-officer .hedding div{
 font-weight: 500;
 font-size: 1.1em;
}
.page-slug-officer .hedding div,
.page-slug-officer .officer div{
 padding: 14px 10px;
}
@media screen and (max-width: 768px) {
.page-slug-officer .hedding div,
.page-slug-officer .officer div{
 padding: 10px 0;
 text-align: left;
}
}
.page-slug-officer .position{
 width: 20%;
}
.page-slug-officer .name{
width: 20%;
}
.page-slug-officer .organization{
width: 60%;
}
@media screen and (max-width: 768px) {
 .page-slug-officer .position{
 width: 25%;
}
.page-slug-officer .name{
width: 35%;
}
.page-slug-officer .organization{
width: 40%;
}
}
@media screen and (max-width: 768px) {
/*.page-slug-officer .position,
.page-slug-officer .name,
.page-slug-officer .organization{
 width: 100%;
 display: flex;
}*/
 
/*.page-slug-officer .position::before{
 content: "役職";
 display: block;
 width: 40%;
}
.page-slug-officer .name::before{
 content: "名前";
 display: block;
 width: 40%;
}
.page-slug-officer .organization::before{
 content: "団体（役職）";
 display: block;
 width: 40%;
}*/
 
 
}

/*----------------------------------------------------- */
/*　加盟団体一覧
/*----------------------------------------------------- */
.page-slug-member {
 
}
.page-slug-member ul.tabmenu{
 display: flex;
 flex-wrap: wrap;
 justify-content: center;
 margin-bottom: 0.4rem;
}
@media screen and (max-width: 768px) {
 .page-slug-member ul.tabmenu span.area_block{
  display: none;
 }
}
.page-slug-member ul.tabmenu li{
 padding: 10px;
 font-size: 0.9em;
 font-weight: 300;
}
.page-slug-member ul.tabmenu li br{
 display: none;
}
.page-slug-member ul.tabmenu li::after{
 content: "|";
 padding-left: 20px;
}
.page-slug-member ul.tabmenu li:last-child::after{
 content: "";
}
.page-slug-member ul.tabmenu li span.arrow {
  position: relative;
  display: inline-block;
  width: 13.7px;
  height: 7.4px;
 margin-left: 10px;
}
.page-slug-member ul.tabmenu li span.arrow::before,
.page-slug-member ul.tabmenu li span.arrow::after {
  content: "";
  position: absolute;
  bottom: 1px;
  left: calc(50% - 0.5px);
  width: 2px;
  height: 10px;
  border-radius: 9999px;
  background-color: var(--color-blue);
  transform-origin: 50% calc(100% - 0.5px);
}
.page-slug-member ul.tabmenu li span.arrow::before {
  transform: rotate(45deg);
}
.page-slug-member ul.tabmenu li span.arrow::after {
  transform: rotate(-45deg);
}

@media screen and (max-width: 768px) {
 .page-slug-member ul.tabmenu{
  align-items: center;
  justify-content: left;
 }
.page-slug-member ul.tabmenu li{
 width: 33%;
 font-size: 1.15em;
 text-align: center;
 padding: 0;
 position: relative;
}
.page-slug-member ul.tabmenu li br{
 display: block;
}
.page-slug-member ul.tabmenu li a{
 }
.page-slug-member ul.tabmenu li::after{
 content: none;
 padding: 0;
}
.page-slug-member ul.tabmenu li span.arrow {
  position: absolute;
 top:50%;
 right: 0;
}
}
.page-slug-member section div > dl{
 padding-top:30px;
 padding-bottom:30px;
 border-bottom: solid 1px #CCC;
}
.page-slug-member section div > dl > dt{
 margin-bottom: 10px;
 background: #f9f8f3;
 padding: 10px;
 border-radius: 5px;
 font-size: 1em;
}
.page-slug-member dl dd{
 position: relative;
}
.page-slug-member dl dd .url{
 position: absolute;
 top: 0.1rem;
 /*bottom: 50%;*/
 right: 0.05rem;
}
@media screen and (max-width: 768px) {
 .page-slug-member dl dd .url{
  position: static;
  width: 100%;
  margin: 0.2rem auto 0;
 }
}
.page-slug-member dl dd .url a{
 /*border: solid 2px #CCC;*/
 background: var(--color-blue);
 padding: 0.05rem 0.4rem;
 color: #FFF;
 /*letter-spacing: 0.5em;*/
 text-indent: 0.5em;
 display: inline-block;
 text-align: center;
}
.page-slug-member dl dd .url a::after{
content: '\f08e';
font-family: 'Font Awesome 6 Free';
font-weight: 600;
padding: 0 7px 0 0;
 margin-left: 10px;
 color: #FFF;
}

@media screen and (max-width: 768px) {
 .page-slug-member dl dd .url a{
  padding: 0.1rem 0.4rem;
  width: 100%;
 }
}
.page-slug-member dl dd > dl{
 display: flex;
 flex-wrap: wrap;
 margin-left: 0.05rem;
}
@media screen and (max-width: 768px) {
 .page-slug-member dl dd > dl{
  display: block;
 }
}
.page-slug-member dl dd > dl dt{
 color: #848282;
 width: 7%;
 margin-bottom: 0;
 font-weight: 500;
 font-size: 1em;
}
.page-slug-member dl dd > dl dd{
 width: 93%;
}
@media screen and (max-width: 768px) {
 .page-slug-member dl dd > dl dt,
 .page-slug-member dl dd > dl dd{
  width: 100%;
 }
}
/*----------------------------------------------------- */
/*　活動方針
/*----------------------------------------------------- */
.page-slug-activity_policy .activitypolicy{
 
}
main#primary.page-slug-activity_policy section,
main#primary.page-slug-activity_policy_reinforcement section{
 margin-top: 0.5rem;
 margin-bottom: 0.5rem;
}
.page-slug-activity_policy .activitypolicy li{
 line-height: 2.125em;
}
.page-slug-activity_policy .pdfbtn,
.page-slug-activity_policy_reinforcement .pdfbtn{
 text-align: right;
}
.page-slug-activity_policy .pdfbtn a,
.page-slug-activity_policy_reinforcement .pdfbtn a{
    display: inline;
    padding: 5px 50px 5px 30px;
}
.page-slug-activity_policy .activitypolicy section dl{
 /*margin-bottom: 1em;*/
}
.page-slug-activity_policy .activitypolicy section dl dd{
 margin-left: 1.5em;
 margin-bottom: 1em;
}
.page-slug-activity_policy .activitypolicy .box_vision {
 background: #E1EFF9;
 padding: 20px;
 margin-bottom: 20px;
}
.page-slug-activity_policy .activitypolicy .box_vision h4 {
 margin: 0;
}
.page-slug-activity_policy div.wrapperS:last-of-type,
.page-slug-activity_policy_reinforcement div.wrapperS:last-of-type{
 margin-top: 1rem;
 background: url(../images/bg-sectiontop.png) center top no-repeat, #fff !important;
}

.page-slug-activity_policy .li_parentheses_1em li {/*①（まる数字）用*/
 padding-left: 1.3em;
 text-indent: -1.3em;
}
.page-slug-activity_policy .li_parentheses_2em li {
 padding-left: 2.0em;
 text-indent: -2.0em;
}

.page-slug-activity_policy .li_parentheses_3em li {/*（）用*/
 padding-left: 3.0em;
 text-indent: -3.0em;
}

div.wrapperS .activitypolicy-link{
 display: flex;
 flex-wrap: wrap;
 justify-content: space-between;
}
div.wrapperS .activitypolicy-link div{
 width: 46%;
 border-bottom: solid 1px #CCC;
}
div.wrapperS .activitypolicy-link a[href$=".pdf"]{
 background: url(../images/icon-pdf.png) left top no-repeat;
 padding: .1rem .1rem .1rem .45rem;
 display: block;
 background-position: 0 .15rem;
}

/* タブメニュー */
.page-slug-activity_policy #tabmenu,
.page-slug-activity_policy_reinforcement #tabmenu{
 display: flex;
 flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
.page-slug-activity_policy #tabmenu,
.page-slug-activity_policy_reinforcement #tabmenu{
 margin-bottom: 20px;
 justify-content: space-between;
 }
}
.page-slug-activity_policy #tabmenu a,
.page-slug-activity_policy_reinforcement #tabmenu a{
 display: block;
 font-size: 1.1em;
 background: #FFF;
 border: solid 1px #ccc;
 padding: 5px 40px;
 border-radius: 100vh;
}
@media screen and (max-width: 768px) {
 .page-slug-activity_policy #tabmenu a,
.page-slug-activity_policy_reinforcement #tabmenu a{
 padding: 5px 30px;
 font-size: 1em;
 }
}
.page-slug-activity_policy #tabmenu a:nth-of-type(1),
.page-slug-activity_policy_reinforcement #tabmenu a:nth-of-type(1){
 margin-right: 10px;
}
@media screen and (max-width: 768px) {
.page-slug-activity_policy #tabmenu a:nth-of-type(1),
.page-slug-activity_policy_reinforcement #tabmenu a:nth-of-type(1){
 margin-right: 5px;
}
}
.page-slug-activity_policy #tabmenu a.current,
.page-slug-activity_policy_reinforcement #tabmenu a.current{
 background: var(--color-blue);
 border: solid 1px var(--color-blue);
 border-bottom: none;
 color: #FFF;
 font-weight: 700;
 position: relative;
 
}
/*----------------------------------------------------- */
/*　労福協のあゆみ
/*----------------------------------------------------- */
main#primary.page-slug-history section {
 margin-top: 0.5rem;
 margin-bottom: 0.5rem;
}