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

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

/**********************************
slider
**********************************/
.hed_slider {
background:#1f7acc;
width:100%;
position:relative;
margin:0 auto 100px;
padding-bottom:9vh;
}

.slider_btn {
position:absolute;
width:270px;
top:14%;
right:1%;
z-index:100;
}

.slider_btn img {
width:100%;
height:auto;
}

#photograph {
position: relative;
width:100%;
height:75vh;
}

#photograph .bg_line {
display:block;
position:absolute;
top:0;
right:0;
width:110px;
height:75vh;
background:#1f7acc;
z-index:20;
}

.catchArea {
bottom:5vh;
display: block;
left: 0;
position: absolute;
right: 0;
z-index: 2;
}

.inner {
display: inline-block;
margin: 0 auto;
padding: 0;
background:#FFFFFF;
padding:50px;
}

.catchArea h2 {
color: #000;
font-size: 98px;
line-height: 0.9;
font-family:"Helvetica Neue",Helvetica,Arial;
}

.catchArea h3 {
font-size: 20px;
line-height: 1.2;
margin: 25px 0;
font-family:"Helvetica Neue",Helvetica,Arial;
}

.catchArea h4 {
font-size:12px;
color:#FFFFFF;
width:100%;
border:2px solid #FFFFFF;
margin:30px auto;
}

.catchArea p {
font-size:1em;
line-height:1.4;
font-weight:bold;
letter-spacing:1px;
}

.main_catch img {
width:100%;
height:auto;
}

.m-mv__main__scroll {
display:block;
position: absolute;
bottom:110px;
right: -50px;
z-index: 30;
-webkit-transform: rotate(270deg);
transform: rotate(270deg);
}

.c-scroll-down {
position: relative;
width: 210px;
}

.c-scroll-down .txt {
color: #fff;
font-family:"Helvetica Neue",Helvetica,Arial;
font-size: 16px;
font-weight: 300;
letter-spacing: 1px
}

.c-scroll-down .line {
overflow: hidden;
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: 140px;
height: 1px;
margin: auto
}

.c-scroll-down .line:before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 120%;
height: 100%;
background: #fff;
-webkit-animation-name: scrollLine;
animation-name: scrollLine;
-webkit-animation-duration: 3.2s;
animation-duration: 3.2s;
-webkit-animation-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
animation-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite
}


/**********************************
index
**********************************/
.scrt-to-left.visible {
opacity: 1;
-webkit-transform: translateX(0);
transform: translateX(0)
}

.scrt-cover {
overflow-x: hidden;
position: relative;
display: block
}



.scrt-cover:before {
content: "";
position: absolute;
width: 150%;
height: 100%;
right: 0;
top: 0;
z-index: 1;
background-color: #111;
-webkit-transform: skew(-15deg) translateX(10%);
transform: skew(-15deg) translateX(10%);
-webkit-transition: all .8s cubic-bezier(.215, .61, .355, 1);
transition: all .8s cubic-bezier(.215, .61, .355, 1);
-webkit-transition-timing-function: cubic-bezier(.215, .61, .355, 1);
transition-timing-function: cubic-bezier(.215, .61, .355, 1);
-webkit-transition-delay: .2s;
transition-delay: .2s
}

.scrt-cover:after {
content: "";
position: absolute;
width: 150%;
height: 100%;
right: 0;
top: 0;
background-color: #f5f4f3;
-webkit-transform: skew(-15deg) translateX(10%);
transform: skew(-15deg) translateX(10%);
z-index: 2;
-webkit-transition: all .8s cubic-bezier(.215, .61, .355, 1);
transition: all .8s cubic-bezier(.215, .61, .355, 1);
-webkit-transition-timing-function: cubic-bezier(.215, .61, .355, 1);
transition-timing-function: cubic-bezier(.215, .61, .355, 1)
}

.scrt-cover.visible:before {
-webkit-transform: skew(-15deg) translateX(120%);
transform: skew(-15deg) translateX(120%)
}

.scrt-cover.visible:after {
-webkit-transform: skew(-15deg) translateX(120%);
transform: skew(-15deg) translateX(120%)
}

.invisible {
visibility: inherit;
}


.idx_business_wrap {
width:100%;
margin:0px auto 80px;
position:relative;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
flex-direction:row;
min-width: 1200px;
}

.idx_business_wrap:nth-child(2n){
flex-direction:row-reverse;
}

.idx_business_wrap .business_box {
position: relative;
width: 40%;
padding:0 5%;
box-sizing: border-box;
}


.tit_l {
font-size:55px;
font-family:"Helvetica Neue",Helvetica,Arial;
line-height:1;
}

