@charset "utf-8";

/** |READ ME| **********************************************************************************************************

"Crosstalk"

Cascading Style Sheet Setting File

Ver.20240111

------------------------------------------------------------------------------------------------------------------------

/** | Index | ***************************************************************************************** **/

.crs-mai{
    padding:240px 0 120px;
}
.crs-con{
    padding:0 0 240px;
}
.crs-con-box {
    display:flex;
    justify-content:space-between;
    text-align:left;
}
.crs-con-box + .crs-con-box {
    margin-top:140px;
}
.crs-con-t-box {
    width:35%;
}
.crs-con-i-box {
    width:60%;
}
.crs-con-i-box img {
    display:block;
    width:100%;
}
.crs-con-box-pc-od01 {
    order:1;
}
.crs-con-box-pc-od02 {
    order:2;
}
.crs-con-box-no {
    font-size:70px;
    font-family:'Poppins', sans-serif;
    font-weight:700;
    line-height:1;
    color:#F03;
}
.crs-con-box-ttl {
    line-height:1;
}
.crs-con-box-ttl b {
    display:block;
    font-size:26px;
    margin:40px 0 10px;
}
.crs-con-box-ttl small {
    display:block;
    font-size:16px;
}
.crs-con-box-txt {
    text-align:left;
    line-height:2.2;
    margin:40px 0 30px;
}
.crs-con-btn-wrap {
    width:150px;
}
@media (max-width:640px){
    .crs-mai{
        padding:15% 0;
    }
    .crs-con{
        padding:0 0 20%;
    }
    .crs-con-box {
        display:flex;
        flex-wrap:wrap;
        position:relative;
    }
    .crs-con-box + .crs-con-box {
        margin-top:25%;
    }
    .crs-con-t-box {
        width:100%;
        box-sizing:border-box;
        padding:0 20px;
    }
    .crs-con-i-box {
        width:100%;
    }
    .crs-con-box-sp-od01 {
        order:1;
    }
    .crs-con-box-sp-od02 {
        order:2;
    }
    .crs-con-box-no {
        font-size:50px;
        position:absolute;
        top:0;
        right:20px;
        transform:translateY(-50%);
    }
    .crs-con-box-ttl {
        line-height:1;
    }
    .crs-con-box-ttl b {
        margin:30px 0 15px;
        font-size: 22px;
    }
    .crs-con-box-ttl small {
        font-size:15px;
    }
    .crs-con-box-txt {
        margin:20px 0 15px;
    }
    .crs-con-btn-wrap {
        width:100%;
    }
}

/** | Page | ***************************************************************************************** **/

.crs-und-mai-bg-wrap {
    position:relative;
    z-index:0;
    overflow:hidden;
}
.crs-und-mai-bg {
    width:100%;
    animation:zoomIn 1.5s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}
