@charset "utf-8";

/* メイン
----------------------- */
#main .mainVisual {
    position: relative;
    margin-bottom: -4%;
}

.entrylink{width:45%;margin:8% auto 0;}
.entrylink a{display:block;width:100%;padding:5.0% 11% 4.6% 9%;text-align:center;background:#3898C6 url(../img/btn_icon.png) no-repeat;background-size:4.8% auto;background-position:center right 4.8%;box-sizing:border-box; font-size:20px;color:#FFF;font-weight:bold;}
.entrylink a:hover{ transition: opacity .4s; opacity: .8;}
.entrylink img{display:inline-block;width:72%;max-width:374px;height:auto;}
.entrylink a:hover img{opacity:1;}

@media screen and (max-width: 1200px){
  /* section1 */
  #section1 .sectionInnner .text{font-size:2.19vw;}
  #section1 .sectionInnner .text2{font-size:1.99vw;}
  #sec1-table{width:99%;/*margin:0 auto;*/}
  #sec1-table th, #sec1-table td{ font-size: 1.99vw;}
  .entrylink{ width:65%;}
  .entrylink a{ font-size: 2.4vw;}
}

@media screen and (max-width: 750px){
  /* section1 */
  #section1 .sectionInnner:after{padding-top:8.451%;}
  #section1 .sectionTitle{margin-bottom:5.463%;}
  #section1 .sectionTitle img{display:none;}
  #section1 .sectionTitle:after{content:'';display:block;width:100%;padding-top:8.451%;background:url(../img/sp/lifeworkHead1.png) no-repeat center;background-size:100%;}
  #section1 .sectionInnner #sec1-image{width:84.5%;max-width:600px;}
  #section1 .sectionInnner .text{margin-bottom:8.451%;font-size:3.4vw;}
  #section1 .sectionInnner .text2{font-size:3.2vw;}
  #sec1-table{width:100%;/*overflow-x:scroll;*/}
  #sec1-table th, #sec1-table td{ font-size: 3.2vw;}
  .entrylink a:hover{opacity:1;}
}



.section .links li {
    min-width: auto;
}

#main p {
    font-size: 15px;
    color: #221815;
}

h5 {
    display: inline-block;
    margin-top: 4em;
    padding: 0.5em 1.8em;
    font-size: 18px;
    line-height: 1.0;
    color: #3898c6;
    border: 1px solid #3898c6;
}

.textImg {
    margin: 4% auto;
}

.textImg li {
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
}

.textImg li + li {
    margin-top: 3.2%;
}

.textImg li .box {
    width: 100%;
}

.textImg li .box h6 {
    font-size: 18px;
    margin-bottom: 0.8em;
}

.textImg li .img {
    flex-shrink: 0;
    margin-left: 11%;
}

.law {
    width: 100%;
    max-width: 800px;
    margin: 5% auto 0;
}

.law h5{
    display: block;
    margin: 0;
    color: #fff;
    background: #3898c6;
    text-align: center;
}

.law p {
    margin-top: 1em;
}

#main p.note {
    color: #3898c6;
    font-weight: bold;
    text-align: center;
}

.table {
    margin-top: 6%;
}

.table li {
    padding-bottom: 4%;
}

.cols {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: wrap;
}

.cols > h5 {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 25%;
    margin: 0;
    padding: 1em;
    background: #9bcbe2;
    border: none;
    text-align: center;
    color: #fff;
    line-height: 1.5em;
    font-size: 15px;
}

.cols > p,
.cols > div {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 74.5%;
    margin-left: 0.5%;
    padding: 1em;
    background: #d7eaf4;
    font-weight: bold;
}

.cols > p span.red {
    color: #b81c22;
}

.cols > div {
    align-items: flex-start;
    flex-direction: column;
    width: 100%;
    margin: 0.5% 0 0 0;
}

#main .cols > div h6,
#main .cols > div p {
    width: 100%;
    font-size: 12px;
}

#main .cols > div p + h6 {
    margin-top: 1em;
}

.systemDetail {
    margin: 6% auto;
}

.systemDetail li + li {
    margin-top: 2%;
}

