/* 00. COMMON SETTING
-------------------------------------------------------------------- */

/* 01. COMPONENT
-------------------------------------------------------------------- */

.c-topSection {
  position: relative;
  padding: 8rem 0;
}

.c-topSection__title {
  text-align: center;
  position: relative;
  padding-top: 3.5rem;
  margin-bottom: 6.4rem;
  font-size: 3.6rem;
  font-weight: 500;
}

.c-topSection__title--en {
  font-family: "Lato", sans-serif;
  font-size: 1.8rem;
  font-weight: 700;
  letter-spacing: 0;
  opacity: 0.7;
}

.c-topSection__title--ja {
  display: inline-block;
  font-size: 4.8rem;
  font-weight: 500;
  color: #cc0000;
}

.c-topSection--bg{
  background: #ededed;
}

/*-----------旧 -------------*/
.c-topSection--solution,
.c-topSection--product,
.c-topSection--casestudy,
.c-topSection--news {
	position: relative;
	padding: 8rem 0;
}


.c-topSection--solution .c-topSection__title {
	text-align: center;
}

.c-topSection--product .c-topSection__title {
	max-width: 87.5%;
	padding-bottom: 2.4rem;
	text-align: right;
	border-bottom: 1px solid #cc0000;
}

.c-topSection--product .c-topSection__title--en {
	right: 0;
	left: auto;
	-webkit-transform: translateX(-36%) translateY(-62%);
	transform: translateX(-36%) translateY(-62%);
	color: #fff;
}

.c-topSection--casestudy {
	margin-top: 8rem;
	background: #f7f7f7;
}

.c-topSection--casestudy .c-topSection__title {
	max-width: 87.5%;
	margin: 0 0 6.4rem auto;
	padding-bottom: 2.4rem;
	text-align: left;
	border-bottom: 1px solid #cc0000;
}

.c-topSection--casestudy .c-topSection__title--en {
	left: 0;
	-webkit-transform: translateY(-62%);
	transform: translateY(-62%);
	z-index: 0;
}

.c-topSection--casestudy .c-topSection__title--ja {
	-webkit-transform: translateX(120%);
	transform: translateX(120%);
}

.c-topSection--news .c-topSection__title {
	text-align: center;
}

.c-topSection--news .c-topSection__title--en {
	-webkit-transform: translateX(-5%) translateY(-62%);
	transform: translateX(-5%) translateY(-62%);
}
/*-----------旧 -------------*/



/* 02. KV
-------------------------------------------------------------------- */

.p-kv {
  position: relative;
}

.p-kv__list--sp {
  display: none;
}

.p-kv__img {
  width: 100%;
}

.p-kv__pager {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  position: absolute;
  right: 0;
  bottom: 24px;
  left: 0;
  margin: 0 auto;
}

.p-kv__pager li {
  margin: 0 8px;
}

.p-kv__pager button {
  width: 16px;
  height: 16px;
  color: transparent;
  line-height: 0;
  font-size: 0;
}

.p-kv__pager button::before {
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  border: 2px solid #f0f0f0;
  border-radius: 50%;
}

.p-kv__pager .slick-active button::before {
  border: none;
  background: #cc0000;
}

/* 03. MAIN
-------------------------------------------------------------------- */

.p-productBtnArea {
  margin-bottom: 0;
}

.p-casestudy__list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
/*	overflow-x: hidden; */
overflow-x: visible;
margin-left: 1rem;
margin-right: 1rem;
}

.p-casestudy__item {
  position: relative;
  -webkit-box-flex: 1;
  -ms-flex: 1 1 0%;
  flex: 1 1 0%;
}

.p-casestudy__item:nth-child(2) {
  margin: 0% 1.5% 0 5%;
}

.p-casestudy__item:last-child {
  margin-left: 8%;
}

.p-casestudy__transition.is-hover:hover .p-casestudy__img {
  opacity: 1;
}

.p-casestudy__transition.is-hover:hover .p-casestudy__title,
.p-casestudy__transition.is-hover:hover .p-casestudy__company {
  color: #cc0000;
}

.p-casestudy__transition.is-hover:hover .p-casestudy__textArea {
  background-color: white;
}

.p-casestudy__transition.is-touch .p-casestudy__img {
  opacity: 1;
}

.p-casestudy__transition.is-touch .p-casestudy__textArea {
  background-color: rgba(255, 255, 255, 0.7);
}

.p-casestudy__img {
/*
  -webkit-transform: skewX(-10deg);
  transform: skewX(-10deg);
*/
  -webkit-transform-origin: bottom left;
  transform-origin: bottom left;
  opacity: 0.6;
  -webkit-transition: .5s ease-out;
  transition: .5s ease-out;
}

