/*
Theme Name : comit-hr
Author: zhou
Description: This is my original style
Version: 1.0;
*/
@charset "UTF-8";
.mw-3{
    width: 30%;
}
.mw-5{
    width: 50%;
}
.mw-6{
    width: 60%;
}
.mw-10{
    width:100%;
}
.fl{
    float:left;
}
.fr{
    float:right;
}
.ofh{
    overflow:hidden;
}
.bd-b{
    border-bottom: 1px solid #bfbfbf;
}
.pc-only{
    display: inline-block;
}
.sp-only{
    display: none;
}
.import-article .blog-wrap{
    padding:15px 40px;
    background-color: white;
}
.import-article .blog-wrap p.date {
    display: flex!important;
    align-items: center;
}
.qa-list{
    padding-left: 0;
}
.qa-list li{
    list-style: none;
}
.qa-list li h4{
    background-color: #f7f8f8;
    padding: 13px 20px;
}
.qa-list li h4 i{
    color: #3bbbd5;
    margin-right:20px;
    font-size: 18px;
    font-weight: bold;
}
.balloon1-left__grey{
    background-color: #f7f8f8;
    width: 66%;
    padding:15px 40px;
}
.balloon1-left__grey:before {
    border-right: 15px solid #f7f8f8;
}
.balloon1-left__grey p{
    margin-bottom: 0 !important;
}
.balloon1-left__grey p i{
    color: #cb4649;
}
/* new job5 */
#year-end{
    margin-top: -50px;
    font-family: Noto Sans JP,游ゴシック体, YuGothic, "游ゴシック Medium", "Yu Gothic Medium", 游ゴシック, "Yu Gothic", sans-serif;
}
#year-end .kv{
    min-height: 757px;
    font-family: 游ゴシック体, YuGothic, "游ゴシック Medium", "Yu Gothic Medium", 游ゴシック, "Yu Gothic", sans-serif;
    padding-top: 120px;
    background: url(images/newjob5/job5-top.jpg) center center / cover;
    position: relative;
}
#year-end .kv .top-content{
    width:478px;
    position: absolute;
    left:50%;
    margin-left: -239px;
    top:50%;
    margin-top:-283.5px;
}
#year-end .kv .top-pattern{
    width:478px;
    height:459px;
    background: url(images/newjob5/job5-top-pattern.png) center center / cover;
    margin-bottom: 36px;
}
#year-end .kv .notes{
    position: absolute;
    bottom: 10px;
    right: 10px;
    font-size: 14px;
}
#year-end .reservBtn{
    background:url(images/newjob5/job5-arrow.png) #00b8de no-repeat;
    background-position:267px center;
    border: 4px solid #00b8de;
    border-radius: 50px;
    padding: 18px 0;
    width: 312px;
    font-size: 20px;
    font-weight: bold;
    color: #fff;
    cursor: pointer;
    box-shadow: 6px 6px 20px 0px #666464;
    position: relative;
    display: inline-block;
    text-align: center;
}
#year-end .reservBtn:hover {
    /* opacity: 0.7; */
    background-color: #03d0f9;
    border-color: #03d0f9;
}
#year-end .smart-oprate,#year-end .consult{
    background-color: #f6fcfc;
    padding: 9vh 0;
}
#year-end .smart-oprate h2,#year-end .business-scope h2,#year-end .business-process h2,#year-end .consult h2{
    color:#00afd3;
    font-weight:bold;
    margin-bottom:10px;
}
#year-end .smart-intro{
    width: 703px;
    margin: 0 auto;
    font-size: 17px;
    overflow: hidden;
}
#year-end .smart-intro{
    margin-top:6vh;
}
#year-end .smart-oprate .small-tips,#year-end .business-scope .small-tips{
    width: 627px;
    margin: 0 auto;
    font-size: 17px;
    display: flex;
    flex-flow: row;
    justify-content: space-around;
}
#year-end .smart-oprate .small-tips hr,#year-end .business-scope .small-tips hr{
    width: 4vh;
    margin-top: 1.5vh;
    margin-right: 2vh;
    margin-left: 2vh;
    height:0;
}
#year-end .smart-oprate .small-tips hr:first-child,#year-end .business-scope .small-tips hr:first-child{
    margin-left: 0;
}
#year-end .smart-oprate .small-tips hr:last-child,#year-end .business-scope .small-tips hr:last-child{
    margin-right: 0;
}
#year-end .smart-oprate .small-tips p,#year-end .business-scope .small-tips p{
    
}
#year-end .smart-intro p{
    margin-bottom: 4vh;
}
#year-end .smart-intro p i{
    background-color: #fff57f;
}
#year-end .smart-intro small{
    font-size: 13px;
    font-weight: normal;
}
#year-end .smart-oprate .step-list{
    width: 984px;
    margin: 0 auto;
    padding-left: 0;
    margin-top: 6vh;
    overflow: hidden;
}
#year-end .smart-oprate .step-list li{
    width: 28%;
    margin-left: 8%;
    list-style: none;
    float: left;
}
#year-end .smart-oprate .step-list li:first-child{
    margin-left: 0;
}
#year-end .business-scope{
    background: white;
    padding: 90px 0;
}
#year-end .business-scope .small-tips{
    width:553px;
}
#year-end .business-scope .business-list,#year-end .business-process .process-point,#year-end .consult .consult-btn{
    display: flex;
    flex-flow: row;
    justify-content:space-around;
    width:984px;
    margin:0 auto;
    margin-top:62px;
    margin-bottom: 62px;
}
#year-end .business-process .smart-intro p{
    font-size: 17px;
}
#year-end .business-process .process-point{
    flex-flow: column;
    width:815px;
}
#year-end .business-process .process-point .process-content{
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    margin-top: 4px;
}
#year-end .business-process .process-point .process-content p{
    width: 33%;
    margin-right: 3%;
    font-weight: bold;
}
#year-end .business-process .process-point .process-content p:last-child{
    margin-right:0;
}
#year-end .business-scope .business-list .content-box{
    width:30%;
    border-radius: 8px;
    overflow: hidden;
}
#year-end .business-scope .business-list .left-content{
    background-color:#00b8de;
    padding: 25px 15px 15px;
    text-align: center;
}
#year-end .business-scope .business-list .left-content .top{
    margin-bottom: 15px;
}
#year-end .business-scope .business-list .left-content img{
    width:92%;
}
#year-end .business-scope .business-list .left-content .left-list{
    list-style: none;
    padding-left: 0;
}
#year-end .business-scope .business-list .left-content .left-list li{
    background-color:white;
    border-radius: 8px;
    padding: 2.5vh 4vh;
    margin-bottom: 0.6vh;
}
#year-end .business-scope .business-list .left-content .left-list li .sub-content{
    width: 20vh;
    text-align: left;
    margin: 0 auto;
    font-size: 13px;
    margin-top: 1vh;
}
#year-end .business-scope .business-list .left-content .left-list li:first-child .sub-content{
    width: 19vh;
}
#year-end .business-scope .business-list .left-content .left-list li:last-child{
    margin-bottom: 0;
}
#year-end .business-scope .business-list .left-content .left-list li:last-child .sub-content{
    width: 22vh;
}
#year-end .business-scope .center-content,#year-end .business-scope .right-content{
    background-color:#e3f6fa;
    padding: 0 15px;
}
#year-end .business-scope .center-content .top,#year-end .business-scope .right-content .top{
    text-align: center;
    margin-top: 25px;
}
#year-end .business-scope .center-content .top img,#year-end .business-scope .right-content .top img{
    width: 46%;
}
#year-end .business-scope .center-content .top .position,#year-end .business-scope .right-content .top .position{
    border-radius: 100px;
    background-color:#215989;
    color: white;
    width: 33%;
    margin: 0 auto;
    padding: 0.4vh;
    margin-top:1vh;
    font-size: 16px;
}
#year-end .business-scope .center-content .content-small-box{
    background: white;
    border-radius: 8px;
    padding:1.4vh;
    text-align: center;
    margin-bottom: 0.6vh;
    font-weight: bold;
    overflow: hidden;
}
#year-end .business-scope .center-content .btn,#year-end .business-scope .right-content .btn{
    border-radius: 100px;
    background-color:#b9ebf6;
    color: #222;
    width: 50%;
    margin: 0 auto;
    padding: 1vh;
    text-align: center;
    font-weight: bold;
}
#year-end .business-scope .center-content .center-1{
    margin-top: 20.8vh;
    padding:7.7vh 1vh;
    background:url('images/newjob5/job5-num-1.png') white no-repeat;
    background-position: 1.5vh center;
}
#year-end .business-scope .center-content .center-2{
    background:url('images/newjob5/job5-num-2.png') white no-repeat;
    background-position: 1.5vh center;
}
#year-end .business-scope .center-content .center-3{
    padding:1.4vh;
}
#year-end .business-scope .center-content .center-4{
    padding: 2.5vh;
    margin-top: 15.8vh;
    background:url('images/newjob5/job5-num-3.png') white no-repeat;
    background-position: 1.5vh center;
}
#year-end .business-process{
    padding: 90px 0;
}
#year-end .consult{
    margin-bottom: 4vh;
}
/* new job5 end */
/* new file download */
.request-content{
    background-color: #eee;
    display: flex;
    justify-content: space-between;
    min-height: 100vh;
    margin-bottom: 80px;
}
.request-outline{
    margin: 0 auto;
    width: 60%;
}
.form-download{
    background-color: #fff;
    min-width: 467px;
    padding: 0;
    width: 40%;
}
.request-outline .request-inner{
    margin: 0 auto;
    max-width: 635px;
    padding: 49px 20px;
}
.request-outline .request-inner h1{
    font-size: 30px;
    font-weight: 700;
    line-height: 1.5;
    text-align: left;
    /* padding-left: 37px; */
    margin: 0 0 45px !important;
}
.request-outline .request-eyecatch{
    margin-bottom: 45px;
    text-align: center;
}
.request-outline .request-eyecatch img{
    box-shadow: 0 3px 12px 5px rgb(0 0 0 / 58%);
}
.request-outline .request-summary{
    max-width: 518px;
    padding: 30px 26px;
    background-color: #f9fbfb;
    border: 1px solid #d7d7d7;
    border-radius: 6px;
    margin: 0 auto;
    margin-bottom: 35px;
}
.request-outline .request-summary h2{
    font-size: 16px;
    font-weight: 700;
    margin: 0 0 15px 30px;
    text-align: left;
}
.request-outline .request-summary ul{
    font-size: 14px;
    list-style: disc;
    margin-bottom: 0;
    margin-left: 30px;
}
.request-outline .request-inner p{
    max-width: 566px;
    margin: 0 auto;
    margin-bottom: 50px;
}
.request-outline .request-images{
    margin: 0 0 40px;
    list-style: none;
    padding-left: 0;
}
.request-outline .request-images li{
    position: relative;
    margin: 45px 0 0;
}
.request-outline .request-images li:first-child{
    margin:0;
}
.request-outline .request-images>li:nth-child(3)::after{
    content: "";
    position: absolute;
    z-index: 2;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg,hsla(0,0%,100%,0),hsl(0deg 0% 93% / 90%))
}
.request-outline .request-button{
    margin: 0 0 50px;
    text-align: center;
}
.request-outline .request-button>a{
    display: inline-block;
    background: #f7b100!important;
    border-color: #f7b100!important;
    border-radius: 100px;
    font-size: 15px!important;
    max-width: 270px;
    padding: 14px 20px!important;
    transition: .2s;
    width: 100%;
    line-height: 1!important;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-weight: 700;
    text-align: center;
    color: #fff;
}
.form-download .form-in.ebook{
    background-color: #eee;
    border-radius: 6px;
    box-shadow: 0 3px 5px 0 rgb(0 0 0 / 34%);
    box-sizing: border-box;
    padding: 49px 70px;
    width: 90%;
    margin: 0 auto;
}
.form-download form > div{
    margin-bottom: 20px;
}
/* .form-download label span {
    font-size: 12px;
    font-weight: bold;
    background-color: #d04652;
    color: #fff;
    padding: 0px 5px;
    margin-left: 5px;
} */
.form-download label .optional{
    background-color: #aaa;
}
.form-download form .name, .form-download  form .ip-company{
    width: 70%;
    height: 40px;
    border-radius: 3px;
    border: 1px solid #aaa;
    margin-top: 3px;
    text-indent: 1em;
    box-sizing: border-box;
}
.form-download form div > div {
    /* color: red; */
}
.form-download form input, .form-download form textarea{
    height: 40px;
    border-radius: 3px;
    border: 1px solid #aaa;
    margin-top: 3px;
    text-indent: 1em;
    box-sizing: border-box;
}
.form-download form .email, .form-download form .inquiry{
    width: 100%;
}