.systemDetail h4 {
    display: flex;
    justify-content: space-between;
    font-size: 18px;
    line-height: 1.8;
}

.systemDetail h4 span {
    font-size: 0.833em;
    padding-right: 1em;
}

table.info {
    width: 100%;
}

.systemDetail table:nth-of-type(2) {
    display: none;
}

table.info th:first-child {
    width: 18%;
}

table.info th:nth-child(n+2) {
    width: 13.5%;
}

table.info th,
table.info td {
    text-align: center;
    vertical-align: middle;
    font-size: 15px;
    padding: 0.5em 0;
    border: 2px solid #fff;
}

table.info th {
    background: #9bcbe2;
    color: #fff;
    font-weight: bold;
}

table.info td {
    background: #ebf4f9;
}

table.info td a{
	text-decoration:none;
}
table.info td a:hover{
	text-decoration:underline;
}

.methods {
    margin-top: 6%;
}

.methods > li {
    padding-bottom: 6%;
}

.methods h4 {
    font-size: 18px;
    line-height: 1.8;
}

.methods > li ul.imgs {
    display: flex;
    justify-content: space-around;
    align-items: flex-start;
    margin-top: 4%;
}

.methods > li ul.imgs.two {
    padding: 0 10%;
}

table.two {
    max-width: 700px;
    margin: 10% auto;
}

table.two th,
table.two td {
    width: 50%;
    text-align: left;
    padding: 0.5em 1em;
}
table.two td a {text-decoration: underline;}
table.two td a:hover {text-decoration: none;}

.section .anchors {
    justify-content: center;
}

.section .anchors.large.center li a {
    justify-content: center;
    font-size: 17px;
    font-weight: bold;
}

.section .anchors.large.center.icon li a::before {
    position: static;
    width: 1.5em;
    height: 1em;
    margin: 0 1em 0 0;
    order: 0;
    background: url('/special/member_sa/img/icon_download.png') center center no-repeat;
    background-size: contain;
    transform: none;
}
.section .anchors.large.center.icon li a::after {
    display: none;
}


@media screen and (max-width: 750px){
    #main .mainVisual {
        margin: 0;
    }
    .kokoro img {
        height: auto;
    }
    #main p {
        font-size: 3.2vw;
        line-height: 2;
    }
    h5 {
        font-size: 3.5vw;
    }
    .textImg li {
        flex-direction: column-reverse;
    }
    .textImg li .img {
        margin: 0;
    }
    .textImg li .img img {
        margin: 0 auto;
    }
    .textImg li .box {
        margin-top: 6%;
    }
    .textImg li .box h6 {
        font-size: 3.2vw;
    }
    .textImg li + li {
        margin-top: 10%;
    }
    .textImg.pnc li {
        flex-direction: column;
    }
    .textImg.pnc li .box {
        margin: 0 0 6%;
    }
    .cols > h5 {
        width: 37%;
        font-size: 2.93vw;
    }
    #main .cols > p,
    #main .cols > div {
        width: 62.5%;
        font-size: 2.93vw;
    }
    #main .cols > div {
        width: 100%;
    }
    #main .cols > div h6,
    #main .cols > div p {
        font-size: 2.93vw;
    }
    .systemDetail h4 {
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        font-size: 2.93vw;
    }
    .systemDetail h4 span {
        margin-left: auto;
    }
    table.info th, table.info td {
        font-size: 2.6vw;
    }
    .systemDetail table:nth-of-type(2) {
        display: table;
    }
    .systemDetail table th,
    .systemDetail table td {
        width: 25%;
    }
    .systemDetail table:first-of-type th:nth-child(n+5),
    .systemDetail table:first-of-type td:nth-child(n+5) {
        display: none;
    }
    .systemDetail table:nth-of-type(2) th:nth-child(-n+4),
    .systemDetail table:nth-of-type(2) td:nth-child(-n+4) {
        display: none;
    }
    .systemDetail table:nth-of-type(2) tr::after {
        content: "";
        display: table-cell;
        width: 25%;
    }
    .methods h4 {
        font-size: 3.2vw;
    }
    .methods > li ul.imgs {
        justify-content: flex-start;
        flex-wrap: wrap;
        margin: 0;
    }
    .methods > li ul.imgs li {
        width: 41.6%;
        margin: 3.2% 4.2%;
    }
    .methods > li ul.imgs.two {
        padding: 0;
    }
    .section .anchors.large.center li a {
        align-items: center;
        width: 100%;
        max-width: 400px;
        height: auto;
        margin: 0 auto;
        padding: 1em 0;
        font-size: 2.6vw;
    }
}
/* #main
----------------------- */
#main a {
  color: #3898c6;
}
#main a[href^="tel:"] {
  color: initial;
  pointer-events: none;
  cursor: default;
  text-decoration: none;
}
@media (max-width: 750px) {
  #main a[href^="tel:"] {
    pointer-events: none;
    cursor: initial;
    text-decoration: none;
  }
}

