@charset "UTF-8";
/* CSS Document */

@keyframes txtloop {
0% {
transform: translateX(100%);
}
to {
transform: translateX(-100%);
}
}

@keyframes txtloop2 {
0% {
transform: translateX(0);
}
to {
transform: translateX(-200%);
}
}

@keyframes zoomUp {
0% {
transform: scale(1.1);
}
100% {
transform: scale(1.4); /* 拡大率 */
}
}


/*PC*/
@media print, screen and (min-width: 769px) {

/*fv
---------------------------------*/
#fv{
position: relative;
width: 100%;
padding: 240px 10% 80px;
box-sizing: border-box;
}

#fv .fv_ttl{
font-size:60px;
font-weight: 700;
letter-spacing: .13rem;
line-height: 1;
margin-bottom: 30px;
}

#fv .fv_ttl2{
font-size:30px;
font-weight: 800;
letter-spacing: .1rem;
line-height: 1;
margin: 0 0 40px;
}

#fv .fv_txt{
font-weight: 700;
}

#fv .fv_txt span{
font-size:20px;
font-weight: 800;
}

/*mv
---------------------------------*/
#mv{
width: 100%;
height: auto;
aspect-ratio: 16/8;
position: relative;
}

#mv .move {
width:100%;
height:100%;
position:absolute;
top:0;
left:0;
mask-image:url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox=" 0 0 1675 1675" width="100%" preserveAspectRatio="xMidYMid slice" fill="none"><circle cx="837.5" cy="837.5" r="837.5" fill="black" /></svg>');
mask-position:top center;
mask-origin:top center;
mask-repeat:no-repeat;
mask-size:1000%;
}

#mv .move video {
display: block;
width: 100%;
margin: 0 auto;
object-fit: cover;
position: relative;
}


/*fv2
---------------------------------*/
#fv2{
position: relative;
width: 100%;
margin: 0 auto;
overflow: hidden;
}

#fv2 article{
position:absolute;
top: -10px;
left: 0;
overflow: hidden;
z-index: -1;
}
#fv2 .loop_wrap {
display: flex;
width: 100%;
overflow: hidden;
margin: 0 auto 0;
padding:60px 0 50px;
box-sizing: border-box;
background:-webkit-linear-gradient(123deg, #2C2826 50%, #2C2826 72.32%, #B99568 96.735%);
}

#fv2 .loop_wrap div {
flex: 0 0 auto;
white-space: nowrap;
font-size: 1.6rem;
font-weight:900;
line-height:1;
overflow: hidden;
color: #FFF;
}

#fv2 .loop_wrap div:nth-child(odd) {
animation: txtloop 70s -35s linear infinite;
}

#fv2 .loop_wrap div:nth-child(even) {
animation: txtloop2 70s linear infinite;
}

#fv2 .fv2_list{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding: 126px 0 0;
box-sizing: border-box;
border-bottom: 1px solid #af9b55;
position: relative;
}

#fv2 .fv2_list li{
width: 20%;
padding:1.4% 1.2% 1%;
box-sizing: border-box;
font-size: 1rem;
font-weight: 900;
line-height: 1.2;
border-right: 1px solid #af9b55;
text-align: center;
color: #121212;
}

#fv2 .fv2_list li:last-child{
border-right:none;
}

/*works
---------------------------------*/
#works{
position: relative;
width: 100%;
margin: 0 auto;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding-bottom: 80px;
box-sizing: border-box;
}

#works::before{
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 18%;
background: url("../images/com/bg_p.jpg") 0 0 repeat;
z-index: -2;
}

#works article{
position:relative;
overflow: hidden;
z-index: -1;
}

#works .loop_wrap {
display: flex;
width: 100%;
overflow: hidden;
margin:-20px auto 60px;
}

#works .loop_wrap div {
flex: 0 0 auto;
white-space: nowrap;
font-size: 10rem;
font-weight:400;
line-height:1;
overflow: hidden;
color: #af9b55;
opacity: .2;
}