.form-download form .tel{
    width: 30%;
}
p.privacy-lead {
    font-size: 0.9rem;
}
.privacy-wrap {
    width: 100%;
    height: 300px;
    margin: 15px 0;
    overflow-y: scroll;
    border: solid 1px #ccc;
    background: #fff;
}
.privacy-wrap{
    width: 73%;
    margin-left: 219px;
    border: 4px solid #969696;
}
.form-download form > div {
    margin-bottom: 0px;
}
.form-download form input[type=submit] {
    background-color: #f7b100;
    border-radius: 30px;
    border: 0px;
    padding: 10px 40px;
    color: #fff;
    font-size: 16px;
    cursor: pointer;
    margin-bottom: 20px;
}
.form-download form input[type=submit]:hover{
    background-color: #f7b100;
}
.form-download form .has-danger{
    background-color: #FFE3E3;
}
/* new file download end */
@media only screen and (min-width: 787px) and (max-width: 1000px) {
/* new job5 */
#year-end .reservBtn{
    width: 374px;
    background-position:310px center;
    padding: 25px 0;
    font-size: 22px;
}
#year-end .smart-oprate .small-tips, #year-end .smart-intro{
    width:92%;
}
#year-end .smart-oprate .step-list,#year-end .business-scope .business-list, #year-end .business-process .process-point, #year-end .consult .consult-btn{
    width:100%;
}
/* new job5 end */
   .privacy-wrap{
    width:99%;
    margin-left: 0;
  }
}
@media only screen and (max-width: 768px) {
    /* new job5 */
    #year-end .reservBtn{
        width:345px;
        background-position:280px center;
        padding: 20px 0;
    }
    #year-end .smart-oprate .small-tips, #year-end .smart-intro{
        width:94%;
    }
    #year-end .smart-oprate .step-list,#year-end .business-scope .business-list, #year-end .business-process .process-point, #year-end .consult .consult-btn{
        width:100%;
    }
    /* new job5 end */
    /* new file download */
    .request-content{
        flex-direction: column;
    }
    .request-outline{
        width: 100%;
    }
    .form-download{
        width: 100%;
        min-width: 100%;
    }
    .form-download .form-in.ebook{
        border-radius: 0;
        box-shadow: none;
        margin: 20px auto;
        padding: 49px 5%;
        width: 90%;
    }
    .form-download form .tel,.form-download form .name, .form-download form .ip-company,.form-download form button{
        width: 100%;
    }
    .privacy-wrap{
        width:99%;
        margin-left: 0;
    }
    /* new file download end */
}

