@charset "UTF-8";
/*header*/
.headerContents {
	position:relative;
	width:100vw;
	height:calc(100vh - 2.3rem);
	margin:0 auto 0 auto;
	padding-top:2.3rem;
    height: -webkit-fill-available;
}
.header__imgWrap {
	position:relative;
	width:100%;
	height:100%;
	height:calc(100vh - 270px);
	margin:1.5rem auto 0 auto;
	opacity:0;
	-moz-animation:alpha 6s ease  0.5s 1 forwards;
	-webkit-animation:alpha 6s ease  0.5s 1 forwards;
	-o-animation:alpha 6s ease  0.5s 1 forwards;
	-ms-animation:alpha 6s ease  0.5s 1 forwards;
	animation:alpha 6s ease  0.5s 1 forwards;
	overflow:hidden;
	z-index:1;
}
.header__imgWrap video {
    height: 100%;
    width: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit-transform: translateY(-50%) translateX(-50%);
	object-fit: cover;
	z-index:5;
}
video::-webkit-media-controls {
    display:none !important;
}
video::-webkit-media-controls-panel {
  display: none!important;
  -webkit-appearance: none;
}
video::--webkit-media-controls-play-button {
  display: none!important;
  -webkit-appearance: none;
}
video::-webkit-media-controls-start-playback-button {
  display: none!important;
  -webkit-appearance: none;
}
.header__imgWrap img {
	width:100%;
	height:100%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit-transform: translateY(-50%) translateX(-50%);
	object-fit: cover;
	border:solid 3px #1F1F1F;
	z-index:10;
}
.header__txtWrap {
	position:relative;
	width:80%;
	height:25vh;
	min-height:100px;
	margin:2rem 10%;
	text-align:left;
	z-index:20;
}
.header__txtJa {
}
.header__txtWrap img {
	width:55%;
	margin-top:1rem;
}




/*section philosophy*/
section.philosophy {
	position:relative;
	margin:7rem auto 10rem auto;
}
.philosophy .titleA {
	margin:0 10%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
}
.philosophy .txtA {
	margin-top:8rem;
}
.philosophy .buttonA {
	transform: translateY(+50%);
	-webkit-transform: translateY(+50%);
}
.philosophy .backimg {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:-1;
}
.philosophy .backimg img {
	width:100%;
	height:100%;
	object-fit: cover;
}
.philosophy .backimg span {
	position:absolute;
	top:-0.5%;
	left:0;
	width:100%;
	height:101%;
	background-color:#1F1F1F;
    transform-origin:top;
}


/*section news*/
section.news {
	position:relative;
	width:80%;
	margin:auto;
	padding:0 10% 13% 10%;
	background-color:#323130;
}
section.news .titleB {
	margin:0;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
}
ul.newsList {
	margin:0;
	color:#fff;
}
ul.newsList li.listItem {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display:flex;
	-webkit-flex-direction: column;
	-ms-flex-direction: column;
	flex-direction: column;
	padding:1.1rem 0 0.2rem 0;
	border-bottom:solid 1px #fff;
}
ul.newsList .listItem__day {
	margin:0;
	font-size:0.75rem;
	font-family: 'Roboto', sans-serif;
	font-weight:700;
}
ul.newsList p.listItem__txt {
	font-size:0.9rem;
	line-height:1.6rem;
}

.modaal-container{
	background-color: rgba(0,0,0,0);
	color: #fff;
}

.modal-hidden{
	display: none;
}

.modaal-container{
    max-width: 600px;
}

.modaal-close:after, 
.modaal-close:before{
	background:#ccc;	
}

.modaal-close:focus:after,
.modaal-close:focus:before,
.modaal-close:hover:after,
.modaal-close:hover:before{
	background:#666;
}