.tit_l_jp {
font-size:16px;
margin:0 auto 30px;
}

.txt_l {
font-size:18px;
line-height:2;
margin:0 auto 30px;
}


.tit_r {
font-size:55px;
font-family:"Helvetica Neue",Helvetica,Arial;
line-height:1;
text-align:right;
}

.tit_r_jp {
font-size:16px;
margin:0 auto 30px;
text-align:right;
}

.txt_r {
font-size:18px;
line-height:2;
margin:0 auto 30px;
text-align:left;
}

.idx_business_wrap .business_box .btn_wrap{
margin-bottom: 0;
}

.idx_business_wrap .img {
width:60%;
position: relative;
clip-path: polygon(12% 0%, 100% 0%, 100% 100%, 0% 100%);
}

.idx_business_wrap:nth-child(2n) .img {
width:60%;
position: relative;
clip-path: polygon(0% 0%, 88% 0%, 100% 100%, 0% 100%);
}


.approach_list {
width:1200px;
margin:0 auto 80px;
padding:0;
list-style-type:none;
position:relative;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

.approach_list li {
width:31%;
background:#FFFFFF;
margin-bottom:0;
position:relative;
}


.approach_list li h3 {
font-size:30px;
font-family:"Helvetica Neue",Helvetica,Arial;
line-height:1;
z-index:20;
margin-top:-20px;
padding:0% 2%;
}

.approach_list li h4 {
font-size:16px;
line-height:2;
padding:0% 2%;
}

.approach_list li p {
line-height:1.6;
padding:0 2%;
margin:10px auto 20px;
}


.bg_img06 {
background:url(../images/contents/a_img01.jpg) center center no-repeat;
background-size: 100% auto;
height:30vh;
}

.bg_img07 {
background:url(../images/contents/a_img02.jpg) center center no-repeat;
background-size: 100% auto;
height:30vh;
}

.bg_img08 {
background:url(../images/contents/a_img03.jpg) center center no-repeat;
background-size: 100% auto;
height:30vh;
}


.news_list {
width:100%;
margin:0 auto 80px;
padding:0;
list-style-type:none;
}

.news_list li {
border-bottom:1px solid #7f7f7f;
padding-bottom:5px;
}

.news_list li span {
font-size:0.8em;
font-family:"Helvetica Neue",Helvetica,Arial;
color:#7f7f7f;
display:block;
}


.recruit {
background-image: url(../images/contents/bg_img02.jpg);
background-position: center bottom;
background-repeat: no-repeat;
background-size: cover;
min-height: 500px;
padding: 0;
text-align: center;
}

.recruit_box {
background-color: rgba(255, 255, 255, 0.96);
margin: auto;
padding: 65px 30px 50px;
position: relative;
top: 65px;
width: 490px;
}

.recruit_box h3 {
font-size:60px;
font-family:"Helvetica Neue",Helvetica,Arial;
line-height:1;
z-index:20;
margin-top:-20px;
padding:0% 2%;
}

.recruit_box h4 {
font-size:16px;
line-height:2;
padding:0% 2%;
}

.recruit_boxi p {
line-height:1.6;
padding:0 2%;
margin:10px auto 20px;
}


}


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

/**********************************
slider
**********************************/
.hed_slider {
background:#none;
width:100%;
position:relative;
margin:0 auto 50px;
padding-bottom:0vh;
}

.slider_btn {
position:absolute;
width:270px;
top:14%;
right:1%;
z-index:100;
}

.slider_btn img {
width:100%;
height:auto;
}

#photograph {
position: relative;
width:100%;
height:30vh;
}

#photograph .bg_line {
display:none;
}

.catchArea {
bottom:0vh;
display: block;
left: 0;
position: absolute;
right: 0;
z-index: 2;
}

.inner {
display: inline-block;
margin: 0 auto;
padding: 0;
background:#FFFFFF;
padding:2%;
}

.catchArea h2 {
color: #000;
font-size: 22px;
line-height: 0.9;
font-family:"Helvetica Neue",Helvetica,Arial;
}

.catchArea h3 {
font-size: 10px;
line-height: 1.2;
margin:10px 0;
font-family:"Helvetica Neue",Helvetica,Arial;
}

.catchArea h4 {
font-size:10px;
color:#FFFFFF;
width:100%;
border:2px solid #FFFFFF;
margin:30px auto;
}

.catchArea p {
font-size:0.8em;
line-height:1.4;
font-weight:bold;
letter-spacing:1px;
}

.main_catch img {
width:100%;
height:auto;
}

.m-mv__main__scroll {
display:none;
position: absolute;
bottom:110px;
right: -50px;
z-index: 30;
-webkit-transform: rotate(270deg);
transform: rotate(270deg);
}