#works .loop_wrap div:nth-child(odd) {
animation: txtloop 70s -35s linear infinite;
}

#works .loop_wrap div:nth-child(even) {
animation: txtloop2 70s linear infinite;
}

#works .txt_box{
width: 55%;
padding: 0 5%;
box-sizing: border-box;
}

#works .txt_box .txt{
margin-bottom: 20px;
}

#works .img{
width:45%;
overflow: hidden;
}



/*challenging
---------------------------------*/
#challenging{
position: relative;
width: 100%;
margin: 0 auto;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding:30px 0 140px;
box-sizing: border-box;
background: url("../images/com/bg_p.jpg") 0 0 repeat;
overflow: hidden;
}

#challenging article{
position:absolute;
bottom: 0;
left: 0;
overflow: hidden;
z-index: -1;
}

#challenging .loop_wrap {
display: flex;
width: 100%;
overflow: hidden;
margin:0px auto 0;
}

#challenging .loop_wrap div {
flex: 0 0 auto;
white-space: nowrap;
font-size: 7rem;
font-weight:400;
line-height:1;
overflow: hidden;
color: #af9b55;
opacity: .2;
}

#challenging .loop_wrap div:nth-child(odd) {
animation: txtloop 70s -35s linear infinite;
}

#challenging .loop_wrap div:nth-child(even) {
animation: txtloop2 70s linear infinite;
}

#challenging .challenging_list {
position: relative;
width: 100%;
z-index: 5;
}

#challenging .challenging_list li{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
flex-direction: row;
align-items: center;
margin-bottom: 60px;
position: relative;
}

#challenging .challenging_list li:last-child{
margin-bottom: 0;
}

#challenging .challenging_list li:nth-child(odd){
flex-direction: row-reverse;
}


#challenging .challenging_list li .txt_box{
width: 55%;
padding:0;
box-sizing: border-box;
}

#challenging .challenging_list li .txt_box .txt_box_inner{
padding: 0 7%;
box-sizing: border-box;
}

#challenging .challenging_list li .txt_box .txt_box_inner .c_title{
color:#af9b55;
}

#challenging .challenging_list li .txt_box .txt_box_inner .c_sub_title{
color:#af9b55;
}

#challenging .challenging_list li .txt_box .txt_box_inner .txt{
margin-bottom: 20px;
color: #FFF;
}

#challenging .challenging_list li .img{
width:45%;
overflow: hidden;
}

#challenging .challenging_list li .img img{
overflow: hidden;
}

#challenging .challenging_list li:nth-child(even) .img img{
overflow: hidden;
}


/*cherish
---------------------------------*/
#cherish{
position: relative;
width: 100%;
margin: 0 auto;
}

#cherish .hed_wrap{
border-bottom: 1px solid #CBC5C0;
padding:80px 5% 70px;
box-sizing: border-box;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

#cherish .hed_wrap .c_title{
margin-bottom: 0;
}

#cherish .cherish_list{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
border-bottom: 1px solid #CBC5C0;
}

#cherish .cherish_list li{
width: 50%;
padding: 48px 48px 40px;
box-sizing: border-box;
border-right: 1px solid #CBC5C0;
}

#cherish .cherish_list li:last-child{
border-right:none;
}

#cherish .cherish_list li .box_list{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
margin-bottom: 40px;
}

#cherish .cherish_list li .box_list .c_sub_title{
width: 55%;
margin-bottom: 0;
padding-left: 5%;
box-sizing: border-box;
}

#cherish .cherish_list li .box_list .img{
width: 45%;
}

#cherish .fot_wrap{
border-bottom: 1px solid #CBC5C0;
padding:80px 30% 70px;
box-sizing: border-box;
text-align: center;
}

#cherish .fot_wrap h4{
font-size: 1.6rem;
font-weight: 900;
line-height: 1;
margin: 0 0 20px;
}

#cherish .fot_wrap p{
margin-left: 5%;
font-weight: 900;
}