/* #main lead
----------------------- */
#main .mainVisual + .lead {
  line-height: 1.8;
  font-size: 15px;
  margin-top: 48px;
}
@media (max-width: 1000px) {
  #main .mainVisual + .lead {
    font-size: 1.5vw;
    margin-top: 4.8vw;
  }
}
@media (max-width: 750px) {
  #main .mainVisual + .lead {
    font-size: 3.2vw;
    margin-top: 6.4vw;
  }
}

/* #main list
----------------------- */
#main .list {
  margin-top: 48px;
}
@media (max-width: 1000px) {
  #main .list {
    margin-top: 4.8vw;
  }
}
@media (max-width: 750px) {
  #main .list {
    margin-top: 4.267vw;
  }
}

/* #main item [general]
----------------------- */
#main .list .item .wrap .col {
  font-size: 15px;
  padding: 0.75em 1em;
  border: 1px solid #d2d2d2;
  flex-shrink: 0;
  flex-grow: 0;
  white-space: pre-line;
}
#main .list .item .name {
  width: 27%;
}
#main .list .item .address {
  width: 40%;
}
#main .list .item .tel {
  width: 16%;
}
#main .list .item .sector {
  width: 17%;
}
@media (max-width: 1000px) {
  #main .list .item .col {
    font-size: 1.5vw;
  }
}
@media (max-width: 750px) {
  #main .list .item .col {
    border: initial;
  }
}

/* #main item [listHead]
----------------------- */
#main .list .listHead .item .wrap {
  width: 100%;
  display: flex;
  justify-content: center;
}
#main .list .listHead .item .wrap .col {
  text-align: center;
  font-weight: bold;
  color: #454545;
  background: #f6f6f6;
}
#main .list .listHead .item .wrap .col + .col {
  border-left: 0;
}

/* #main item [listBody]
----------------------- */
#main .list .listBody .item {
  width: 100%;
  display: flex;
  justify-content: center;
}
#main .list .listBody .item .wrap {
  display: flex;
}
#main .list .listBody .item .wrap .col:not(:first-child) {
  width: 100%;
  display: flex;
  align-items: center;
  border-top: none;
}
#main .list .listBody .item .wrap + .wrap .col:not(:first-child) {
  border-left: none;
}
@media (max-width: 750px) {
  #main .list .listBody .item {
    flex-direction: column;
  }
  #main .list .listBody .item + .item {
    margin-top: 4vw;
  }
  #main .list .listBody .item .wrap {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    border: 1px solid #d2d2d2;
  }
  #main .list .listBody .item .wrap + .wrap {
    border-top: none;
  }
  #main .list .listBody .item .wrap .col {
    font-size: 3.2vw;
    display: flex;
    align-items: center;
    border: initial;
  }
  #main .list .listBody .item .wrap .col:nth-child(1) {
    width: 20.133vw;
    padding: 1em;
    font-weight: bold;
    color: #454545;
    background: #f6f6f6;
    border-right: 1px solid #d2d2d2;
    justify-content: center;
  }
  #main .list .listBody .item .wrap .col:nth-child(2) {
    padding: 1em 1.5em;
    width: calc(100% - 20.133vw);
  }
}