@media screen and (max-width: 767px) {
    .pc-only{
        display: none;
    }
    .sp-only{
        display: inline-block;
    }
    .import-article .blog-wrap{
        padding:0;
    }
    .qa-list{
        padding-left:0;
    }
    .balloon1-left__grey:before{
        border-bottom: 15px solid #f7f8f8;
    }
    /* new job5 */
    #year-end .kv .top-content{
        width:343px;
        position: unset;
        margin:0 auto;
        /* margin-left:unset; */
        margin-top: 58px;
    }
    #year-end .kv .top-pattern{
        width:343px;
        height:329px;
    }
    #year-end .reservBtn{
        padding: 10px 0;
        width: 252px;
        font-size: 16px;
        background-position:209px center;
    }
    #year-end .smart-oprate,#year-end .business-scope,#year-end .business-process,#year-end .consult{
        padding: 9vh 1vh;
    }
    #year-end .smart-oprate .small-tips,#year-end .business-scope .small-tips{
        width: 90%;
    }
    #year-end .smart-oprate .small-tips p,#year-end .business-scope .small-tips p{
        width: 31vh;
    }
    #year-end .smart-oprate .small-tips hr,#year-end .business-scope .small-tips hr{
        width: 3vh;
        margin-right: 1vh;
        margin-left: 1vh;
    }
    #year-end .smart-oprate .small-tips hr:first-child {
        margin-left: 0;
    }
    #year-end .smart-intro,#year-end .business-scope .business-list,#year-end .business-process .process-point,#year-end .consult .consult-btn{
        width:100%;
    }
    #year-end .smart-oprate .step-list{
        width:100%;
    }
    /* new job5 end */
    .privacy-wrap{
        width:99%;
        margin-left: 0;
      }
}

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

}


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

}



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

}

@media only screen and (min-width: 787px) {

}

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

}



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

}