* {
    padding: 0;
    margin: 0;
}

body {
    color: #3b3b3b;
    font-weight: normal;
    font-family: -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Helvetica Neue", HelveticaNeue, YuGothic, "Yu Gothic Medium", "Yu Gothic", Verdana, Meiryo, sans-serif;
    line-height: 1.6;
    letter-spacing: normal;
}

a {
    color: #3b3b3b;
    text-decoration: none;
}

p {
    color: #525252;
}

dd {
    color: #525252;
}

ul {
    list-style: none;
}

.sp_only {
    display: none;
}

.clearfix::after {
    content: "";
    display: block;
    height: 0;
    clear: both;
}

.common-Container {
    margin-bottom: 10%;
}

.content-Wrapper {
    max-width: 1024px;
    padding: 0 20px;
    margin: 0 auto;
}

.content-Title {
    font-size: 20px;
    text-align: center;
    line-height: 1.4;
    color: #ffffff;
    background-color: #721b1f;
    padding: 10px 0;
    margin-bottom: 8%;
}

.content-Title span {
    display: block;
    font-size: 32px;
}

.point-Title {
    text-align: center;
    position: relative;
}

.point-Title span {
    display: inline-block;
    font-size: 32px;
    margin-bottom: 8%;
    border-bottom: 1px solid #525252;
    position: relative;
}

.point-Title span::before {
    content: "";
    width: 48px;
    height: 4px;
    background-color: #721b1f;
    position: absolute;
    left: 0;
    bottom: -4px;
}

.imgBox {
    font-size: 0;
}
.scroll_button a{
    position: fixed;
    display: block;
    right:12px;
    bottom:12px;
    background: #928b8bb3;
    color:#fff;
    padding:20px;
}
@media screen and (max-width: 767px){

    .pc_only {
        display: none;
    }

    .sp_only {
        display: block;
    }

    .common-Container {
        margin-bottom: 20%;
    }

    .content-Title {
        margin-bottom: 16%;
    }

    .content-Title span {
        font-size: 26px;
    }

    .point-Title span {
        font-size: 22px;
        margin-bottom: 12%;
    }

}


/*===== header =====*/

.st_Header {
    width: 100%;
    padding-bottom: 15px;
    background-color: rgba(255, 255, 255, 0.7);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
}

.st_Header .captxt {
    font-size: 14px;
    padding: 15px 0;
}

.st_Header .logo {
    max-width: 240px;
    font-size: 0;
    float: left;
    margin-top: 12px;
}

.st_Header .logo img {
    width: 100%;
}

.st_Header .cvbtn {
    float: right;
}

.st_Header .cvbtn .dial {
    float: left;
    line-height: 60px;
    margin-right: 20px;
}

.st_Header .cvbtn .dial a {
    font-size: 26px;
    font-weight: bold;
    color: #9f0e15;
    padding-left: 50px;
    position: relative;
}

.st_Header .cvbtn .dial a::before {
    content: "";
    display: block;
    width: 45px;
    height: 29px;
    background-image: url(../images/freedial.png);
    background-size: 100% 100%;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    margin: auto;
}

.st_Header .cvbtn .webform {
    float: right;
}