/*section service*/
section.service {
	position:relative;
	width:100%;
	margin:auto;
	color:#000;
}
.service__pickup {
	position:relative;
	width:80%;
	padding:10%;
}
ul.service__pickupList {
	width:100%;
	margin:auto;
}
.service__pickupList li.listItem {
	margin:2rem auto 5rem auto;
}
.service__pickupList .listItem__imgWrap {
	margin:1.5rem auto;
}
.service__pickupList .listItem__img {
	width:100%;
	height:250px;
}
.service__pickupList .listItem__img img {
	width:100%;
	height:100%;
	object-fit: cover;
}
.service__pickupList .listItem__txtWrap {
}
.service__pickupList  h4.listItem__title {
}
.service__pickupList .listItem__category {
	display:flex;
	align-items: center;
	font-size:0.85rem;
	color:#3E3A39;
}
.service__pickupList .listItem__category-img {
	width:1.8rem;
	margin:auto 0.7rem auto 0;
}
.service__pickupList .listItem__category-txt {
}
.service__pickupList .listItem__title {
	margin:1.5rem auto;
}
.service__pickupList .listItem__title .ja {
	margin:auto auto 0.5rem auto;
}
.service__pickupList .listItem__title .en {
	font-size:1rem;
	font-family: 'Roboto', sans-serif;
	font-weight:100;
	color:#595757;
}
.service__pickupList p.listItem__txt {
	margin:1.2rem auto;
}
.service__pickup .backimg {
	position:absolute;
	top:250px;
	left:0;
	width:100%;
	height:100%;
	background-color:#fff;
	z-index:-1;
}
/**/
.service__contents {
	width:100%;
	background-color:#fff;
}
.contentsBar {
	width:65%;
	margin:auto 0 auto 15%;
	padding:5% 10%;
	background-color:#323130;
}
.service__contents dl.list {
	margin:2rem auto;
	font-size:0.85rem;
	line-height:1.5rem;
	text-align:justify;
	color:#fff;
}
.service__contents .list dt {
	margin:1rem auto 0.7rem auto;
	font-size:0.9rem;
}
.service__contents .list dd {
	margin:0;
	padding:0.4rem 0 0.4rem 1rem;
	border-left:solid 1px #fff;
}
/**/
.service__performance {
	margin:0 auto 30% auto;
}
.service__performance .backimg {
	width:85%;
	height:150px;
	margin:0 15% 0 0;
}
.service__performance .backimg img {
	width:100%;
	height:100%;
	object-fit: cover;
}
.service__performance h3.titleB {
	width:80%;
	margin:10%;
}
.service__performance .buttonB-W {
	width:80%;
	margin:auto 10%;
}


/*section company*/
section.company {
	position:relative;
	margin:25% auto 9rem auto;
}
.company .titleA {
	margin:0 10%;
	transform:translateY(-50%);
	-webkit-transform:translateY(-50%);
}
.company .txtA {
	margin-top:8rem;
}
.company .backimg {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:65%;
	z-index:-1;
}
.company .backimg span {
	position:absolute;
	top:-0.5%;
	left:0;
	width:100%;
	height:101%;
	background-color:#1F1F1F;
    transform-origin:right;
	z-index:0;
}
.company .backimg img {
	width:100%;
	height:100%;
	object-fit: cover;
}
.company__btnWrap {
	margin:30% auto auto auto;
}
.company .buttonB-W {
	width:80%;
	margin:10% auto;
}
.company .buttonA {
	margin:15% auto 20% auto;
}