/*partner
---------------------------------*/
#partner{
background: url("../images/recruit/bg_partner.jpg") center center no-repeat;
background-size: cover;
padding: 80px 15%;
box-sizing: border-box;
position: relative;
}

#partner::before{
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0,0,0,.4);
}

#partner .section_wrap{
position: relative;
z-index: 5;
}

#partner .section_wrap .c_title{
text-align: center;
color: #FFF;
margin: 0 0 60px;
}


#partner .section_wrap .c_sub_title{
color: #FFF;
text-align: center;
}

#partner .section_wrap .txt{
font-weight: 600;
color: #FFF;
}


/*message_p
---------------------------------*/
#message_p{
position: relative;
width: 100%;
margin: 0 auto;
}

#message_p .hed_wrap{
border-bottom: 1px solid #CBC5C0;
padding:80px 5% 70px;
box-sizing: border-box;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items:center;
}

#message_p .hed_wrap .c_title{
width:calc(100% - 360px);
margin-bottom: 0;
}

#message_p .hed_wrap .com_btn{
width: 360px;
}

#message_p picture img {
width: 100%;
height: auto; /* アスペクト比を保つため */
display: block; /* 余計な余白を取り除く */
}


/*requirements
---------------------------------*/
#requirements{
position: relative;
width: 100%;
margin: 0 auto;
}

#requirements .hed_wrap{
border-bottom: 1px solid #CBC5C0;
padding:80px 5% 70px;
box-sizing: border-box;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

#requirements .hed_wrap .txt_box{
width:calc(100% - 300px);
margin-bottom: 0;
}

#requirements .hed_wrap .txt_box .c_title{
margin-bottom: 40px;
}

#requirements .hed_wrap .txt_box p{
font-size: 1rem;
font-weight: 800;
}

#message_p .hed_wrap .com_btn{
}


/*entry
---------------------------------*/
#entry{
background:linear-gradient(180deg, rgba(247, 93, 139, 1), rgba(254, 220, 64, 1));
}

#entry a{
display: block;
padding:70px 0;
box-sizing: border-box;
}

#entry a .c_title{
text-align: center;
color: #FFF;
font-size: 3.6rem;
line-height: 1;
margin-bottom: 15px;
  text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.4);
}

#entry a p{
text-align: center;
color: #FFF;
font-size: .9rem;
font-weight: 800;
line-height: 1;
text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.4);
}


}
/*sp*/
@media only screen and (max-width: 768px) {

/*fv
---------------------------------*/
#fv{
position: relative;
width: 100%;
padding: 160px 5% 30px;
box-sizing: border-box;
}

#fv .fv_ttl{
font-size: 18px;
font-weight: 700;
letter-spacing: .13rem;
line-height: 1;
margin-bottom: 20px;
}

#fv .fv_ttl2{
font-size:26px;
font-weight: 800;
letter-spacing: .1rem;
line-height: 1.4;
margin: 0 0 30px;
}

#fv .fv_txt{
font-weight: 700;
}

#fv .fv_txt span{
font-size: 18px;
font-weight: 800;
}

/*mv
---------------------------------*/
#mv{
width: 100%;
height: auto;
aspect-ratio: 16/8;
position: relative;
}

#mv .move {
width:100%;
height:100%;
position:absolute;
top:0;
left:0;
mask-image:url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox=" 0 0 1675 1675" width="100%" preserveAspectRatio="xMidYMid slice" fill="none"><circle cx="837.5" cy="837.5" r="837.5" fill="black" /></svg>');
mask-position:top center;
mask-origin:top center;
mask-repeat:no-repeat;
mask-size:1000%;
}

#mv .move video {
display: block;
width: 100%;
margin: 0 auto;
object-fit: cover;
position: relative;
}


/*fv2
---------------------------------*/
#fv2{
position: relative;
width: 100%;
margin: 0 auto;
overflow: hidden;
}

