@charset "utf-8";

#assistanceWrap a.princess_square{
    text-decoration: underline;
}
.red{
    color: #D2505F;
    }
/*------------------------------
assistance common PC
------------------------------*/
@media screen and (min-width: 641px) {
    #assistanceWrap{
        background-image: url(../../common/img/bg_pc.gif); 
        background-position: center center; 
        background-repeat: repeat-y;
        background-attachment: fixed;
        padding-bottom: 100px;
    }
    #assistanceWrap .assistanceBox{
        border: 1px solid #000000;
        padding-top: 20px;
        padding-bottom: 20px;
        width: 80%;
        margin-right: auto;
        margin-left: auto;
        margin-bottom: 25px;
        text-align: center;
        line-height: 2;
        font-size: 1.3rem;
    }
    #assistanceWrap .assistanceBox p{
        padding-bottom: 0;
    }
}
/*------------------------------
assistance common SP
------------------------------*/
@media screen and (max-width: 640px) {
    #assistanceWrap{
        background-image: url(../../common/img/bg_pc.gif); 
        background-position: center center; 
        background-repeat: repeat-y;
        background-attachment: fixed;
        padding-bottom: 5vw;
    }
    #assistanceWrap .assistanceBox{
        border: 1px solid #000000;
        padding-top: 2vw;
        padding-bottom: 3vw;
        width: 90%;
        margin-right: auto;
        margin-left: auto;
        margin-bottom: 3vw;
        text-align: center;
        line-height: 2;
        font-size: 3.2vw;
    }
    #assistanceWrap .assistanceBox p{
        padding-bottom: 0.5em;
    }
    #assistanceWrap .assistanceBox ul{
        padding-right: 5%;
        padding-left: 5%;
    }
    #assistanceWrap .assistanceBox li{
        text-align: left;
        line-height: 1.8;
        padding-left: 1em;
        text-indent: -1em
    }
}
/*------------------------------
assistance section01 PC
------------------------------*/
@media screen and (min-width: 641px) {
    #assistance_section01{
        width: 1000px;
        margin-right: auto;
        margin-left: auto;
        margin-bottom: 50px;
        background-image: url(../img/assistance_ph01_pc.jpg);
        background-size: 1000px 424px;
        background-repeat: no-repeat;
        width: 1000px;
        padding-top: 255px;
    }
    #assistance_section01 .assistance_section01_block{
        background: rgba(255,255,255,0.95);
        width: 890px;
        margin-right: auto;
        margin-left: auto;
        padding-top: 40px;
        padding-bottom: 40px;
        text-align: center;
    }
    .assistance_section01_block h1{
        font-size: 2.0rem;
        font-weight: 700;
        letter-spacing: 0.2rem;
        border-bottom: 1px solid #686868;
        display: inline;
	    padding-bottom: 0.5em;
        line-height: 70px;
    }
    .assistance_section01_block p{
        line-height: 3.0rem;
        font-size: 1.3rem;
        letter-spacing: 0.1rem;
        padding-bottom: 1em;
    }
    .assistance_section01_block p.assistance_section01_txt{
        padding-bottom: 0;
        margin-top: 20px;
    }
    .assistance_section01_block .formButton{
        margin-top: 0;
        margin-bottom: 0;
    }
}
/*------------------------------
assistance section01 SP
------------------------------*/
@media screen and (max-width: 640px) {
    #assistance_section01{
        width: 100%;
        margin-right: auto;
        margin-left: auto;
        margin-bottom: 10vw;
        background-image: url(../img/assistance_ph01_sp.jpg);
        background-size: 100%;
        background-repeat: no-repeat;
        padding-top: 20vw;
    }
    #assistance_section01 .assistance_section01_block{
        background: rgba(255,255,255,0.95);
        width: 90%;
        margin-right: auto;
        margin-left: auto;
        padding-top: 5vw;
        padding-bottom: 5vw;
        text-align: center;
    }
    .assistance_section01_block h1{
        font-size: 4vw;
        font-weight: 700;
        letter-spacing: 0.2rem;
        border-bottom: 1px solid #686868;
        display: inline;
	    padding-bottom: 0.5em;
        line-height: 3;
    }
    .assistance_section01_block p{
        line-height: 1.8;
        font-size: 3.4vw;
        margin-top: 2vw;
        padding-bottom: 1em;
    }
    .assistance_section01_block p.assistance_section01_txt{
        padding-bottom: 0.5em;
    }
    .assistance_section01_block .formButton{
        margin-top: 0;
        margin-bottom: 0;
    }
}
/*------------------------------
assistance section02 PC
------------------------------*/
@media screen and (min-width: 641px) {
    #assistance_section02{
        width: 1000px;
        margin-right: auto;
        margin-left: auto;
        margin-bottom: 50px;
        background-image: url(../img/assistance_ph02_pc.jpg);
        background-size: 570px 506px;
        background-repeat: no-repeat;
        width: 670px;
        padding-top: 50px;
        padding-left: 330px;
    }
    #assistance_section02 .assistance_section02_block{
        background: rgba(255,255,255,0.95);
        width: 670px;
        margin-right: auto;
        margin-left: auto;
        padding-top: 40px;
        padding-bottom: 40px;
        text-align: center;
    }
    .assistance_section02_block h2{
        font-size: 2.0rem;
        font-weight: 700;
        letter-spacing: 0.2rem;
        border-bottom: 1px solid #686868;
        display: inline;
	    padding-bottom: 0.5em;
        line-height: 70px;
    }
    .assistance_section02_block p{
        line-height: 3.0rem;
        font-size: 1.3rem;
        letter-spacing: 0.1rem;
        padding-bottom: 1em;
    }
}
/*------------------------------
environment section02 SP
------------------------------*/
@media screen and (max-width: 640px) {
    #assistance_section02{
        width: 100%;
        margin-right: auto;
        margin-left: auto;
        margin-bottom: 10vw;
        background-image: url(../img/assistance_ph02_sp.jpg);
        background-size: 100%;
        background-repeat: no-repeat;
        padding-top: 10vw;
        padding-bottom: 5vw;
    }
    #assistance_section02 .assistance_section02_block{
        background: rgba(255,255,255,0.95);
        width: 90%;
        margin-right: auto;
        margin-left: auto;
        padding-top: 5vw;
        padding-bottom: 5vw;
        text-align: center;
    }
    .assistance_section02_block h2{
        font-size: 4vw;
        font-weight: 700;
        letter-spacing: 0.2rem;
        line-height: 1.4;
        padding-bottom: 3vw;
    }
    .assistance_section02_block h2 span{
        border-bottom: 1px solid #686868;
        display: inline;
	    padding-bottom: 0.5em;
    }
    .assistance_section02_block p{
        line-height: 1.8;
        font-size: 3.4vw;
        margin-top: 2vw;
        padding-bottom: 1em;
    }
    .assistance_section02_block p.assistance_section02_txt{
        padding-bottom: 0.5em;
    }
}
/*------------------------------
assistance section03 PC
------------------------------*/
@media screen and (min-width: 641px) {
    #assistance_section03{
        width: 1000px;
        margin-right: auto;
        margin-left: auto;
        margin-bottom: 50px;
        background: rgba(255,255,255,0.95);
        text-align: center;
        padding-top: 40px;
        padding-bottom: 50px;
    }
    #assistance_section03 h2{
        font-size: 2.0rem;
        font-weight: 700;
        letter-spacing: 0.2rem;
        border-bottom: 1px solid #686868;
        display: inline;
	    padding-bottom: 0.5em;
        line-height: 70px;
    }
    #assistance_section03 p{
        line-height: 3.0rem;
        font-size: 1.3rem;
        letter-spacing: 0.1rem;
    }
    .assistance_ph03_ph{
        padding-top: 2em;
    }
    .assistance_section03_txt{
        padding-bottom: 3em;
        line-height: 1;
    }
    .princess_square_logo{
        padding-top: 20px;
    }
}
/*------------------------------
assistance section03 SP
------------------------------*/
@media screen and (max-width: 640px) {
    #assistance_section03{
        width: 90%;
        margin-right: auto;
        margin-left: auto;
        margin-bottom: 10vw;
        background: rgba(255,255,255,0.95);
        text-align: center;
        padding-top: 2vw;
        padding-bottom: 5vw;
    }
    #assistance_section03 h2{
        font-size: 4vw;
        font-weight: 700;
        letter-spacing: 0.2rem;
        border-bottom: 1px solid #686868;
        display: inline;
	    padding-bottom: 0.5em;
        line-height: 70px;
        padding-left: 3em;
        padding-right: 3em;
    }
    #assistance_section03 p{
        line-height: 1.6;
        font-size: 3.4vw;
    }
    .assistance_ph03_ph{
        padding-top: 2em;
        width: 90%;
        margin-right: auto;
        margin-left: auto;
    }
    .assistance_section03_txt{
        padding-bottom: 2em;
        line-height: 1;
    }
    .princess_square_logo{
        width: 55%;
        margin-right: auto;
        margin-left: auto;
        padding-top: 5vw;
    }
}
/*------------------------------
environment bg_black PC
------------------------------*/
@media screen and (min-width: 641px) {
    .bg_black{
        padding-top: 60px;
        padding-bottom: 60px;
    }
    #interviewWrap{
        width: 1000px;
        margin-right: auto;
        margin-left: auto;
    }
    #interviewWrap h2{
        font-size: 1.9rem;
        font-weight: 700;
        letter-spacing: 2px;
        line-height: 70px;
        text-align: center;
        color: #FFFFFF;
    }
    #interviewWrap h2:before {
        content: ' ＼ ';
    }
    #interviewWrap h2:after {
        content: ' ／ ';
    }
    #interviewWrap .interviewBlock{
        width: 250px;
        margin-right: 50px;
        position: relative;
        display: inline-block;
        margin-bottom: 50px;
    }
    #interviewWrap .interviewBlock a{
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        text-indent:-999px;
    }
    #interviewWrap .interviewBlock a:hover{
        opacity: 0.1;
        background-color: #FFFFFF;
    }
    #interviewWrap .interviewBlock:nth-of-type(3){
        margin-right: 0;
    }
    #interviewWrap .interviewBlock .imgPhoto{
        border: 4px solid #FFFFFF;
        font-size: 0;
    }
    #interviewWrap .interviewBlock .imgPhoto img{
        width: 100%;
        height: auto;
    }
    #interviewWrap .interviewBlock dl{
        background: #FFFFFF;
        width: 230px;
        margin-left: 10px;
        font-size: 1.2rem;
        padding-top: 15px;
        padding-bottom: 15px;
    }
    #interviewWrap .interviewBlock dd{
        color: #000000;
        padding-right: 15px;
        padding-left: 15px;
    }
    
    #interviewWrap .interviewBlock .interviewTit{
        text-align: center;
        margin-bottom: 10px;
        color: #000000;
    }
    #interviewWrap .interviewBlock .col01{
        background: #BD703B;
        padding-right: 20px;
        padding-left: 20px;
        color: #FFFFFF;
    }
    #interviewWrap .interviewBlock .col02{
        background: #666DB2;
        padding-right: 5px;
        padding-left: 5px;
        color: #FFFFFF;
    }
    #interviewWrap .interviewBlock .col03{
        background: #CF446D;
        padding-right: 5px;
        padding-left: 5px;
        color: #FFFFFF;
    }
    #interviewWrap .interviewBlock .col04{
        background: #53B87A;
        padding-right: 20px;
        padding-left: 20px;
        color: #FFFFFF;
    }
    #interviewWrap .formButton{
        border: solid 5px #D2505F;
        outline: solid 1px #FFFFFF;
        width: 305px;
        margin-top: 10px;
        margin-bottom: 5px;
        margin-right: auto;
        margin-left: auto;
        line-height: 42px;
        text-align: center;
        font-size: 1.6rem;
    }
    #interviewWrap .formButton a{
        display: block;
        color: #D2505F;
        background: #FFFFFF;
        -webkit-transition: 0.8s;
        -moz-transition: 0.8s;
        -o-transition: 0.8s;
        -ms-transition: 0.8s;
        transition: 0.8s;
    }
    #interviewWrap .formButton a:hover{
        color: #FFFFFF;
        background: #D2505F;
    }
    #interviewWrap .formButtonTxt{
        font-size: 1.2rem;
        color: #FFFFFF;
    }
    #interviewWrap .interviewMtxt{
        font-size: 1.8rem;
        font-weight: 700;
        letter-spacing: 0.3em;
        text-indent: -0.3em;
        color: #FFFFFF;
        padding-bottom: 1em;
    }
    #interviewWrap .interviewMtxt span{
        color: #F5E27A;
    }
}
/*------------------------------
environment bg_black SP
------------------------------*/
@media screen and (max-width: 640px) {
    .bg_black{
        padding-top: 5vw;
        padding-bottom: 10vw;
        padding-right: 5%;
        padding-left: 5%;
        width: 90%;
    }
    #interviewWrap{
        font-size: 0;
    }
    #interviewWrap h2{
        font-size: 4.5vw;
        font-weight: 700;
        letter-spacing: 1px;
        line-height: 70px;
        text-align: center;
        color: #FFFFFF;
    }
    #interviewWrap h2:before {
        content: ' ＼ ';
    }
    #interviewWrap h2:after {
        content: ' ／ ';
    }
    #interviewWrap .interviewBlock{
        width: 98%;
        position: relative;
        margin-bottom: 5vw;
        border: 4px solid #FFFFFF;
        background: #FFFFFF;
    }
    #interviewWrap .interviewBlock a{
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        text-indent:-999px;
    }
    #interviewWrap .interviewBlock a:hover{
        opacity: 0.1;
        background-color: #FFFFFF;
    }
    #interviewWrap .interviewBlock .imgPhoto{
        width: 30%;
        font-size: 0;
        display: inline-block;
        margin-right: 2%;
    }
    #interviewWrap .interviewBlock dl{
        display: inline-block;
        background: #FFFFFF;
        width: 68%;
        font-size: 3.4vw;
        vertical-align: top;
        margin-top: 3vw;
    }
    #interviewWrap .interviewBlock dd{
        color: #000000;
        padding-left: 4%;
    }
    #interviewWrap .interviewBlock .interviewTit{
        text-align: center;
        margin-bottom: 3vw;
        color: #000000;
    }
    #interviewWrap .interviewBlock .col01{
        background: #BD703B;
        padding-right: 20px;
        padding-left: 20px;
        color: #FFFFFF;
    }
    #interviewWrap .interviewBlock .col02{
        background: #666DB2;
        padding-right: 5px;
        padding-left: 5px;
        color: #FFFFFF;
    }
    #interviewWrap .interviewBlock .col03{
        background: #CF446D;
        padding-right: 5px;
        padding-left: 5px;
        color: #FFFFFF;
    }
    #interviewWrap .interviewBlock .col04{
        background: #53B87A;
        padding-right: 20px;
        padding-left: 20px;
        color: #FFFFFF;
    }
    #interviewWrap .formButton{
        border: solid 5px #D2505F;
        outline: solid 1px #FFFFFF;
        width: 90%;
        margin-top: 5vw;
        margin-bottom: 3vw;
        margin-right: auto;
        margin-left: auto;
        line-height: 3;
        font-size: 4vw;
    }
    #interviewWrap .formButton a{
        display: block;
        color: #D2505F;
        background: #FFFFFF;
        -webkit-transition: 0.8s;
        -moz-transition: 0.8s;
        -o-transition: 0.8s;
        -ms-transition: 0.8s;
        transition: 0.8s;
    }
    #interviewWrap .formButton a:hover{
        color: #FFFFFF;
        background: #D2505F;
    }
    #interviewWrap .interviewMtxt{
        font-size: 4vw;
        font-weight: 700;
        letter-spacing: 0.1em;
        text-indent: -0.1em;
        color: #FFFFFF;
    }
    #interviewWrap .interviewMtxt span{
        color: #F5E27A;
        display: block;
    }
    #interviewWrap .formButtonTxt{
        font-size: 2.8vw;
        color: #FFFFFF;
    }
}