@media print, screen and (min-width: 481px) {
/*header*/
.headerContents {
	height:calc(100vh - 3rem);
	padding-top:3rem;
}
.header__imgWrap {
	height:calc(100vh - 300px);
}
.header__txtWrap {
	width:70%;
	margin:6% 15%;
}
.header__txtWrap img {
	width:17.5rem;
	margin-top:1.5rem;
}


/*section philosophy*/
section.philosophy {
	margin:10rem auto 20% auto;
}
section.philosophy .titleA {
	margin:0 5% 0 15%;
}


/*section news*/
section.news {
	width:70%;
	padding:0 15% 13% 15%;
}
ul.newsList li.listItem {
	position: relative;
}

ul.newsList p.listItem__txt {
	padding-right: 3rem;
}

ul.newsList li.listItem::before {
	content: "＞";
	position: absolute;
	right: 8px;
	top: 50%;
	margin-top: -7px;
	font-size:0.7rem;
	-moz-animation: btnB-arrow 8s linear infinite;
	-webkit-animation: btnB-arrow 8s linear infinite;
	-o-animation: btnB-arrow 8s linear infinite;
	-ms-animation: btnB-arrow 8s linear infinite;
	animation: btnB-arrow 8s linear infinite;
}




/*section service*/
.service__pickup {
	position:relative;
	width:70%;
	padding:10% 15% 5% 15%;
}
.service__pickupList li.listItem {
	margin:3rem auto 6rem auto;
}
.service__pickupList p.listItem__txt {
	margin:1.5rem auto;
}

/**/
.contentsBar {
	width:55%;
	margin:0 0 auto 25%;
	padding:5% 10%;
	background-color:#323130;
}

/**/
.service__performance h3.titleB {
	width:70%;
	margin:10% 15%;
}
.service__performance .buttonB-W {
	width:70%;
	margin:auto 15%;
}


/*section company*/
.company .titleA {
	margin:0 5% 0 15%;
}
.company .backimg {
	height:calc(22rem + 30%);
}
.company__btnWrap {
	margin:20% auto auto auto;
}
.company .buttonB-W {
	width:70%;
	margin:15% auto;
}
}

@media print {
.headerContents {
	height: 800px !important;
	padding-bottom:30px !important;
}
.header__imgWrap {
	height: 550px !important;
}
.header__txtJa {
	color:#fff !important;
}

.philosophy {
	margin-top:20px !important;
}
.philosophy .txtA {
	margin-top:auto !important;
}

.contentsBar {
	margin:auto 0 auto 10% !important;
}

.service__performance {
	margin-bottom:100px;
}
.service__performance .backimg {
	margin:0 auto;
}

}

.workBtnWrap {
	width:100%;
	padding:3rem 0;
}
.workBtn {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display:flex;
	-webkit-justify-content: space-between;
	-moz-justify-content: space-between;
	-ms-justify-content: space-between;
	-o-justify-content: space-between;
	justify-content: space-between;
	width:70%;
	margin:auto 15%;
}
.workBtn--previous a, .workBtn--next a {
	color:#fff;
	font-family: 'Roboto', sans-serif;
	font-weight:400;
}
.workBtn--now {
	border-bottom:solid 1px #fff;
	color:#fff;
	font-family: 'Roboto', sans-serif;
	font-weight:700;
}
.workBtn--page a {
	color:#b5b5b6;
	font-family: 'Roboto', sans-serif;
	font-weight:400;
}