.p-casestudy__item:first-child .p-casestudy__imgWrapper {
  -webkit-transform: translateX(-14%);
  transform: translateX(-14%);
}

.p-casestudy__imgMask {
  position: relative;
/*
  overflow: hidden;
*/
  overflow: visible;
}

.p-casestudy__img img {
  min-width: 117.6%;
  /*
     -webkit-transform: skewX(10deg);
  transform: skewX(10deg);
     */
  -webkit-transform-origin: bottom left;
  transform-origin: bottom left;
}

.p-casestudy__textArea {
  position: absolute;
/*	max-width: 332px; */
  max-width: 250px;
  padding: 2.4rem 2.4rem 2.05rem;
  border: 1px solid #cc0000;
  background-color: rgba(255, 255, 255, 0.4);
  -webkit-transition: .5s ease-out;
  transition: .5s ease-out;
}

.p-casestudy__item:first-child .p-casestudy__textArea,
.p-casestudy__item:nth-child(3) .p-casestudy__textArea {
  right: 0;
  bottom: 16px;
}

.p-casestudy__item:nth-child(2) .p-casestudy__textArea,
.p-casestudy__item:last-child .p-casestudy__textArea {
  left: 0;
  top: 16px;
}

.p-casestudy__item:first-child .p-casestudy__textArea {
  -webkit-transform: translateX(20%);
  transform: translateX(20%);
}

.p-casestudy__item:nth-child(3) .p-casestudy__textArea {
  -webkit-transform: translateX(37%);
  transform: translateX(37%);
}

.p-casestudy__item:nth-child(2) .p-casestudy__textArea {
  -webkit-transform: translateX(-20%);
  transform: translateX(-20%);
}

.p-casestudy__item:last-child .p-casestudy__textArea {
  -webkit-transform: translateX(-20%);
  transform: translateX(-20%);
}

.p-casestudy__title {
  font-size: 1.8rem;
  font-weight: 600;
  -webkit-transition: .3s;
  transition: .3s;
}

.p-casestudy__company {
  margin-top: 0.8rem;
  font-size: 1.2rem;
  font-weight: 600;
  -webkit-transition: .3s;
  transition: .3s;
}

.p-casestudy__text {
  margin-top: 1.25rem;
  line-height: 1.5;
}

.p-casestudyBtnArea {
  margin-bottom: 0;
}

.c-topSection--news{
  max-width: 1440px;
  margin: 0 auto;
  padding: 8rem 2%;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  display: flex;
  justify-content: flex-start;
  align-items: stretch;
}

.c-topSection--news .c-topSection__title{
  text-align: left;
  padding: 0;
}

.p-news__list {
  padding: 0 0 0 4%;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  display: table;
}

.p-news__item {
  display: table-row;
}

.p-news__item > * {
  border-top: 1px solid #ccc;
}

.p-news__item:last-child > * {
  border-bottom: 1px solid #ccc;
}

.p-news__date {
  display: table-cell;
  word-break: keep-all;
  vertical-align: baseline;
}

.p-news__category {
  display: table-cell;
  padding-left: 4.8rem;
  word-break: keep-all;
  vertical-align: baseline;
}

.p-news__title {
  display: table-cell;
  width: 100%;
  padding-left: 4.8rem;
  vertical-align: baseline;
  line-height: 1.5;
}

.p-news__transition {
  display: block;
  padding: 1.25rem 0;
  -webkit-transition: .3s;
  transition: .3s;
}

.p-news__transition.is-hover:hover {
  color: #cc0000;
}

.p-newsBtn {
  padding-right: 1.6rem;
}

.p-newsBtnArea {
  padding: 0;
  margin-bottom: 0;
}

.p-newsBtn__icon {
  margin-right: 1.6rem;
  margin-left: 0;
}

/* 07. MEDIA QUERIES
-------------------------------------------------------------------- */

@media screen and (max-width: 1439px) and (min-width: 1025px) {

.p-casestudy__item:first-child .p-casestudy__textArea,
.p-casestudy__item:nth-child(3) .p-casestudy__textArea {
  bottom: 0;
}

.p-casestudy__item:nth-child(2) .p-casestudy__textArea,
.p-casestudy__item:last-child .p-casestudy__textArea {
  top: 0;
}

}