.c-scroll-down {
position: relative;
width: 210px;
}

.c-scroll-down .txt {
color: #fff;
font-family:"Helvetica Neue",Helvetica,Arial;
font-size: 16px;
font-weight: 300;
letter-spacing: 1px
}

.c-scroll-down .line {
overflow: hidden;
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: 140px;
height: 1px;
margin: auto
}

.c-scroll-down .line:before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 120%;
height: 100%;
background: #fff;
-webkit-animation-name: scrollLine;
animation-name: scrollLine;
-webkit-animation-duration: 3.2s;
animation-duration: 3.2s;
-webkit-animation-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
animation-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite
}

.bg_idx01 {
width:100%;
height:180px;
background:url(../images/contents/bg_img01.jpg) center center no-repeat;
background-size:cover;
margin:0 auto 30px;
}



.idx_business_wrap {
width:100%;
margin:0px auto 30px;
position:relative;
}

.idx_business_wrap .business_box {
position: relative;
width:90%;
margin: auto;
}

.business_box02 {
position:relative;
width:100%;
top:0px;
right:0;
margin:0;
z-index:10;
}

.tit_l {
font-size:22px;
font-family:"Helvetica Neue",Helvetica,Arial;
line-height:1;
}

.tit_l_jp {
font-size:14px;
margin:0 auto 30px;
}

.txt_l {
font-size:12px;
line-height:1.6;
margin:0 auto 15px;
}


.tit_r {
font-size:22px;
font-family:"Helvetica Neue",Helvetica,Arial;
line-height:1;
text-align:right;
}

.tit_r_jp {
font-size:14px;
margin:0 auto 15px;
text-align:right;
}

.txt_r {
font-size:12px;
line-height:1.6;
margin:0 auto 15px;
text-align:right;
}

.idx_business_wrap .img {
width:100%;
height: 22vh;
overflow: hidden;
position: relative;
clip-path: polygon(10% 0%, 100% 0%, 100% 100%, 0% 100%);
}

.idx_business_wrap:nth-child(2n) .img {
width:100%;
height: 22vh;
overflow: hidden;
position: relative;
clip-path: polygon(0% 0%, 90% 0%, 100% 100%, 0% 100%);
}

.idx_business_wrap .img img,
.idx_business_wrap:nth-child(2n) .img img {
width:100%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}


.approach_list {
width:90%;
margin:0 auto 30px;
padding:0;
list-style-type:none;
position:relative;
}

.approach_list li {
width:100%;
float:none;
background:#FFFFFF;
margin-bottom:0;
position:relative;
}


.approach_list li h3 {
font-size:22px;
font-family:"Helvetica Neue",Helvetica,Arial;
line-height:1;
z-index:20;
margin-top:-20px;
padding:0% 2%;
}

.approach_list li h4 {
font-size:14px;
line-height:2;
padding:0% 2%;
}

.approach_list li p {
line-height:1.6;
padding:0 2%;
margin:10px auto 20px;
}


.bg_img06 {
background:url(../images/contents/a_img01.jpg) center center no-repeat;
background-size: 100% auto;
height:20vh;
}

.bg_img07 {
background:url(../images/contents/a_img02.jpg) center center no-repeat;
background-size: 100% auto;
height:20vh;
}

.bg_img08 {
background:url(../images/contents/a_img03.jpg) center center no-repeat;
background-size: 100% auto;
height:20vh;
}


.news_list {
width:90%;
margin:0 auto 40px;
padding:0;
list-style-type:none;
}

.news_list li {
border-bottom:1px solid #7f7f7f;
padding-bottom:8px;
}

.news_list li span {
font-size:0.8em;
font-family:"Helvetica Neue",Helvetica,Arial;
color:#7f7f7f;
display:block;
}


.recruit {
background-image: url(../images/contents/bg_img02.jpg);
background-position: center left;
background-repeat: no-repeat;
background-size: cover;
min-height: 280px;
padding: 0;
text-align: center;
}

.recruit_box {
background-color: rgba(255, 255, 255, 0.96);
margin: auto;
padding:8% 4% 4%;
position: relative;
top: 45px;
width:80%;
}

.recruit_box h3 {
font-size:22px;
font-family:"Helvetica Neue",Helvetica,Arial;
line-height:1;
z-index:20;
margin-top:-20px;
padding:0% 2%;
}

.recruit_box h4 {
font-size:14px;
line-height:2;
padding:0% 2%;
}

.recruit_boxi p {
line-height:1.6;
padding:0 2%;
margin:10px auto 20px;
}



}