@media only screen and (min-width: 769px) {

/*header*/
.headerContents {
	position:relative;
	height:95vh;
	margin:0 auto 15vh auto;
	padding-top:5vh;
}
.header__imgWrap {
	position:absolute;
	top:50%;
	right:0%;
	transform:translateY(-50%);
	-webkit-transform:translateY(-50%);
	width:70%;
	height:75vh;
	margin:0;
}
.header__imgWrap {
	height:75vh;
}
.header__txtWrap {
	position:absolute;
	top:53%;
	left:0%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	width:500px;
	margin:0% 10%;
}
.header__txt {
	position:absolute;
	top:auto;
	transform: translateY(0%);
	-webkit-transform: translateY(0%);
}
.header__txtWrap img {
	width:17.5rem;
	margin-top:1.5rem;
}


/*section philosophy*/
section.philosophy {
	margin:12rem auto 0 auto;
	padding-bottom:5%;
}
.philosophy__txtbtnWrap {
	width:35%;
	max-width:400px;
	margin:auto auto auto 15%;
}
section.philosophy .txtA {
	width:80%;
	margin:8rem 0 10% 0;
}
section.philosophy .buttonA {
	transform: translateY(0%);
	-webkit-transform: translateY(0%);
}

/*section news*/
section.news {
	width:calc(45% - 6rem);
	margin:-18rem 0 0 55%;
	padding:3rem;
	z-index:1;
}
section.news .titleB {
	margin:auto auto 5% auto;
	transform: translateY(0%);
	-webkit-transform: translateY(0%);
}
ul.newsList li.listItem {
	position: relative;
	-webkit-flex-direction:row;
	-ms-flex-direction:row;
	flex-direction:row;
	padding:1rem 0;
}
ul.newsList .listItem__day {
	width:5rem;
	margin:0.5rem 2rem auto 0;
}
ul.newsList p.listItem__txt {
	width:calc(100% - 5rem);
	padding-right: 3rem;
	margin:auto;
}

ul.newsList li.listItem::before {
	content: "＞";
	position: absolute;
	right: 8px;
	top: 50%;
	margin-top: -7px;
	font-size:0.7rem;
	-moz-animation: btnB-arrow 8s linear infinite;
	-webkit-animation: btnB-arrow 8s linear infinite;
	-o-animation: btnB-arrow 8s linear infinite;
	-ms-animation: btnB-arrow 8s linear infinite;
	animation: btnB-arrow 8s linear infinite;
}

/*section service*/
section.service {
	position:relative;
	margin:0 auto 0 auto;
}
.service__pickup {
	position:relative;
	width:50%;
	margin:-2rem auto 0 auto;
	padding:0 35% 5% 15%;
	text-align:left;
}
ul.service__pickupList {
	margin:30px 0 0 0;
}
.service__pickupList li.listItem {
	margin:0rem auto;
}
.service__pickupList li.listItem::after {
  content: "";
  display: block;
  clear: both;
}
.service__pickupList .listItem__imgWrap {
	float:left;
	width:40%;
	margin:auto 5% auto auto;
}
.service__pickupList .listItem__img {
	width:100%;
	height:350px;
}
.service__pickupList .listItem__txtWrap {
	float:right;
	width:50%;
	margin:6rem auto auto 5%;
}
.service__pickup .backimg {
	position:absolute;
	top:100px;
	left:0;
	width:100%;
	height:100%;
	background-color:#fff;
	z-index:-1;
}
/**/
.service__contents {
	position:absolute;
	top:250px;
	right:0;
	width:30%;
	background-color:inherit;
}
/**/
.service__performance {
	width:65%;
	margin:0 auto 0 auto;
	padding:0 35% 0 0%;
	background-color:#1F1F1F;
}
.service__performance .backimg {
	float:left;
	width:54%;
	height:250px;
	margin:0;
}
.performance__txtWrap {
	float:right;
	width:39%;
	margin:1rem 0 auto 7%;
}
.service__performance h3.titleB {
	width:100%;
	margin:10% auto;
}
.service__performance .buttonB-W {
	width:100%;
	margin:auto;
}


/*section company*/
section.company {
	position:relative;
	margin:7rem auto 10% auto;
}
.company__txtbtnWrap {
	width:35%;
	max-width:400px;
	margin:auto auto auto 15%;
}
.company .titleA {
	margin:0 15% 3rem 15%;
	transform:translateY(0%);
	-webkit-transform:translateY(0%);
}
.company .txtA {
	width:80%;
	margin:0 0 10% 0;
}
.company .backimg {
	position:absolute;
	top:0;
	right:0;
	width:55%;
	height:70%;
	margin:0 0 0 auto;
	z-index:-1;
}
.company__btnWrap {
	margin:25% auto auto auto;
}
.company .buttonB-W {
	width:100%;
	margin:10% auto;
}

}

@media print {
.headerContents {
	height: 600px;
}

}