.st_Header .cvbtn .webform a {
    display: block;
    width: 200px;
    color: #ffffff;
    font-size: 16px;
    text-align: center;
    line-height: 1.4;
    background-image: linear-gradient(to bottom, #ff8400, #feae59);
    padding: 8px 0;
    box-shadow: 2px 2px 4px #d6d6d6;
}

.st_Header .cvbtn .webform a::before {
    content: "";
    display: inline-block;
    width: 40px;
    height: 28px;
    background-image: url(../images/mail.png);
    background-size: 100% 100%;
    margin-right: 10px;
    vertical-align: middle;
}

.st_Header .cvbtn .webform a span {
    display: inline-block;
    vertical-align: middle;
}

.st_Header .sp-Dial {
    display: none;
}


@media screen and (max-width: 1023px){

    .st_Header .captxt {
        font-size: 10px;
    }

    .st_Header .logo {
        max-width: 180px;
    }

    .st_Header .cvbtn .dial a {
        font-size: 20px;
    }

    .st_Header .cvbtn .webform a {
        font-size: 14px;
    }

}

@media screen and (max-width: 767px){

    .st_Header {
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .st_Header .captxt {
        display: none;
    }

    .st_Header .logo {
        max-width: 160px;
        margin-top: 15px;
    }

    .st_Header .cvbtn .dial {
        display: none;
    }

    .st_Header .cvbtn .webform a {
        width: 160px;
        text-align: center;
        padding: 5px 0;
    }

    .st_Header .cvbtn .webform a::before {
        width: 30px;
        height: 24px;
        margin-right: 8px;
    }

    .st_Header .sp-Dial {
        display: block;
        margin-top: 5px;
    }
    
    .st_Header .sp-Dial a {
        font-size: 24px;
        font-weight: bold;
        color: #9f0e15;
        padding-left: 30px;
        position: relative;
    }
    
    .st_Header .sp-Dial a::before {
        content: "";
        display: block;
        width: 26px;
        height: 19px;
        background-image: url(../images/freedial.png);
        background-size: 100% 100%;
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        margin: auto;
    }

}

@media screen and (max-width: 320px) {

    .st_Header .logo {
        max-width: 140px;
        margin-top: 13px;
    }

    .st_Header .cvbtn .webform a {
        width: 120px;
        font-size: 12px;
    }

    .st_Header .cvbtn .webform a::before {
        width: 25px;
        height: 20px;
        margin-right: 4px;
    }

}


/*===== メイン画像 =====*/

.hero-Standard {
    font-size: 0;
    margin-top: 131px;
}

.hero-Standard img {
    width: 100%;
}

@media screen and (max-width: 768px) {

    .hero-Standard {
        margin-top: 123px;
    }

}

@media screen and (max-width: 767px) {

    .hero-Standard {
        margin-top: 111px;
    }

}

/*===== お悩み =====*/

.nayamiimg{
    width: 90%;
    height: auto;
}

.nayami .list li{
    border: #cdcdcd 1px solid;
    text-align: center;
    padding: 10px;
    margin-right: 10px;
}

.nayami .list li span{
    font-weight: bold;
    font-size: 20px;
}



.obi {
    background-color: #721d21;
    padding: 30px 0;
}

.obi h1 {
    color: #ffffff;
    font-size: 32px;
    font-weight: bold;
    text-align: center;
}

.nayami {
    padding: 6% 0 0;
}

.nayami .jinnzai{
    font-size: 14px;
}

.nayami h2 {
    font-size: 42px;
    color: #ffffff;
    text-align: center;
    margin-bottom: 4%;
}

.nayami .list {
    display: flex;
    justify-content: space-between;
    margin-bottom: 4%;
}

.nayami .list .item {
    width: 48%;
    margin-bottom: 4%;
    display: flex;
    align-items: center;
    padding: 30px 0;
    background-color: #721d21;
    border-radius: 15px;
}

.nayami .list .item:nth-child(2n) {
    margin-right: 0;
}

.nayami .list .item span {
    color: #ffffff;
    font-size: 22px;
    font-weight: bold;
    padding-left: 50px;
    margin: 0 20px;
    position: relative;
    box-sizing: border-box;
}

.nayami .list .item span::before {
    content: "";
    display: block;
    width: 40px;
    height: 40px;
    background-image: url(../images/check_mark.png);
    background-size: cover;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}

.nayami h3 {
    font-size: 36px;
    font-weight: bold;
    color: #721d21;
    text-align: center;
    margin-bottom: 4%;
}

.nayami .c01-btn a {
    display: block;
    color: #ffffff;
    max-width: 540px;
    font-size: 30px;
    text-align: center;
    line-height: 1.4;
    background-image: linear-gradient(to bottom, #ff8400, #feae59);
    padding: 30px 0;
    border-radius: 15px;
    box-shadow: 2px 2px 4px #d6d6d6;
    margin: 0 auto;
}

.nayami .c01-btn a b {
    display: block;
    font-size: 32px;
    font-weight: bold;
}

@media screen and (max-width: 1024px) {

    .nayami .list li span {
        font-weight: bold;
        font-size: 14px;
    }

    .nayami .list .item span {
        font-size: 22px;
    }

}

@media screen and (max-width: 768px) {

    .obi {
        padding: 20px 0;
    }

    .obi h1 {
        padding: 0 20px;
        font-size: 28px;
    }

    .nayami {
        padding: 12% 0 0;
    }

    .nayami .list {
        margin-bottom: 12%;
        display: block;
    }

    .nayami .list li{
        margin-bottom: 54px;
        margin-right: 0px;
    }


    .nayami .list li span {
        font-size: 20px;
    }

    .nayami .list lo{
        margin-bottom: 10px;
    }


    .nayami .list .item span {
        font-size: 18px;
        padding-left: 45px;
    }

    .nayami h2 {
        font-size: 20px;
        margin-bottom: 8%;
    }

    .nayami .list .item {
        width: 100%;
        margin-right: 0;
        margin-bottom: 4%;
    }

    .nayami .list .item span::before {
        width: 30px;
        height: 30px;
    }

    .nayami h3 {
        font-size: 22px;
        margin-bottom: 8%;
    }

    .nayami .c01-btn a {
        font-size: 22px;
    }

    .nayami .c01-btn a b {
        font-size: 28px;
    }

}



/*===== ワイズ関西の信頼の実績 =====*/

.point h2 {
    font-size: 40px;
    color: #ffffff;
    text-align: center;
    background-color: #b2282e;
    padding: 10px 0;
}

.point h2 span {
    padding: 0 30px;
    position: relative;
}

.point h2 span::before,
.point h2 span::after {
    content: "";
    display: block;
    width: 4px;
    height: 80%;
    background-color: #ffffff;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    
}

.point h2 span::before {
    left: 0;
    transform: rotate(-30deg);
}

.point h2 span::after {
    right: 0;
    transform: rotate(30deg);
}

.point .item {
    margin-bottom: 8%;
}

.point .item h3 {
    background-color: #721d21;
    margin-bottom: 4%;
}

.point .item h3 span {
    display: block;
    color: #ffffff;
    max-width: 1024px;
    font-size: 28px;
    padding: 20px 0;
    margin: 0 auto;
}

.point .item h3 span b {
    padding: 23.5px 15px;
    margin-right: 15px;
    background-color: #b2282e;
}

.point .box {
    max-width: 1024px;
    margin: 0 auto;
    padding: 0 20px;
}

.point .box .image {
    float: left;
    width: 30%;
}

.point .box .image img {
    width: 100%;
    height: auto;
}

.point .box .txt {
    float: right;
    width: 66%;
}

.point .box .txt p {
    line-height: 2;
}


@media screen and (max-width: 768px){

    .point h2 {
        font-size: 24px;
        margin-bottom: 0;
    }

    .point .item {
        margin-bottom: 16%;
    }

    .point .item h3 {
        margin-bottom: 8%;
    }

    .point .item h3 span {
        font-size: 24px;
        text-align: center;
        padding: 0 20px 20px;
    }

    .point .item h3 span b {
        display: block;
        font-size: 24px;
        max-width: 24px;
        text-align: center;
        padding: 12px 15px;
        margin: 0 auto 20px;
    }

    .point .box .image {
        width: 100%;
        margin-bottom: 6%;
    }

    .point .box .txt {
        width: 100%;
    }

}


/*===== お問い合わせ =====*/

.contact {
    background-color: #721b1f;
}

.contact .content-Wrapper {
    padding: 60px 20px;
    position: relative;
}

.contact .content-Wrapper::before {
    content: "";
    display: block;
    width: 240px;
    height: 430px;
    background-image: url(../images/woman01.png);
    background-size: cover;
    position: absolute;
    left: 40px;
    bottom: 0;
}

.contact .content-Title {
    font-size: 32px;
    color: #ffffff;
    text-align: center;
    margin-bottom: 2%;
}

.contact .box {
    padding: 40px 40px 40px 300px;
    border: 2px solid #3a3a3a;
    background-color: #ffffff;
}

.contact .company-name {
    font-size: 14px;
    padding-left: 210px;
    margin-bottom: 4%;
    position: relative;
}

.contact .company-name::before {
    content: "";
    display: block;
    width: 190px;
    height: 26px;
    background-image: url(../images/logo.png);
    background-size: cover;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}

.contact .info {
    position: relative;
}

.contact .dial {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}

.contact .dial a {
    font-size: 42px;
    line-height: 1;
    color: #7f2428;
    font-weight: bold;
}

.contact .webform {
    width: 54%;
    margin-left: auto;
}

.contact .webform a {
    display: block;
    color: #ffffff;
    text-align: center;
    font-size: 26px;
    font-weight: bold;
    background-image: linear-gradient(to bottom, #ff8400, #feae59);
    padding: 30px 0;
    box-shadow: 2px 2px 4px #757575;
    border-radius: 15px;
}

.contact .webform a span {
    display: block;
    font-size: 20px;
}

@media screen and (max-width: 1023px){

    .contact .content-Wrapper::before {
        width: 146px;
        height: 268px;
        top: 50px;
        left: auto;
        right: 10px;
        bottom: auto;
    }

    .contact .company-name {
        font-size: 14px;
        padding-left: 0;
        margin-bottom: 4%;
        text-align: center;
    }

    .contact .company-name::before {
        position: static;
        transform: translateY(0);
        margin: 0 auto 2%;
    }

    .contact .company-name span {
        display: none;
    }

    .contact .box {
        padding: 40px;
    }

    .contact .dial {
        position: static;
        transform: translateY(0);
        text-align: center;
        margin-bottom: 4%;
    }

    .contact .webform {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
    }

}

@media screen and (max-width: 767px){

    .contact .content-Wrapper {
        padding: 40px 20px;
    }

    .contact .content-Wrapper::before {
        width: 70px;
        height: 126px;
        top: 100px;
        left: auto;
        right: 0px;
    }

    .contact .content-Title {
        font-size: 21px;
        margin-bottom: 4%;
    }

    .contact .company-name {
        font-size: 10px;
        margin-bottom: 8%;
    }

    .contact .company-name::before {
        width: 147px;
        height: 20px;
    }

    .contact .box {
        padding: 40px 20px;
    }

    .contact .dial {
        margin-bottom: 8%;
    }

    .contact .dial a {
        font-size: 32px;
    }

    .contact .webform a {
        font-size: 18px;
        padding: 20px 0;
    }

    .contact .webform a span {
        font-size: 14px;
    }

}

@media screen and (max-width: 320px){

    .contact .content-Wrapper::before {
        width: 65px;
        height: 120px;
        top: 70px;
        left: auto;
        right: 0px;
    }

    .contact .content-Title {
        font-size: 18px;
    }

    .contact .box {
        padding: 30px 20px;
    }

    .contact .webform a {
        padding: 15px 0;
    }

}

/*===== サービス事例 =====*/

.works .content-Title {
    font-size: 34px;
    color: #333333;
    background-color: transparent;
    padding: 0;
}

.works .content-Title span {
    max-width: 540px;
    border-bottom: 1px solid #525252;
    padding-bottom: 10px;
    margin: 0 auto;
    position: relative;
}

.works .content-Title span::before {
    content: "";
    width: 48px;
    height: 4px;
    background-color: #721b1f;
    position: absolute;
    left: 0;
    bottom: -4px;
}

.works .list-Wrapper .unit {
    padding: 40px;
    margin-bottom: 10%;
    background-color: #ffffff;
    position: relative;
}

.works .list-Wrapper .unit {
    padding: 40px;
    margin-bottom: 10%;
    background-color: #ffffff;
    position: relative;
    box-shadow: 2px 2px 10px #c5c5c5;
}

.works .list-Wrapper .unit::before {
    font-size: 30px;
    font-weight: bold;
    position: absolute;
    top: -25px;
    left: 0;
}

.works .list-Wrapper .case01::before {
    content: "Case01";
}

.works .list-Wrapper .case02::before {
    content: "Case02";
}

.works .list-Wrapper .case03::before {
    content: "Case03";
}

.works .list-Wrapper .unit .labelTxt {
    float: left;
    width: 30%;
}

.works .list-Wrapper .unit .labelTxt .intro-Service {
    font-size: 16px;
    margin-bottom: 8%;
}

.works .list-Wrapper .unit .labelTxt .intro-Service span {
    font-size: 14px;
    font-weight: normal;
    padding: 5px;
    border: 1px solid #525252;
    margin-right: 10px;
}

.works .list-Wrapper .unit .labelTxt .intro-Service b {
    font-size: 20px;
    display: block;
    margin-top: 4%;
}

.works .list-Wrapper .unit .intro {
    float: right;
    width: 65%;
    padding-left: 4%;
    margin-left: 4%;
    border-left: 1px solid #525252;
    box-sizing: border-box;
}

.works .list-Wrapper .unit .intro .beforeBox {
    padding-bottom: 80px;
    position: relative;
}

.works .list-Wrapper .unit .intro .beforeBox::after {
    content: "";
    width: 0;
    height: 0;
    border-left: 18px solid transparent;
    border-right: 18px solid transparent;
    border-top: 16px solid #525252;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 30px;
    margin: auto;
}

.works .list-Wrapper .unit .intro .beforeBox dt {
    display: inline-block;
    font-size: 14px;
    color: #ffffff;
    background-color: #616161;
    padding: 3px 10px;
    margin-bottom: 2%;
}

.works .list-Wrapper .unit .intro .afterBox dt {
    display: inline-block;
    font-size: 14px;
    color: #ffffff;
    background-color: #851f24;
    padding: 3px 10px;
    margin-bottom: 2%;
}

.list-Sp {
    display: none;
}


@media screen and (max-width: 768px) {

    .works .list-Wrapper .unit {
        padding: 50px 40px;
    }

    .works .list-Wrapper .unit .labelTxt {
        width: 100%;
        padding-bottom: 6%;
        margin-bottom: 6%;
        border-bottom: 1px solid #525252;
    }

    .works .list-Wrapper .unit .labelTxt dt {
        padding-left: 55px;
        margin-bottom: 4%;
    }

    .works .list-Wrapper .unit .labelTxt .intro-Service {
        margin-bottom: 4%;
    }

    .works .list-Wrapper .unit .intro {
        width: 100%;
        padding-left: 0;
        margin-left: 0;
        border-left: 0;
        box-sizing: border-box;
    }

}

@media screen and (max-width: 767px) {

    .works {
        padding: 12% 0;
    }

    .works .content-Title {
        margin-bottom: 18%;
    }

    .works .content-Title span {
        font-size: 22px;
    }

    .works .list-Wrapper .unit {
        padding: 50px 20px;
        margin-bottom: 18%;
    }

    .works .list-Wrapper .unit:last-child {
        margin-bottom: 0;
    }

    .works .list-Wrapper .unit .labelTxt {
        padding-bottom: 10%;
        margin-bottom: 10%;
    }

    .works .list-Wrapper .unit .labelTxt dt {
        margin-bottom: 10%;
    }
    

    .works .list-Wrapper .unit .labelTxt .intro-Service {
        margin-bottom: 10%;
    }

    .works .list-Wrapper .unit .intro .beforeBox dt,
    .works .list-Wrapper .unit .intro .afterBox dt {
        margin-bottom: 4%;
    }

    .list-Sp {
        display: flex;
        margin-bottom: 16%;
        border-top: solid 1px #525252;
        border-bottom: solid 1px #525252;
    }

    .list-Sp .tab {
        flex-grow: 1;
        padding: 5px;
        list-style: none;
        border-left: solid 1px #525252;
        text-align: center;
        cursor: pointer;
    }

    .list-Sp .tab:last-child {
        border-right: solid 1px #525252;
    }
    
    .panel{
        display: none;
    }

    .tab.is-active{
        background: #525252;
        color: #FFF;
        transition: all 0.2s ease-out;
    }

    .panel.is-show{
        display: block;
    }

}

@media screen and (max-width: 320px) {

    .works .list-Wrapper .unit .labelTxt dt {
        font-size: 20px;
    }

}


/*===== 契約の流れ =====*/

.flow p {
    text-align: center;
    margin-bottom: 6%;
}

.flow .list-Wrapper {
    display: flex;
}

.flow .list-Wrapper .unit {
    padding: 35px 50px 50px 20px;
    background-image: url(../images/flow_bg.png);
    background-size: 100% 100%;
    flex: 1;
    position: relative;
}

.flow .list-Wrapper .unit::before {
    color: #9f0e15;
    font-size: 24px;
    font-weight: bold;
    position: absolute;
    top: -15px;
    left: 0;
}

.flow .list-Wrapper .first::before {
    content: "Step01";
}

.flow .list-Wrapper .second::before {
    content: "Step02";
}

.flow .list-Wrapper .third::before {
    content: "Step03";
}

.flow .list-Wrapper .forth::before {
    content: "Step04";
}

.flow .list-Wrapper .fifth::before {
    content: "Step05";
}

.flow .list-Wrapper .unit dt {
    font-size: 18px;
    min-height: 54px;
    text-align: center;
    font-weight: bold;
    padding-bottom: 2%;
    margin-bottom: 2%;
}

.flow .list-Wrapper .first dt,
.flow .list-Wrapper .third dt,
.flow .list-Wrapper .forth dt,
.flow .list-Wrapper .fifth dt {
    line-height: 54px;
}

.flow .list-Wrapper .unit dd {
    font-size: 14px;
}

@media screen and (max-width: 1024px) {

    .flow .list-Wrapper .first dt, .flow .list-Wrapper .third dt,
    .flow .list-Wrapper .forth dt, .flow .list-Wrapper .fifth dt {
        line-height: 25px;
    }

}


@media screen and (max-width: 768px) {

    .flow .list-Wrapper {
        display: block;
        max-width: 480px;
        margin: 0 auto;
    }
    
    .flow .list-Wrapper .unit {
        padding: 30px 50px 70px 50px;
        background-image: url(../images/flow_bg_sp.png);
    }

    .flow .list-Wrapper .unit dt {
        font-size: 20px;
    }

    .flow .list-Wrapper .first dt, .flow .list-Wrapper .third dt,
    .flow .list-Wrapper .forth dt, .flow .list-Wrapper .fifth dt {
        line-height: 54px;
    }

}

@media screen and (max-width: 767px) {

    .flow p {
        margin-bottom: 12%;
    }

}


/*===== サービス共通 =====*/

.service-Common .txt-Box {
    margin-bottom: 12%;
    position: relative;
}

.service-Common .txt-Box .wrapper {
    width: 50%;
}

.service-Common .content-Title {
    font-size: 28px;
    border-bottom: 1px solid #525252;
    margin-bottom: 6%;
    text-align: left;
    color: #3b3b3b;
    background-color: transparent;
    padding: 0 0 10px;
    position: relative;
}

.service-Common .content-Title::before {
    content: "";
    width: 48px;
    height: 4px;
    background-color: #721b1f;
    position: absolute;
    left: 0;
    bottom: -4px;
}

.service-Common .content-Title span {
    display: block;
    font-size: 20px;
    color: #c8c8c8;
}


.service-Common .txt-Box .wrapper .imgBox {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
}

.service-Common .list-Wrapper {
    display: flex;
    flex-wrap: wrap;
}

.service-Common .list-Wrapper .unit {
    width: 32%;
    margin-right: 2%;
    margin-bottom: 8%;
}

.service-Common .list-Wrapper .unit:nth-child(3n) {
    margin-right: 0;
}

@media screen and (max-width: 1023px){

    .service-Common .txt-Box .wrapper .imgBox img {
        width: 100%;
    }

}

@media screen and (max-width: 768px){

    .service-Common .txt-Box .wrapper {
        width: 100%;
    }

    .service-Common .txt-Box .wrapper .imgBox {
        position: static;
        transform: translateY(0);
        margin-bottom: 4%;
    }

    .service-Common .txt-Box .wrapper .imgBox img {
        width: 100%;
    }

    .service-Common .list-Wrapper .unit dt {
        font-size: 18px;
        padding-left: 38px;
        padding-bottom: 8%;
    }

}


@media screen and (max-width: 767px){

    .service-Common .content-Title {
        font-size: 26px;
    }

    .service-Common .content-Title span {
        font-size: 16px;
    }

    .service-Common .list-Wrapper {
        display: block;
    }

    .service-Common .list-Wrapper .unit {
        width: 100%;
        margin-bottom: 12%;
    }

    .service-Common .list-Wrapper .unit dt {
        padding-bottom: 4%;
    }

}

/*===== 業種・職種別サービス =====*/


.Industry-Service .list-Wrapper .unit dt {
    font-size: 24px;
    font-weight: bold;
    padding-left: 55px;
    padding-bottom: 6%;
    margin-bottom: 6%;
    border-bottom: 1px solid #525252;
    position: relative;
    pointer-events: none;
}

.Industry-Service .list-Wrapper .seizou dt {
    padding-bottom: 33px;
    margin-top: 25px;
}

.Industry-Service .list-Wrapper .unit dt::before {
    content: "";
    width: 45px;
    background-size: cover;
    position: absolute;
    top: 0;
    left: 0;
}

.Industry-Service .list-Wrapper .seizou dt::before {
    height: 40px;
    background-image: url(../images/seizou.png);
}

.Industry-Service .list-Wrapper .souko dt::before {
    height: 45px;
    background-image: url(../images/souko.png);
}

.Industry-Service .list-Wrapper .zimu dt::before {
    height: 34px;
    background-image: url(../images/zimu.png);
}

.Industry-Service .list-Wrapper .rinen dt::before {
    height: 45px;
    background-image: url(../images/rinen.png);
}

.Industry-Service .list-Wrapper .service dt::before {
    height: 35px;
    background-image: url(../images/serviceicon.png);
}

.Industry-Service .list-Wrapper .call dt::before {
    height: 49px;
    background-image: url(../images/call.png);
}

.Industry-Service .list-Wrapper .nougyou dt::before {
    height: 36px;
    background-image: url(../images/nougyou.png);
}

@media screen and (max-width: 1023px){

    .Industry-Service .txt-Box .wrapper .imgBox {
        width: 48%;
    }

}

@media screen and (max-width: 768px){

    .Industry-Service .txt-Box .wrapper .imgBox {
        width: 100%;
    }

    .Industry-Service .list-Wrapper .unit dt {
        font-size: 18px;
        padding-left: 40px;
    }

    .Industry-Service .list-Wrapper .seizou dt {
        padding-bottom: 32px;
        margin-top: 10px;
    }

    .Industry-Service .list-Wrapper .unit dt::before {
        width: 30px;
    }

    .Industry-Service .list-Wrapper .seizou dt::before {
        height: 27px;
    }

    .Industry-Service .list-Wrapper .souko dt::before {
        height: 30px;
    }

    .Industry-Service .list-Wrapper .zimu dt::before {
        height: 23px;
    }

    .Industry-Service .list-Wrapper .rinen dt::before {
        height: 30px;
    }

    .Industry-Service .list-Wrapper .service dt::before {
        height: 23px;
    }

    .Industry-Service .list-Wrapper .call dt::before {
        height: 33px;
    }

    .Industry-Service .list-Wrapper .nougyou dt::before {
        height: 24px;
    }

}


@media screen and (max-width: 767px){

    .Industry-Service .list-Wrapper .unit dt {
        pointer-events: all;
        padding-right: 40px;
    }

    .Industry-Service .list-Wrapper .seizou dt {
        padding-bottom: 6%;
        margin-top: 0;
    }

    .Industry-Service .list-Wrapper .unit dt::after {
        content: "＋";
        position: absolute;
        top: 0;
        right: 10px;
        transition: 0.7s;
    }

    .Industry-Service .list-Wrapper .unit dt.open::after {
        transform: rotate(45deg);
    }

    .Industry-Service .unit dd {
        display: none
    }

}

/*===== 総合人材サービス =====*/

.human-Service {
    padding: 10% 0;
    background-color: #f1f1f1;
}

.human-Service .column-Title {
    font-size: 32px;
    text-align: center;
    margin-bottom: 3%;
}

.human-Service .column-Title b {
    font-size: 42px;
    color: #e8811d;
}

.human-Service p {
    text-align: center;
    margin-bottom: 6%;
}

.human-Service .wrapper {
    display: flex;
    flex-wrap: wrap;
}

.human-Service .wrapper .unit {
    width: 32%;
    border: 1px solid #3c3c3c;
    border-radius: 15px;
    margin-right: 2%;
    margin-bottom: 6%;
    box-sizing: border-box;
    background-color: #ffffff;
}

.human-Service .wrapper .unit:nth-child(3n) {
    margin-right: 0;
}

.human-Service .wrapper .unit dl {
    padding: 40px;
}

.human-Service .wrapper .unit dl::before {
    content: "";
    display: block;
    height: 65px;
    background-size: cover;
    margin: 0 auto 6%;
}

.human-Service .wrapper .haken dl::before,
.human-Service .wrapper .syokugyou dl::before {
    width: 50px;
    background-image: url(../images/haken.png);
}

.human-Service .wrapper .syoukaiyotei dl::before {
    width: 49px;
    background-image: url(../images/haken02.png);
}

.human-Service .wrapper .sinia dl::before {
    width: 50px;
    background-image: url(../images/sinia.png);
}

.human-Service .wrapper .itaku dl::before {
    width: 50px;
    background-image: url(../images/itaku.png);
}

.human-Service .wrapper .koukoku dl::before {
    width: 65px;
    background-image: url(../images/koukoku.png);
}

.human-Service .wrapper .unit dl dt {
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 6%;
}


@media screen and (max-width: 767px) {

    .human-Service .column-Title {
        font-size: 16px;
        margin-bottom: 6%;
    }

    .human-Service .column-Title b {
        display: block;
        font-size: 30px;
    }

    .human-Service p {
        margin-bottom: 12%;
    }

    .human-Service .wrapper .unit {
        width: 100%;
        margin-right: 0%;
        margin-bottom: 12%;
    }

}

/*===== 事業所 =====*/

.place .txt {
    padding-left: 24%;
    margin-bottom: 4%;
}

.place .wrapper {
    padding-left: 24%;
    position: relative;
}

.place .wrapper::before {
    content: "";
    width: 215px;
    height: 336px;
    background-image: url(../images/biwako.png);
    background-size: cover;
    position: absolute;
    top: 0;
    left: 0;
}

.place .wrapper h3 {
    font-size: 16px;
    color: #ffffff;
    background-color: #e8811d;
    border-radius: 20px;
    padding: 5px 15px;
    margin-bottom: 6%;
}

.place .wrapper .left-Box {
    float: left;
    width: 48%;
}

.place .wrapper .right-Box {
    float: right;
    width: 48%;
}

.place .wrapper .unit {
    min-height: 140px;
    padding-left: 30px;
    margin-bottom: 8%;
}

.place .wrapper .unit dt {
    font-size: 18px;
    font-weight: bold;
    position: relative;
    margin-bottom: 2%;
}

.place .wrapper .unit dt::before {
    content: "・";
    position: absolute;
    top: 0;
    left: -15px;
}

.place .wrapper .unit dd {
    font-size: 16px;
}

.place .wrapper .unit dd a {
    font-size: 20px;
    font-weight: bold;
}

.place .wrapper .unit dd span {
    position: relative;
}

.place .wrapper .unit dd span::after {
    content: "：";
}

@media screen and (max-width: 1023px){

    .place .point-Title::after {
        content: "";
        width: 110px;
        height: 170px;
        background-image: url(../images/biwako.png);
        background-size: cover;
        position: absolute;
        top: 0;
        right: 20px;
        z-index: 0;
        opacity: 0.4;
    }

    .place .txt {
        padding-left: 0;
        position: relative;
    }

    .place .wrapper {
        padding-left: 0;
    }

    .place .wrapper::before {
        content: none;
    }

}

@media screen and (max-width: 767px){

    .place .point-Title::after {
        width: 115px;
        height: 180px;
        top: 50px;
        right: 0px;
        opacity: 0.3;
    }

    .place .txt {
        margin-bottom: 8%;
    }

    .place .wrapper .left-Box {
        width: 100%;
        margin-bottom: 8%;
    }

    .place .wrapper .right-Box {
        width: 100%;
    }

    .place .wrapper .unit {
        min-height: auto;
        padding-left: 20px;
        margin-bottom: 10%;
    }

    .place .wrapper .unit dt {
        margin-bottom: 4%;
    }

}


/*===== よくある質問 =====*/

.faq .column-Title {
    font-size: 32px;
    text-align: center;
    margin-bottom: 6%;
    position: relative;
}

.faq .column-Title::after {
    content: "";
    max-width: 38px;
    height: 4px;
    background-color: #9f0e15;
    position: absolute;
    left: 0;
    right: 0;
    bottom: -5px;
    margin: auto;
}

.faq .wrapper {
    padding: 60px 80px;
    background-color: #ffffff;
    border: 1px solid #3c3c3c;
    position: relative;
}

.faq .wrapper::before {
    content: "";
    width: 68px;
    height: 68px;
    background-image: url(../images/parts01.png);
    background-size: 100% 100%;
    position: absolute;
    top: 0;
    right: 0;
}

.faq .list-Wrapper .unit {
    padding-bottom: 4%;
    margin-bottom: 4%;
    border-bottom: 1px solid #3c3c3c;
}

.faq .list-Wrapper .unit:last-child {
    border-bottom: 0;
}

.faq .list-Wrapper .unit dt {
    font-size: 18px;
    font-weight: bold;
    padding-left: 30px;
    margin-bottom: 4%;
    position: relative;
}

.faq .list-Wrapper .unit dt::before {
    content: "Q";
    color: #ffffff;
    width: 24px;
    height: 24px;
    text-align: center;
    line-height: 24px;
    background-color: #104b78;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    margin: auto;
}

.faq .list-Wrapper .unit dd {
    font-size: 16px;
    padding-left: 30px;
    position: relative;
}

.faq .list-Wrapper .unit dd::before {
    content: "A";
    color: #ffffff;
    width: 24px;
    height: 24px;
    text-align: center;
    line-height: 24px;
    font-weight: bold;
    background-color: #9f0e15;
    position: absolute;
    top: 0;
    left: 0;
}

@media screen and (max-width: 767px) {

    .faq .column-Title {
        font-size: 24px;
        margin-bottom: 14%;
    }

    .faq .wrapper {
        padding: 40px 20px 0;
    }

    .faq .wrapper::before {
        width: 48px;
        height: 48px;
    }

    .faq .list-Wrapper .unit {
        padding-bottom: 12%;
        margin-bottom: 12%;
    }

    .faq .list-Wrapper .unit dt {
        margin-bottom: 10%;
    }

    .faq .list-Wrapper .unit dt::before {
        margin: 0;
    }

}

/*===== footer =====*/

.st-Footer {
    position: relative;
}

.st-Footer .home-cont {
    padding: 4% 0;
}

.st-Footer .logo {
    max-width: 240px;
    text-align: center;
    margin: 0 auto 2%;
}

.st-Footer .logo img {
    width: 100%;
}

.st-Footer .Navi ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.st-Footer .Navi ul li {
    width: 25%;
    text-align: center;
    border-right: 1px solid #3b3b3b;
    box-sizing: border-box;
}

.st-Footer .Navi ul li:first-child {
    border-left: 1px solid #3b3b3b;
}

.st-Footer .Navi ul li a {
    font-size: 14px;
}

.st-Footer .Navi ul li a:hover {
    color: #757575;
    text-decoration: underline;
}

.st-Footer .copytxt {
    color: #ffffff;
    text-align: center;
    font-size: 14px;
    padding: 10px 0;
    background-color: #454545;
}

@media screen and (max-width: 1023px){

    .st-Footer .home-cont {
        padding: 8% 0;
    }

    .st-Footer .copytxt {
        font-size: 12px;
    }

}

@media screen and (max-width: 767px){

    .st-Footer .logo {
        max-width: 160px;
        margin: 0 auto 6%;
    }

    .st-Footer .Navi ul {
        display: block;
    }

    .st-Footer .Navi ul li {
        width: 100%;
        border-right: 0;
        margin-bottom: 6%;
    }

    .st-Footer .Navi ul li:first-child {
        border-left: 0;
    }

    .st-Footer .Navi ul li:last-child {
        margin-bottom: 0;
    }

    .st-Footer .copytxt {
        padding: 10px 20px;
    }

}