#fv2 article{
position:relative;
overflow: hidden;
z-index: -1;
}
#fv2 .loop_wrap {
display: flex;
width: 100%;
overflow: hidden;
margin: 0 auto 0;
padding:30px 0 20px;
box-sizing: border-box;
background:-webkit-linear-gradient(123deg, #2C2826 50%, #2C2826 72.32%, #B99568 96.735%);
}

#fv2 .loop_wrap div {
flex: 0 0 auto;
white-space: nowrap;
font-size: 22px;
font-weight:900;
line-height:1;
overflow: hidden;
color: #FFF;
}

#fv2 .loop_wrap div:nth-child(odd) {
animation: txtloop 70s -35s linear infinite;
}

#fv2 .loop_wrap div:nth-child(even) {
animation: txtloop2 70s linear infinite;
}

#fv2 .fv2_list{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
border-bottom: 1px solid #af9b55;
position: relative;
}

#fv2 .fv2_list li{
width: 50%;
padding:10px;
box-sizing: border-box;
font-size: 14px;
font-weight: 900;
line-height: 1.2;
border-right: 1px solid #af9b55;
border-bottom: 1px solid #af9b55;
text-align: center;
color: #121212;
}

#fv2 .fv2_list li:last-child{
border-bottom: none;
}

/*works
---------------------------------*/
#works{
position: relative;
width: 100%;
margin: 0 auto;
padding-bottom:40px;
box-sizing: border-box;
}

#works::before{
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 18%;
background: url("../images/com/bg_p.jpg") 0 0 repeat;
z-index: -2;
}

#works article{
position:relative;
overflow: hidden;
z-index: -1;
}

#works .loop_wrap {
display: flex;
width: 100%;
overflow: hidden;
margin:-20px auto 30px;
}

#works .loop_wrap div {
flex: 0 0 auto;
white-space: nowrap;
font-size: 6rem;
font-weight:400;
line-height:1;
overflow: hidden;
color: #af9b55;
opacity: .2;
}

#works .loop_wrap div:nth-child(odd) {
animation: txtloop 70s -35s linear infinite;
}

#works .loop_wrap div:nth-child(even) {
animation: txtloop2 70s linear infinite;
}

#works .txt_box{
width: 90%;
margin: 0 auto 20px;
}

#works .txt_box .txt{
}

#works .img{
width:80%;
margin: auto;
overflow: hidden;
}



/*challenging
---------------------------------*/
#challenging{
position: relative;
width: 100%;
margin: 0 auto;
padding:30px 0 60px;
box-sizing: border-box;
background: url("../images/com/bg_p.jpg") 0 0 repeat;
overflow: hidden;
}

#challenging article{
position:absolute;
bottom: 0;
left: 0;
overflow: hidden;
z-index: -1;
}

#challenging .loop_wrap {
display: flex;
width: 100%;
overflow: hidden;
margin:0px auto 0;
}

#challenging .loop_wrap div {
flex: 0 0 auto;
white-space: nowrap;
font-size: 4rem;
font-weight:400;
line-height:1;
overflow: hidden;
color: #af9b55;
opacity: .2;
}

#challenging .loop_wrap div:nth-child(odd) {
animation: txtloop 70s -35s linear infinite;
}

#challenging .loop_wrap div:nth-child(even) {
animation: txtloop2 70s linear infinite;
}

#challenging .challenging_list {
position: relative;
width: 100%;
z-index: 5;
}

#challenging .challenging_list li{
margin-bottom:30px;
position: relative;
}

#challenging .challenging_list li:last-child{
margin-bottom: 0;
}

#challenging .challenging_list li:nth-child(odd){
flex-direction: row-reverse;
}


#challenging .challenging_list li .txt_box{
width: 90%;
margin: 0 auto 30px;
}

#challenging .challenging_list li .txt_box .txt_box_inner{

}

#challenging .challenging_list li .txt_box .txt_box_inner .c_title{
color:#af9b55;
}

#challenging .challenging_list li .txt_box .txt_box_inner .c_sub_title{
color:#af9b55;
}