@media screen and (max-width: 1439px) {

.p-solution__list {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.p-solution__item {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}

.p-casestudy__item {
  height: 400px;
}

.p-casestudy__imgWrapper {
  -webkit-transform: translateY(90px);
  transform: translateY(90px);
}

.p-casestudy__item:first-child .p-casestudy__imgWrapper {
  -webkit-transform: translateX(-14%) translateY(90px);
  transform: translateX(-14%) translateY(90px);
}

.p-casestudy__title {
  font-size: 1.6rem;
}

}

@media screen and (max-width: 1024px) {

.p-casestudy__list {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.p-casestudy__item {
  -webkit-box-flex: 0;
  -ms-flex: 0 1 50%;
  flex: 0 1 50%;
}

.p-casestudy__item:nth-child(2) {
  margin: 0;
}

.p-casestudy__item:last-child {
  margin: 0;
}

.p-casestudy__item {
  height: auto;
}

.p-casestudy__img {
  -webkit-transform: none;
  transform: none;
}

.p-casestudy__item:first-child .p-casestudy__imgWrapper {
  -webkit-transform: none;
  transform: none;
}

.p-casestudy__imgWrapper {
  -webkit-transform: none;
  transform: none;
}

.p-casestudy__item:first-child .p-casestudy__imgWrapper {
  -webkit-transform: none;
  transform: none;
}

.p-casestudy__img img {
  min-width: 100%;
  -webkit-transform: none;
  transform: none;
}

.p-casestudy__item:first-child .p-casestudy__textArea {
  -webkit-transform: none;
  transform: none;
}

.p-casestudy__item:nth-child(3) .p-casestudy__textArea {
  -webkit-transform: none;
  transform: none;
}

.p-casestudy__item:nth-child(2) .p-casestudy__textArea {
  -webkit-transform: none;
  transform: none;
}

.p-casestudy__item:last-child .p-casestudy__textArea {
  -webkit-transform: none;
  transform: none;
}

.c-topSection--news{
  flex-wrap: wrap;
}

.p-newsTitle{
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 0 16px;
}

.p-newsBtnArea{
  margin: 0;
}

.p-newsBtn{
  min-width: 200px;
}

.p-news__list {
  padding: 0 16px 0;
}

}

@media screen and (max-width: 767px) {

.c-topSection,
.c-topSection--solution,
.c-topSection--product,
.c-topSection--casestudy,
.c-topSection--news {
  padding: 4.8rem 0;
}

.c-topSection__title {
  padding-top: 0;
  margin-bottom: 3.6rem;
}

.c-topSection--product .c-topSection__title--en {
  -webkit-transform: none;
  transform: none;
  color: #f7f7f7;
}

.c-topSection--casestudy {
  margin-top: 4.8rem;
}

.c-topSection--casestudy .c-topSection__title {
  margin-bottom: 3.6rem;
}

.c-topSection--casestudy .c-topSection__title--en {
  -webkit-transform: none;
  transform: none;
}

.c-topSection--casestudy .c-topSection__title--ja {
  -webkit-transform: none;
  transform: none;
}

.c-topSection--news .c-topSection__title--en {
  -webkit-transform: none;
  transform: none;
}

.p-kv__list {
  display: none;
}

.p-kv__list--sp {
  display: block;
}

.p-solution__list {
  display: block;
}

.p-solution__transition {
  height: 180px;
}

.p-solution__text {
  margin-top: 0.9rem;
  font-size: 1.4rem;
}

.p-casestudy__list {
  display: block;
}

.p-casestudy__item:nth-child(2) {
  margin-bottom: 3.2rem;
}

.p-casestudy__item {
  margin-bottom: 3.2rem;
}

.p-casestudy__textArea {
  padding: 1.6rem 1.6rem 1.25rem;
}

.p-news__list {
  display: block;
}

.p-news__item {
  display: block;
  padding-top: 1.25rem;
  border-top: 1px solid #ccc;
}

.p-news__item:last-child {
  border-bottom: 1px solid #ccc;
}

.p-news__item > * {
  border: none;
}

.p-news__item:last-child > * {
  border: none;
}

.p-news__date {
  display: block;
}

.p-news__category {
  display: block;
  padding-left: 0;
  margin-top: 0.8rem;
}

.p-news__title {
  display: block;
  padding-left: 0;
}

}

@media screen and (max-width: 479px) {

.c-topSection__title--ja {
  font-size: 3.2rem;
}

.c-topSection__title--en {
  font-size: 1.4rem;
}

.p-solution__title {
  font-size: 1.8rem;
}

.p-solution__text {
  font-size: 1.3rem;
}

.p-casestudy__list {
  overflow-x: visible;
}

.p-casestudy__textArea {
  max-width: 284px;
}

.p-casestudy__item:first-child .p-casestudy__textArea,
.p-casestudy__item:nth-child(3) .p-casestudy__textArea {
  bottom: -16px;
}

.p-casestudy__item:nth-child(2) .p-casestudy__textArea,
.p-casestudy__item:last-child .p-casestudy__textArea {
  top: auto;
  bottom: -16px;
}

}