@charset "utf-8";
/* CSS Document */
@media only screen and (min-width: 750px) {
    /*class*/
    .pcHide {
        display: none;
    }

    .spHide {
        display: block;
    }

    h2 {
        font-size: 2.4rem;
        color: #000;
    }

    h2 span {
        color: #dd3344;
    }

    h5 {
        font-size: 1.4rem;
        font-weight: normal;
        margin-bottom: 32px;
    }

    /* --- header --- */
    header {
        width: 100%;
        background: #fff;


    }

    header p {
        width: 736px;
        margin: 0 auto;
        text-align: left;
        height: 50px;
        padding-top: 14px;
        height: 65px;
        padding-top: 4px;
        display: flex;
        align-items: center;
    }

    .enqTtl {
        background-image: url(../img/img_female.svg), url(../img/img_male2.svg), url(../img/bg_ttl.png);
        background-size: 45px auto, 45px auto, 250px auto;
        background-position: right 95px top 5px, right 35px top 5px, 0 0;
        background-repeat: no-repeat, no-repeat, repeat;
        padding: 10px 20px;
        box-sizing: border-box;
        width: 736px;
        color: #fff;
        font-size: 2rem;
        position: relative;
        z-index: 1;
        margin: 20px auto 0;
    }

    /* --- step --- */
    .stepBar {
        width: 736px;
        margin: 0 auto 20px;
    }

    .stepBar li {
        line-height: 24px;
        font-size: 1.5rem;
    }

    .stepBar li:nth-child(2),
    .stepBar li:nth-child(3) {
        padding-right: 0;
    }

    .stepBar li:before, .stepBar li:after {
        left: -6px;
        width: 12px;
        height: 12px;
    }

    /* --- #content-wrap --- */
    #content-wrap {
        padding: 0;
    }

    #content-box {
        width: 736px;
        padding: 30px 20px;
    }

    #content-box:after {
        width: 726px;
        left: 50%;
        margin-left: -363px;
    }

    .select-wrap {
        padding: 20px;
        margin-top: 30px;
    }

    .select-wrap ul.next li a,
    #accordion .select-wrap ul.next li a,
    .select-wrap ul.nolink li,
    .select-wrap ul.accordion li h3 {
        font-size: 1.8rem;
        padding: 25px 20px;
        box-sizing: border-box;
        border: 2px solid #efe9d2;
        margin-bottom: 5px;
    }

    .select-wrap ul.nolink li span,
    .select-wrap ul.nolink li a,
    .select-wrap ul.next li a span {
        font-size: 1.2rem;
        margin-top: 4px;
    }

    .select-wrap ul.accordion li h3 {
        margin-bottom: 0;
    }

    .select-wrap ul.next li a:hover {
        border: 2px solid #4499dd;
        background-color: #4499dd;
        color: #fff;
    }

    .select-wrap ul.next li a:hover span {
        color: #fff;
    }

    .select-wrap ul.next li a:after {
        font-size: 1.8rem;
        right: 20px;
        margin-top: -0.9rem;
    }

    .select-wrap ul.accordion li i {
        right: 20px;
        font-size: 1.8rem;
    }

    .select-wrap ul.next li a:hover:after {
        color: #fff;
    }

    /* --- .input-area --- */
    .input-area li {
        margin-bottom: 30px;
    }

    .input-area p {
        font-size: 1.8rem;
    }

    .input-area li.required p:after,
    .input-area li.either p:after {
        padding: 0 4px;
        font-size: 1.2rem;
        margin-left: 10px;
        position: relative;
        top: -3px;
    }

    .input-area input {
        border: 2px solid #0099dd;
        padding-left: 20px;
        font-size: 1.5rem;
    }

    /*入力エラー*/
    .valid-txt {
        border: 3px solid #ff0000;
        padding: 10px;
        border-radius: 3px;
        margin-bottom: 20px;
    }

    .valid-txt p,
    .valid-txt ul li {
        color: #ff0000;
        font-size: 1.4rem;
        line-height: 1.3;
    }

    .valid-txt p {
        font-size: 1.5rem;
        padding-left: 23px;
        margin-bottom: 5px;
    }

    .valid-txt p:before {
        content: "";
        width: 17px;
        height: 17px;
        top: -1px;
    }

    /*セレクトボックス*/
    .customSelect {
        border: 2px solid #0099dd;
        font-size: 1.5rem;
        padding-left: 20px;
    }

    .styledSelectBox:hover {
        cursor: pointer;
    }

    /*戻るボタン*/
    .returnbtn {
        width: 20rem;
        height: 6rem;
        vertical-align: middle;
        font-size: 1.6rem;
        text-align: center;
    }

    .returnbtn:hover {
        background-color: #1f88cd;
        color: #fff;
    }

    /*CVボタン*/
    form button.cvbtn,
    .nextbtn a {
        width: 250px;
        height: 60px;
        margin: 40px auto 10px;
        font-size: 1.8rem;
    }

    #kuchikomi form button.cvbtn {
        width: 300px;
        display: inline-block;
        float: none;
        vertical-align: middle;
        margin-left: 5px;
        margin-top: 0;
        margin-bottom: 30px;
    }

    .nextbtn a {
        padding-top: 24px;
    }

    .nextbtn + .nextbtn a {
        margin: 15px auto 0;
    }

    form button.cvbtn:hover,
    .nextbtn a:hover {
        background-color: #ffb153;
    }

    form button.cvbtn:after,
    .nextbtn a:after {
        font-size: 1.8rem;
        margin-top: -0.9rem;
    }

    .reselect a {
        font-size: 1.4rem;
    }

    /* --- footer --- */
    footer {
        padding: 40px 0;
    }

    /*--------------------------------------------------
    個別ページ
    -------------------------------------------------- */
    /*#lp*/
    #lp #content-wrap {
        //padding-top: 109px;
        padding-top: 94px;
    }

    #lp #title,
    #error #title {
        background-position: right 35px bottom 0, 0 0;
        background-size: 110px auto, auto auto;
        height: 117px;
        padding: 0 36px 30px;
        top: 60px;
        left: 50%;
        margin-left: -383px;
        width: 766px;
    }

    #error #title {
        background-image: url(../img/img_female.svg), url(../img/img_male2.svg), url(../img/bg_ttl.png);
        background-size: 65px auto, 65px auto, 250px auto;
        background-position: right 125px bottom 0, right 35px bottom 0, 0 0;
        background-repeat: no-repeat, no-repeat, repeat;
    }


    #lp #title:before,
    #error #title:before {
        border-bottom: solid 8px transparent;
        border-right: solid 15px rgb(0, 68, 136); /*折り返し部分*/
    }

    #lp #title:after,
    #error #title:after {
        border-bottom: solid 8px transparent;
        border-left: solid 15px rgb(0, 68, 136); /*折り返し部分*/
    }

    #lp #title h1,
    #error #title h1 {
        padding: 25px 78px 6px 0;
        font-size: 2.4rem;
        line-height: 1.6;
    }

    #error #title h1 {
        padding: 40px 78px 6px 0;
    }

    #error h5 {
        text-align: center;
        line-height: 2;
        margin-bottom: 15px;
    }

    #lp #title p {
        font-size: 1.5rem;
        line-height: 1.5;
    }

    #lp #title #subttl {
        top: -28px;
        left: 0;
        right: 0;
    }

    #lp #title #subttl p {
        font-size: 1.8rem;
        padding: 0 13px;
        line-height: 2;
    }

    #lp #title #subttl p:after {
        border-width: 10px 5px 0 5px;
        bottom: -10px;
        margin-left: -5px;
    }

    #lp #content-box,
    #error #content-box {
        padding-top: 72px;
    }

    #lp .present {
        padding: 50px 20px 20px;
        margin: 30px 0 20px;
    }

    #lp .present ul {
        width: 100%;
        margin-right: -58px;
        font-size: 50px;
    }

    #profile .present ul {
        background-color: #f5f5f5;
        display: inline-block;
        padding: 5px 5px 2px 5px;
        font-size: 50px;
    }

    #lp .present ul li,
    #profile .present ul li {
        width: 206px;
    }

    #lp .present ul li:nth-last-child(2),
    #profile .present ul li:nth-last-child(2) {
        width: 206px;
        margin-right: 0;
    }

    #lp .present ul li:last-child,
    #profile .present ul li:last-child {
        width: 206px;
    }

    #lp .present ul li figure,
    #profile .present ul li figure {
        margin-bottom: 10px;
        height: 165px;
        overflow: hidden;
        padding-top: 10px;
    }

    #lp .present ul li figure:before,
    #profile .present ul li figure:before {
        border-width: 62px 75px 0 0;
    }

    #lp .present ul li figure .num {
        top: 5px;
        left: 5px;
        font-size: 1.5rem;
    }

    #profile .present ul li figure .num {
        top: 2px;
        left: 2px;
        font-size: 1.5rem;
    }

    #lp .present ul li figure .num span,
    #profile .present ul li figure .num span {
        font-size: 2.4rem;
    }

    #lp .present ul li figure img,
    #profile .present ul li figure img {
        max-height: 85%;
        max-width: 85%;
    }

    #lp .present ul li p,
    #profile .present ul li p {
        font-size: 1.5rem;
    }

    #lp .notes p,
    #error .notes p {
        margin-bottom: 3px;
    }

    #lp .notes li,
    #error .notes li {
        text-indent: -2rem;
        padding-left: 2rem;
    }

    #lp .fixed-area {
        padding-bottom: 15px;
        margin: -10px auto 0;
        padding-top: 0;
    }

    #lp .fixed-area button.cvbtn {
        margin-top: 0;
    }

    #lp .fixed-area .agree {
        font-size: 1.2rem;
        margin: 10px 0 4px;
        letter-spacing: 0;
    }

    #lp .fixed-area .agree a:hover {
        color: #ee9933;
    }


    #error .reselect {
        width: 100%;
        margin: 20px auto 0;
    }

    #error .select-wrap:before,
    #accordion .select-wrap:before,
    #complete .select-wrap:before {
        width: 110px;
        height: 110px;
        top: -73px;
        left: 60px;
    }

    .otherEnq p:after {
        content: '';
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 15px 10px 0 10px;
        border-color: #e4f2ff transparent transparent transparent;
        position: absolute;
        bottom: -20px;
        left: 50%;
        margin-left: -10px;
    }

    .otherEnq p {
        font-size: 1.4rem;
        border: 7px solid #e4f2ff;
        padding: 7px 25px 4px;
        line-height: 1.5;
        border-radius: 10px;
        letter-spacing: 1px;
    }

    .otherEnq a {
        text-decoration: underline;
    }

    .otherEnq span,
    .txt p.count {
        font-size: 1.8rem;
        letter-spacing: 0;
    }

    /*#accordion*/
    #accordion .select-wrap .select-title {
        font-size: 1.8rem;
        padding: 15px 20px;
        margin: -20px -20px 0;
    }

    #accordion .select-wrap .select-title:after {
        border-width: 10px 10px 0 10px;
        bottom: -10px;
        margin-left: -5px;
    }

    #accordion h5 + p {
        text-align: right;
        margin: 15px 0 -25px;
        font-size: 1.3rem;
    }

    #accordion h5 + p span {
        font-size: 1.8rem;
    }

    #accordion .accordion {
        margin-top: 24px;
    }

    #accordion .select-wrap ul.next li a {
        padding-left: 50px;
    }

    #accordion .select-wrap ul.next li a:after {
        right: 15px;
    }

    #accordion .select-wrap ul.next li a.money:before,
    #accordion .select-wrap ul.next li a.time:before,
    #accordion .select-wrap ul.next li a.business:before,
    #accordion .select-wrap ul.next li a.culture:before,
    #accordion .select-wrap ul.next li a.female:before,
    #accordion .select-wrap ul.next li a.manager:before,
    #accordion .select-wrap ul.next li a.reason:before,
    #accordion .select-wrap ul.next li a.strength:before,
    #accordion .select-wrap ul.next li a.system:before,
    #accordion .select-wrap ul.next li a.walfare:before,
    #accordion .select-wrap ul.next li a.work:before,
    .select-wrap ul li a.money:before,
    .select-wrap ul li a.time:before,
    .select-wrap ul li a.business:before,
    .select-wrap ul li a.culture:before,
    .select-wrap ul li a.female:before,
    .select-wrap ul li a.manager:before,
    .select-wrap ul li a.reason:before,
    .select-wrap ul li a.strength:before,
    .select-wrap ul li a.system:before,
    .select-wrap ul li a.walfare:before,
    .select-wrap ul li a.work:before {
        width: 22px;
        height: 22px;
        top: 50%;
        left: 20px;
        margin-top: -13px;
    }

    #accordion .fixed-area:before {
        left: 50%;
        margin-left: -360px;
        width: 105px;
        height: 81px;
        top: 6px;
    }

    /*#kuchikomi*/
    .answer > p {
        font-size: 1.4rem;
        line-height: 1.5;
        margin-bottom: 10px;
    }

    .example {
        margin-bottom: 20px;
        margin-top: -20px;
    }

    .example:before {
        top: 2px;
    }

    .answer div {
        margin-bottom: 10px;
    }

    .short {
        width: 340px;
        float: left;
    }

    .short:nth-child(2n) {
        float: right;
    }

    .answer > div h5 {
        font-size: 1.4rem;
        background: url(../img/ico_pencil.png) 7px 6px no-repeat;
        background-size: 13px;
        font-weight: bold;
        padding: 5px 8px 5px 25px;
    }

    .answer textarea {
        height: 120px;
    }

    .count-wrap {
        display: flex;
        justify-content: flex-end;
        flex-wrap: wrap;
    }

    .cnt {
        font-size: 1.3rem;
    }

    .cntValid {
        font-size: 1.3rem;
        float: right;
        margin-right: 10px;
    }

    .answer .good input {
        border: 3px solid #f56b6b;
    }

    .answer .bad input {
        border: 3px solid #48a7ff;
    }

    .answer .neither input {
        border: 3px solid #ddbb66;
    }

    #kuchikomi .fixed-area {
        position: relative;
        background: #fff;
        width: 736px;
        margin: 0 auto;
    }

    #accordion .fixed-area:after {
        content: '';
        background: none;
    }

    .fixed-area .txt {
        background: none;
        display: inline-block;
        vertical-align: middle;
        width: 150px;
        margin: 0 20px 0 0;
        padding: 4px 0;
        border-top: none;
        font-size: 1.2rem;
        font-weight: bold;
        position: relative;
        top: 12px;
        text-align: center;
    }

    .fixed-area .txt p {
        font-size: 1.5rem;
        color: #fff;
        line-height: 27px;
    }

    .fixed-area .txt p span {
        font-size: 2rem;
        text-shadow: #fff 2px 0 0, #fff -2px 0 0,
        #fff 0 -2px 0, #fff 0 2px 0,
        #fff 2px 2px 0, #fff -2px 2px 0,
        #fff 2px -2px 0, #fff -2px -2px 0,
        #fff 1px 2px 0, #fff -1px 2px 0,
        #fff 1px -2px 0, #fff -1px -2px 0,
        #fff 2px 1px 0, #fff -2px 1px 0,
        #fff 2px -1px 0, #fff -2px -1px 0,
        #fff 1px 1px 0, #fff -1px 1px 0,
        #fff 1px -1px 0, #fff -1px -1px 0;
    }

    .txt p.count {
        font-size: 1.8rem;
        line-height: 2;
    }

    .txt p.count span {
        margin: 0 6px 5px 0;
        display: inline-block;
        line-height: 100%;

    }

    .txt p.count span:after {
        width: 26px;
        height: 26px;
        margin: 0 5px 0;
        left: -4px;
        bottom: -3px;
    }

    .fixed-area button.cvbtn {
        display: inline-block;
        margin: 15px auto 1px;
        vertical-align: middle;
        line-height: 21px;
    }

    /*#company-data*/
    #company-data .styledSelectBox {
        width: 35%;
    }

    #company-data .customSelect {
        width: 35%;
        height: 57px;
        padding-top: 20px;
    }

    #company-data .customSelect:after {
        left: 30%;
        top: 55px;
    }


    /*#company-name*/
    #company-name .refine p {
        font-size: 1.4rem;
        line-height: 1.4;
    }

    #company-name .empty {
        font-size: 1.4rem;
    }

    #company-name p.notfound a {
        border: 3px solid #b4b4b4;
        padding: 15px 48px;
        font-size: 1.4rem;
        margin-top: 20px;
    }

    #company-name p.notfound a:hover {
        background-color: #b4b4b4;
        color: #fff;
        border: 3px solid #b4b4b4;
        padding: 15px 48px;
        font-size: 1.4rem;
        margin-top: 20px;
    }

    #company-name p.notfound a:after {
        right: 14px;
        top: 14px;
    }

    #company-name p.notfound a:hover:after {
        color: #fff;
    }

    /*#name-confirm*/
    #name-confirm .select-wrap ul.nolink li a:hover {
        color: #ee9933;
    }

    /*#retire-year*/
    #retire-year h2 {
        margin-bottom: 31px;
    }

    /* #profile */
    .input-area li.sex {
        margin-bottom: 40px;
    }

    #profile .enqTtl {
        font-size: 3rem;
        background: url('../img/bg_ttl.png') repeat 0 top;
    }

    #profile form button.cvbtn,
    #profile .nextbtn a {
        /*margin: 10px auto;*/
    }

    /* --- campaignArea --- */
    #profile .campaignArea {
        width: 736px;
        margin: 0 auto;
    }

    #profile .campaignArea img {
        width: 500px;
    }

    /*#complete*/
    #complete #content-wrap {
        margin-top: 20px;
    }

    #complete h5 + p img {
        width: 200px;
        height: auto;
        text-align: center;
        margin-bottom: 14px;
    }

    #complete h5 + p + p {
        margin-bottom: -30px;
        text-align: center;
    }

    #complete .reselect {
        margin: 20px auto 0;
        width: 300px;
    }

    #complete .otherEnq {
        margin-top: 80px;
    }

    #complete .select-wrap ul.next li a {
        padding: 15px 20px;
    }
}