#challenging .challenging_list li .txt_box .txt_box_inner .txt{
color: #FFF;
}

#challenging .challenging_list li .img{
width:80%;
margin: auto;
overflow: hidden;
}

#challenging .challenging_list li .img img{
overflow: hidden;
}

#challenging .challenging_list li:nth-child(even) .img img{
overflow: hidden;
}


/*cherish
---------------------------------*/
#cherish{
position: relative;
width: 100%;
margin: 0 auto;
}

#cherish .hed_wrap{
border-bottom: 1px solid #CBC5C0;
padding:30px 5% 20px;
box-sizing: border-box;
}

#cherish .hed_wrap .c_title{
margin-bottom: 0;
}

#cherish .cherish_list{
border-top: 1px solid #CBC5C0;
}

#cherish .cherish_list li{
width: 100%;
padding: 20px;
box-sizing: border-box;
border-bottom: 1px solid #CBC5C0;
}

#cherish .cherish_list li:last-child{
border-right:none;
}

#cherish .cherish_list li .box_list{
margin-bottom: 20px;
}

#cherish .cherish_list li .box_list .c_sub_title{
width: 100%;
margin-bottom: 20px;
}

#cherish .cherish_list li .box_list .img{
width: 80%;
margin: auto;
}

#cherish .fot_wrap{
border-bottom: 1px solid #CBC5C0;
padding:20px 5% 20px;
box-sizing: border-box;
text-align: center;
}

#cherish .fot_wrap h4{
font-size:20px;
font-weight: 900;
line-height: 1.4;
margin: 0 0 20px;
}

#cherish .fot_wrap p{
font-weight: 900;
}



/*partner
---------------------------------*/
#partner{
background: url("../images/recruit/bg_partnersp.jpg") center center no-repeat;
background-size: cover;
padding: 60px 5%;
box-sizing: border-box;
position: relative;
}

#partner::before{
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0,0,0,.5);
}

#partner .section_wrap{
position: relative;
z-index: 5;
}

#partner .section_wrap .c_title{
text-align: center;
color: #FFF;
margin: 0 0 60px;
}


#partner .section_wrap .c_sub_title{
color: #FFF;
text-align: center;
}

#partner .section_wrap .txt{
font-weight: 600;
color: #FFF;
}


/*message_p
---------------------------------*/
#message_p{
position: relative;
width: 100%;
margin: 0 auto;
border-bottom: 1px solid #CBC5C0;

}

#message_p .hed_wrap{
padding:40px 5%;
box-sizing: border-box;
}

#message_p .hed_wrap .c_title{
width:100%;
margin-bottom: 20px;
}

#message_p .hed_wrap .com_btn a{;
margin: 0 auto;
}

#message_p .fot_wrap{
width: 100%;
margin: auto;
}


#message_p picture img {
width: 100%;
height: auto; /* アスペクト比を保つため */
display: block; /* 余計な余白を取り除く */
}


/*requirements
---------------------------------*/
#requirements{
position: relative;
width: 100%;
margin: 0 auto;
}

#requirements .hed_wrap{
border-bottom: 1px solid #CBC5C0;
padding:40px 5%;
box-sizing: border-box;
}

#requirements .hed_wrap .txt_box{
width:100%;
margin-bottom:20px;
}

#requirements .hed_wrap .txt_box .c_title{
margin-bottom: 20px;
}

#requirements .hed_wrap .txt_box p{
font-size: 1rem;
font-weight: 800;
}


/*entry
---------------------------------*/
#entry{
background:linear-gradient(180deg, rgba(247, 93, 139, 1), rgba(254, 220, 64, 1));
}

#entry a{
display: block;
padding:30px 0;
box-sizing: border-box;
}

#entry a .c_title{
text-align: center;
color: #FFF;
font-size:20px;
line-height: 1;
margin-bottom:10px;
text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.4);
}

#entry a p{
text-align: center;
font-size:14px;
font-weight: 800;
line-height: 1;
color: #FFF;
text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.4);
}