@keyframes zoomIn {
  0% {
    transform:scale(1.2);
    opacity:0;
  }
  100% {
    opacity:1;
    transform:scale(1);
  }
}
.crs-und-mai-bg img {
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
}
.crs-und-mai-box {
    max-width:900px;
    box-sizing:border-box;
    padding:40px 20px 0;
    text-align:center;
    background:#fff;
    margin:auto;
    transform:translateY(-80px);
}
.crs-und-mai-ttl {
    text-align:center;
    line-height:1;
}
.crs-und-mai-ttl-en {
    display:block;
    font-family:'Poppins', sans-serif;
    font-size:22px;
    font-weight:700;
    color:#F03;
}
.crs-und-mai-ttl-jp {
    display:block;
    margin-top:40px;
    font-size:38px;
    font-weight:bold;
}
.crs-und-mai-int {
    font-size:18px;
    color:#999;
    margin-top:20px;
}
.crs-und-mai-txt {
    margin-top:50px;
    text-align:center;
    font-size:18px;
    line-height:2.2;
    font-weight:bold;
}
.crs-und-mem01-inn {
    padding:0 20px 0;
    box-sizing:border-box;
    margin:auto;
    max-width:1140px;
}
.crs-und-ttl {
    position:relative;
    font-family:'Poppins', sans-serif;
    font-weight:700;
    font-size:30px;
    text-align:left;
    padding-left:30px;
    color:#F03;
    max-width: 1100px;
    margin: auto;
}
.crs-und-ttl::before {
    content:"";
    display:block;
    position:absolute;
    top:50%;
    left:0;
    width:12px;
    height:4px;
    background:#FF0033;
    transform:translateY(-50%);
}
.crs-und-mem01-list {
    display:flex;
    justify-content:space-between;
    padding:60px 0 120px;
    max-width: 1100px;
    margin: auto;
}
.crs-und-mem01-list li {
    width:calc(25% - 15px);
    text-align:center;
}
.crs-und-mem01-list li img {
    display:block;
    width:100%;
    border-radius:10px;
}
.crs-und-mem01-pos {
    line-height:1;
    font-size:18px;
    margin-top:15px;
}
.crs-und-mem01-name {
    line-height:1;
    margin:10px 0;
}
.crs-und-mem01-loca {
    line-height:1;
    color:#999;
}
.crs-und-mem02-list {
    display:flex;
    justify-content:space-between;
    padding:60px 0 120px;
    max-width: 1100px;
    margin: auto;
}
.crs-und-mem02-list li {
    width:27.5%;
    text-align:center;
}
.crs-und-mem02-list li img {
    display:block;
    width:100%;
    border-radius:10px;
}
.crs-und-mem02-pos {
    line-height:1;
    font-size:18px;
    margin-top:15px;
}
.crs-und-mem02-name {
    line-height:1;
    margin:10px 0;
}
.crs-und-mem02-loca {
    line-height:1;
    color:#999;
}
.crs-und-tlk-inn {
    padding:0 20px 0;
    box-sizing:border-box;
    margin:auto;
    max-width:1140px;
}
.crs-und-tlk-t-box-ttl {
    position:relative;
    font-size:18px;
    font-weight:bold;
    text-align:left;
    padding-left:80px;
}
.crs-und-tlk-t-box-ttl::before {
    content:"";
    display:block;
    position:absolute;
    top:50%;
    left:0;
    width:60px;
    height:2px;
    background:#333333;
}
.crs-und-tlk-t-box {
    max-width: 960px;
    margin: 60px auto;
}
.crs-und-tlk-t-box dl {
    display:flex;
    justify-content:space-between;
    flex-wrap:wrap;
}
.crs-und-tlk-i-box {
    width:100%;
    margin:120px auto;
}
.crs-und-tlk-i-box img {
    display:block;
    width:100%;
}
.crs-und-tlk-icon {
    width:70px;
    margin-top:50px;
}
.crs-und-tlk-icon img {
    display:block;
    width:100%;
}
.crs-und-tlk-name {
    text-align:center;
    font-size:12px;
    margin-top:10px;
}
.crs-und-tlk-fullmem {
    text-align:center;
    font-size:18px;
    font-weight:bold;
    line-height:70px;
}
.crs-und-tlk-txt {
    margin-top:50px;
    width:calc(100% - 70px);
    font-size:16px;
    line-height:2;
    text-align:left;
    padding:10px 0 0 50px;
    box-sizing:border-box;
}
.crs-und-con {
    border-top:1px solid #DDDDDD;
    padding:120px 0;

}
.crs-und-con .crs-und-ttl {
    margin:0 0 60px;
}
@media (max-width:640px){
    .crs-und-mai-bg {
        height:700px;
        width:100%;
    }
    .crs-und-mai-bg.crs-und-mai-bg01 {
        background:url(/recruit/newgraduate/img/crosstalk/01/crs-und-mai-sp.jpg)no-repeat center top;
        background-size:cover;
        height:0;
        padding-top:93.33%;
    }
    .crs-und-mai-bg.crs-und-mai-bg02 {
        background:url(/recruit/newgraduate/img/crosstalk/02/crs-und-mai-sp.jpg)no-repeat center top;
        background-size:cover;
        height:0;
        padding-top:93.33%;
    }
    .crs-und-mai-box {
        padding:10% 20px 15%;
        width:100%;
        transform:none;
    }
    .crs-und-mai-ttl {
        text-align:center;
        line-height:1;
    }
    .crs-und-mai-ttl-en {
        display:block;
        color:#F03;
        font-size:16px;
        font-weight:bold;
    }
    .crs-und-mai-ttl-jp {
        margin-top:20px;
        font-size:25px;
    }
    .crs-und-mai-int {
        font-size:14px;
        margin-top:10px;
    }
    .crs-und-mai-txt {
        text-align:left;
        font-size:15px;
        margin-top:5%;
    }
    .crs-und-mem01-inn {
        padding:0 20px 0;
        box-sizing:border-box;
        margin:auto;
        max-width:1140px;
    }
    .crs-und-ttl {
        font-size:4vw;
        padding-left:22px;
    }
    .crs-und-ttl::before{
        height:2px;
    }
    .crs-und-mem01-list {
        display:flex;
        justify-content:space-between;
        flex-wrap:wrap;
        padding:10% 0 20%;
    }
    .crs-und-mem01-list li {
        width:calc(50% - 5px);
        text-align:center;
        margin-bottom:7%;
    }
    .crs-und-mem01-list li:nth-last-child(2){
        margin-bottom:0;
    }
    .crs-und-mem01-list li:nth-last-child(1){
        margin-bottom:0;
    }
    .crs-und-mem01-list li img {
        display:block;
        width:100%;
        border-radius:10px;
    }
    .crs-und-mem01-pos {
        line-height:1;
        font-size:14px;
        margin-top:10px;
    }
    .crs-und-mem01-name {
        line-height:1;
        margin: 5px 0 10px;
        font-size: 12px;
    }
    .crs-und-mem01-loca {
        line-height:1;
        color:#999;
        font-size: 12px;
    }
    .crs-und-mem02-list {
    display:flex;
    justify-content:space-between;
    flex-wrap: wrap;
    padding:10% 0 20%;
    margin: auto;
}
.crs-und-mem02-list li {
    width:calc(50% - 5px);
    text-align:center;
    margin-bottom:7%;
}
.crs-und-mem02-list li:nth-child(3) {
    margin: auto;
    }
.crs-und-mem02-list li img {
        display:block;
        width:100%;
        border-radius:10px;
    }
    .crs-und-mem02-pos {
        line-height:1;
        font-size:14px;
        margin-top:10px;
    }
    .crs-und-mem02-name {
        line-height:1;
        margin: 5px 0 10px;
        font-size: 12px;
    }
    .crs-und-mem02-loca {
        line-height:1;
        color:#999;
        font-size: 12px;
        white-space: nowrap;
    }
    .crs-und-tlk-t-box-ttl {
        padding-left:40px;
    }
    .crs-und-tlk-t-box-ttl::before {
        width:30px;
        top: 13px;
    }
    .crs-und-tlk-t-box {
        padding:0;
    }
    .crs-und-tlk-i-box {
        width:100%;
        margin:10% auto;
    }
    .crs-und-tlk-icon {
        width:50px;
        margin-top:30px;
    }
    .crs-und-tlk-icon img {
        display:block;
        width:100%;
    }
    .crs-und-tlk-txt {
        margin-top:30px;
        width:calc(100% - 50px);
        padding:0 0 0 20px;
    }
    .crs-und-con{
        padding:15% 0;
    }
    .crs-und-con .crs-und-ttl {
        margin:0 0 10%;
    }
}
