@charset "utf-8";
/* CSS Document */
header{
	transition-duration: 1.0s;
    transition-timing-function: ease-in-out;
    transition-delay: 0s;
	opacity: 0;
	pointer-events: none;
}
header a{
	pointer-events: none;
}
header.on{
	opacity: 1;
	pointer-events: all;
}
header.on a{
	pointer-events: all;
}
.contents{
	transition-duration: 1.0s;
    transition-timing-function: ease-in-out;
    transition-delay: 0s;
	opacity: 0;
}
.contents.on{
	opacity: 1;
}
.mainslide-wrap{
	position: relative;
    height:690px;
}
.mainslide-wrap .slider-wrap{
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 11;
    height:100%;
}
.mainslide-wrap .slide-dot {
	position: absolute;
    vertical-align: bottom;
    height: 100%;
	width: 100%;
    top: 0;
    left: 0;
    z-index: 12;
	background: url("../images/top/ptn.png") repeat center top / 1360px;
	opacity: 0.14;
}
.slick-slide {
    display: none;
    float: left;
    height: 100%;
    min-height: 1px;
}
.mainslide-wrap .slider-wrap .slide-box{
	position: relative;
    height:690px;
}
.slider-wrap .slide-box.slide-1 {
    background: url("../images/top/slide_01.jpg") no-repeat center center/cover;
}
.slider-wrap .slide-box.slide-2 {
    background: url("../images/top/slide_02.jpg") no-repeat center center/cover;
}
.slider-wrap .slide-box.slide-3 {
    background: url("../images/top/slide_03.jpg") no-repeat center center/cover;
}
.slider-wrap .slide-box.slide-4 {
    background: url("../images/top/slide_04.jpg") no-repeat center center/cover;
}
.slider-wrap .slide-box.slide-5 {
    background: url("../images/top/slide_05.jpg") no-repeat center center/cover;
}
.textsliderbox{
	position: absolute;
	width: 100%;
	z-index: 13;
	bottom: 34px;
}
/*.textsliderbox .slick-slide{
	width: 180%!important;
}*/
.textsliderbox p{
	font-size: 9vw;
	line-height: 1;
	padding-left: 16%;
	padding-right: 16%;
	width: 100%;
	color: #fff;
	white-space: nowrap;
	font-family: 'Oswald', sans-serif;
	font-weight: 700;
	padding-bottom: 0;
}
.textsliderbox img{
	max-height: 12vw;
	width: auto;
	display: block;
	vertical-align: bottom;
}
@keyframes infinity-scroll-left {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}

/*
IE11対策
----------------------------*/
_:-ms-lang(x)::-ms-backdrop,
.d-demo {
  display: -ms-grid;
  overflow: hidden;
}
/*----------------------------*/

.d-demo__wrap {
  display: flex;
  overflow: hidden;
}

.d-demo__list {
  display: flex;
  list-style: none;
}

.d-demo__list--left{
animation :infinity-scroll-left 155s infinite linear 0.0s both;
}

.d-demo__item {
  width: calc(1140vw / 6);
}
.d-demo__item > img{
   width: 100%;
}

.sec-1{
	padding-top: 100px;
	padding-bottom: 100px;
	background: url("../images/top/sec_bg.jpg") no-repeat center top / cover;
	color: #fff;
	position: relative;
	z-index: 10;
}
.sec-1 .main-copy{
	margin-bottom: 24px;
	line-height: 1;
	font-weight: 400;
	text-align: center;
	font-size: 40px;
}
.sec-1 .img-box{
	margin-top: 26px;
	margin-bottom: 26px;
	max-width: 466px;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}
.link-btn{
	width: 84%;
	max-width: 240px;
	margin-left: auto;
	margin-right: auto;
}
.link-btn a{
	display: block;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	background: #000000;
	border: 1px solid #fff;
	padding-top: 13px;
	padding-bottom: 13px;
	line-height: 1;
	text-align: center;
	color: #fff;
	border-radius: 26px;
}
.link-btn a .tex1{
	font-family: 'Oswald', sans-serif;
}
.link-btn a .tex2{
	font-family: 'Lato', sans-serif;
}
.link-btn a .yajirushi{
	width: 16%;
	display: inline-block;
	margin-left: 2.6%;
}
.link-btn a .yajirushi img{
	display: block;
}

.sec-5{
	padding-top: 138px;
	padding-bottom: 73px;
	background: #fff;
	position: relative;
	z-index: 10;
}
.ser-bg{
	padding-top: 0;
	padding-bottom: 80px;
	margin-top: 112px;
	background: url("../images/top/ser_bg.jpg") repeat center top / 1300px;
}
.ser-bg .ser-flex{
	width: 92.3%;
	margin-left: auto;
	margin-right: auto;
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}
.ser-bg .ser-flex .ser-list{
	width: 74%;
}
.ser-bg .ser-flex .ser-list ul{
	padding-top: 72px;
	padding-bottom: 17px;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.ser-bg .ser-flex .ser-list ul li{
	width: 32.4%;
	text-align: center;
	margin-top: 10px;
}
.ser-bg .ser-flex .ser-list ul li a{
	display: block;
}
.ser-bg .ser-flex .ser-list ul li .list-caption{
	margin-top: 10px;
	line-height: 1;
	font-size: 14px;
}
.ser-bg .ser-img{
	width: 20.8%;
}
.ser-bg .ser-img img{
	margin-top: -136px;
}
.ser-bg .house-img{
	width: 90.5%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 55px;
}

.sec-6{
	padding-top: 105px;
	padding-bottom: 102px;
	background: url("../images/top/his_bg.jpg") no-repeat center top / cover;
	position: relative;
	z-index: 10;
}
.sec-6 .pic-flex{
	display: flex;
	margin-top: 44px;
}
.sec-6 .pic-flex .img-box{
	width: 50%;
	display: block;
}

.sec-7{
	padding-top: 117px;
	padding-bottom: 142px;
	color: #fff;
	background: url("../images/top/sus_bg.jpg") no-repeat center top / cover;
	position: relative;
	z-index: 10;
}
.sec-7 .ttl-en span{
	color: #FF905F;
}

.sec-8{
	background: #222222;
	padding-top: 117px;
	padding-bottom: 75px;
	position: relative;
	z-index: 10;
}
.sec-8 .tab-link{
	border: 1px solid #fff;
	display: flex;
}
.sec-8 .tab-link li{
	width: 33.3%;
	border-right: 1px solid #fff;
}
.sec-8 .tab-link li:last-child{
	border-right: none;
}
.sec-8 .tab-link li a{
	padding-bottom: 13px;
	padding-top: 13px;
	text-align: center;
	color: #fff!important;
	line-height: 1;
	font-size: 14px;
	background: #000;
	display: block;
	width: 100%;
	opacity: 1;
	cursor: pointer;
}
.sec-8 .tab-link li.active a{
	opacity: 0.5;
}
.sec-8 .news-list{
	color: #fff;
}
.sec-8 .list-flex .title a{
	color: #60BDFF;
}
.sec-8 .ex-link a{
	color: #fff!important;
}
.sec-8 .bnr-box{
	position: relative;
}
.sec-8 .link-btn{
	position: absolute;
	bottom:8%;
	left: 0;
	right:4.8%;
	margin-left: auto;
	margin-right: 0;
}
.sec-8 .link-btn a{
	background: none;
}
.texbox1,.texbox2,.texbox3{
	position: relative;
}
.txt-point1,.txt-point2,.txt-point3{
	height: 10px;
	width: 100%;
	position: absolute;
    top: 40%;
    left: 0%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}
@media print, screen and (min-width : 901px) {
.ttl-box.ex .ttl-en,.ttl-box.ex .ttl-jp{
    text-align: right;
}
.link-btn.ex{
	margin-left: auto;
	margin-right:0;
}	
.sec-8 .ttl-en{
	text-align: left;
}	
  .con-flex .text .icon-list li .t-caption.ex{
      letter-spacing: -0.01em;
  }
}
@media only screen and (max-width : 900px) {
.mainslide-wrap{
	position: relative;
    height:106vw;
}
.mainslide-wrap .slide-dot {
	position: absolute;
    vertical-align: bottom;
    height: 100%;
	width: 100%;
    top: 0;
    left: 0;
	background: url("../images/top/ptn.png") repeat center top / 1360px;
}
.mainslide-wrap .slider-wrap .slide-box{
	position: relative;
    height:106vw;
}
.textsliderbox{
	position: absolute;
	width: 100%;
	bottom: 4vw;
}
/*.textsliderbox .slick-slide{
	width: 150vw!important;
}*/
.d-demo__list--left {
    animation: infinity-scroll-left 105s infinite linear 0.0s both;
}
.textsliderbox p{
	font-size: 9vw;
	line-height: 1;
	padding-left: 2%;
	padding-right:2%;
	width: 100%;
	color: #fff;
	white-space: nowrap;
	font-family: 'Oswald', sans-serif;
	font-weight: 700;
	padding-bottom: 0;
}
.textsliderbox img{
	max-height: 18vw;
	width: auto;
	display: block;
	vertical-align: bottom;
	max-width: 100%;
}
.d-demo__item {
  width: calc(1600vw / 5);
}
.d-demo__item > img{
   width: 100%;
}
.sec-1{
	padding-top: 12vw;
	padding-bottom: 12vw;
}
.sec-1 .img-box{
	margin-top: 13vw;
	margin-bottom: 9.6vw;
	max-width: none;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}
.sec-1 .main-copy{
	margin-bottom: 3.4vw;
	line-height: 1;
	font-weight: 400;
	text-align: center;
	font-size: 5.6vw;
}
.link-btn{
	width: 84%;
	max-width: none;
	margin-left: auto;
	margin-right: auto;
}
.link-btn.ptn2{
	width: 100%;
	max-width: none;
	margin-left: auto;
	margin-right: auto;
}
.link-btn a{
	display: block;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	background: #000000;
	border: 1px solid #fff;
	padding-top: 3.7vw;
	padding-bottom: 3.7vw;
	line-height: 1;
	text-align: center;
	color: #fff;
	border-radius: 6vw;
}
.link-btn a .yajirushi{
	width: 14%;
	display: inline-block;
	margin-left: 2.6%;
}
.link-btn a .yajirushi img{
	display: block;
	width: 100%;
}
	
.sec-5{
	padding-top: 14vw;
	padding-bottom: 0;
}
.ser-bg{
	padding-top: 0;
	padding-bottom: 26vw;
	margin-top: 14vw;
	background: url(../images/top/ser_bg.jpg) repeat center top / 239vw;
}
.ser-bg .ser-flex{
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	display: block;
}
.ser-bg .ser-flex .ser-list{
	width: 100%;
}
.ser-bg .ser-flex .ser-list ul{
	padding-top: 16.8vw;
	padding-bottom: 11vw;
	display:flex;
	flex-wrap: wrap;
}
.ser-bg .ser-flex .ser-list ul li{
	width: 49%;
	text-align: center;
	margin-top: 4vw;
}
	.ser-bg .ser-flex .ser-list ul li img{
		width: 100%;
	}
.ser-bg .ser-flex .ser-list ul li a{
	display: block;
}
.ser-bg .ser-flex .ser-list ul li .list-caption{
	margin-top: 2vw;
	line-height: 1;
	font-size: 3.7vw;
}
.ser-bg .ser-img{
	width: 66%;
	margin-left: auto;
	margin-right: auto;
}
.ser-bg .ser-img img{
	margin-top: -0px;
}
.ser-bg .house-img{
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 13vw;
}
	.ser-bg .house-img img{
		width: 100%;
	}
.sec-6{
	padding-top: 20vw;
	padding-bottom: 18vw;
	background: url("../images/top/his_bg.jpg") no-repeat center top / cover;
}
.sec-6 .pic-flex{
	display: block;
	margin-top: 7vw;
}
.sec-6 .pic-flex .img-box{
	width: 100%;
	display: block;
	margin-top: 6vw;
}
	
.sec-7{
	padding-top: 20vw;
	padding-bottom: 48vw;
	background: url("../images/top/sus_bg_sp.jpg") no-repeat center top / cover;
}
	
.sec-8{
	padding-top: 16vw;
	padding-bottom: 0;
}
.sec-8 .tab-link{
	margin-top: 13vw;
	margin-bottom: 10vw;
}
.sec-8 .tab-link li:last-child{
	border-right: none;
}
.sec-8 .tab-link li a{
	padding-bottom:2.6vw;
	padding-top: 2.6vw;
	text-align: center;
	line-height: 1;
	font-size: 3.2vw;
	background: #000;
}
.sec-8 .link-btn{
	position: absolute;
	bottom:8%;
	left: 0;
	right:0%;
	margin-left: auto;
	margin-right: auto;
}
.sec-8 .link-btn a{
	background: none;
}
}
.contents{
	width: 100%;
	overflow: hidden;
}
.com-area{
	background: linear-gradient(to bottom, #000, 50%, #333);
}
/*.sec-2,.sec-3,.sec-4 {
  background: linear-gradient(to bottom, #000, 50%, #333);
}*/
.con-flex{
	display: flex;
	justify-content: space-between;
}
.con-flex .text{
	width: 37.4%;
	max-width: 350px;
	margin-left: auto;
	margin-right: auto;
	display: flex;
	align-items: center;
	padding-top: 103px;
	padding-bottom: 75px;
	color: #fff;
}
.con-flex .bg-box{
	width: 50%;
	position: relative;
}
.con-flex .bg-box .bg-wrap{
	-webkit-transition: 0.6s;
    -o-transition: 0.6s;
    transition: 0.6s;
	position: fixed;
    height: 100%;
    width: 50%;
	right:0;
	top:0;
    /*margin-right: -100%;
    padding-right: 200%;*/
    margin-left: 0%;
    padding-left: 0%;
}
.con-flex .bg-box .bg-wrap.on{
}
.con-flex .bg-box .bg-ptn{
	-webkit-transition: 0.6s;
    -o-transition: 0.6s;
    transition: 0.6s;
	position: fixed;
    height: 100%;
    width: 50%;
	right:0;
	top:0;
    /*margin-right: -100%;
    padding-right: 200%;*/
    margin-left: 0%;
    padding-left: 0%;
	background: url("../images/top/ptn.png") repeat center top / 1360px;
}
.con-flex .bg-box .bg-wrap.bg-wrap1{
	background:url("../images/top/bg_01.jpg") no-repeat center center / cover;
	z-index: 8;
}
.con-flex .bg-box .bg-wrap.bg-wrap2{
	background:url("../images/top/bg_02.jpg") no-repeat center center / cover;
	z-index: 6;
}
.con-flex .bg-box .bg-wrap.bg-wrap3{
	background:url("../images/top/bg_03.jpg") no-repeat center center / cover;
	z-index: 4;
}
.con-flex .bg-box .bg-ptn.bg-ptn1{
	z-index: 9;
}
.con-flex .bg-box .bg-ptn.bg-ptn2{
	z-index: 7;
}
.con-flex .bg-box .bg-ptn.bg-ptn3{
	z-index: 5;
}
.con-flex .text .subcopy{
	text-align: center;
	color: #fff;
	line-height: 1.5;
	font-size: 20px;
	margin-bottom: 35px;
}
.con-flex .text .icon-list{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
.con-flex .text .icon-list li{
	width: 28%;
	text-align: center;
	margin-right: 8%;
	margin-bottom: 25px;
}
.con-flex .text .icon-list li.ex{
	width: 35%;
}
.con-flex .text .icon-list li .icon{
	margin-bottom: 3px;
}
.con-flex .text .icon-list li .icon img{
	display: block;
}
.con-flex .text .icon-list li .t-caption{
	font-size: 11px;
}
.con-flex .text .icon-list li:nth-child(3n){
	margin-right: 0;
}
.con-flex .text .icon-list li:last-child{
	margin-right: 0;
}
@media print, screen and (min-width : 901px) {
.con-flex .bg-box .bg-wrap{
	transform:translate(100px,0);
	opacity: 0;
	clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);

}
.con-flex .bg-box .bg-wrap.on{
	transform:translate(0%,0);
	opacity: 1;
	clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
}
.con-flex .bg-box .bg-ptn{
	transform:translate(100px,0);
	opacity: 0;
	clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
}
.con-flex .bg-box .bg-ptn.on{
	transform:translate(0%,0);
	opacity: 1;
	clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
}
	/*.con-flex .text p{
		font-size: 16px;
	}*/
}
@media only screen and (max-width : 900px) {
.sec-2,.sec-3,.sec-4 {
  background: linear-gradient(to bottom, #000, 50%, #333);
}
.container.ex{
    width: 100%!important;
    margin-left: auto;
    margin-right: auto;
}
.con-flex{
	display: block;
	justify-content: space-between;
}
.con-flex .text{
	width: 92%;
	display: block;
	align-items: center;
	padding-top: 22vw;
	padding-bottom: 24vw;
	max-width: none;
}
.con-flex .bg-box{
	width: calc(100% + 60px);
	margin-left: -30px;
	margin-right: -30px;
	position: relative;
	height: 130vw;
	top:0;
	right: 0;
}
.con-flex .bg-box .bg-wrap{
	-webkit-transition: 0.6s;
    -o-transition: 0.6s;
    transition: 0.6s;
	position: absolute;
    height: 100%;
    width: 100%;
    margin-right: 0%;
    padding-right: 0%;
    margin-left: 0%;
    padding-left: 0%;
	top:0;
	right: 0;
}
.con-flex .bg-box .bg-ptn{
	background: url("../images/top/ptn.png") repeat center top / 1360px;
	-webkit-transition: 0.6s;
    -o-transition: 0.6s;
    transition: 0.6s;
	transform:translate(0%,0);
	position: absolute;
    height: 100%;
    width: 100%;
    margin-right: 0%;
    padding-right: 0%;
    margin-left: 0%;
    padding-left: 0%;
	top:0;
	right: 0;
}
.con-flex .bg-box .bg-wrap.on{
	transform:translate(0%,0);
}
.con-flex .text .subcopy{
	text-align: center;
	color: #fff;
	line-height: 1.5;
	font-size: 5.1vw;
	margin-bottom: 8vw;
}
.con-flex .text .icon-list{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
.con-flex .text .icon-list li{
	width: 29%;
	text-align: center;
	margin-right: 6%;
	margin-bottom: 2vw;
}
.con-flex .text .icon-list li.ex{
	width: 35%;
}
.con-flex .text .icon-list li .icon{
	margin-bottom: 1vw;
}
.con-flex .text .icon-list li .icon img{
	display: block;
}
.con-flex .text .icon-list li .t-caption{
	font-size: 2.6vw;
}
.con-flex .text .icon-list li:nth-child(3n){
	margin-right: 0;
}
.con-flex .text .icon-list li:last-child{
	margin-right: 0;
}	
.con-flex .bg-box .bg-wrap{
	opacity: 0;
}
.con-flex .bg-box .bg-wrap.on{
	opacity: 1;
}
.con-flex .bg-box .bg-ptn{
	opacity: 0;
}
.con-flex .bg-box .bg-ptn.on{
	opacity: 1;
}
	.sec-8 .bnr-box img{
		width: 100%;
	}
}
@media only screen and (max-width : 520px) {
.ser-bg .ser-flex .ser-list ul{
	padding-top: 16.8vw;
	padding-bottom: 11vw;
	display: block;
}
.ser-bg .ser-flex .ser-list ul li{
	width: 100%;
	text-align: center;
	margin-top: 4vw;
}
}
@media print, screen and (min-width : 1025px) {
}
@media print, screen and (min-width : 1400px) {

}
@media screen and (max-width:  992px) and (min-width: 768px) {

}
/*--- スクロール ---*/
.scroll{
	position: fixed;
	bottom: 0px;
	width: 9px;
	right: 5%;
	height: 80px;
	z-index: 15;
		transition: 1.0s;
	-webkit-transition: 1.0s; /* Chrome、Safari用 */
	-moz-transition: 1.0s; /* Firefox用 */
	-o-transition: 1.0s; /* Opera用 */
		-moz-transition-delay:0s;
-webkit-transition-delay:0s;
-o-transition-delay:0s;
-ms-transition-delay:0s;
}
.scroll.UpMove,
.scroll.DownMove {
	opacity: 0;
}
.scroll .sc-img{
	position: absolute;
	left: 0;
	right: -25px;
	width: 25px;
	margin-left: auto;
	margin-right: auto;
	top:0%;
}
.scroll::after{
  content: "";
    /*描画位置*/
  position: absolute;
  top: 0;
    /*線の形状*/
  width: 1px;
  height: 30px;
	left: 0;
	right: 0;
	margin-left: 32%;
	margin-right: auto;
  background: #fff;
    /*線の動き1.4秒かけて動く。永遠にループ*/
  animation: pathmove 3.0s ease-in-out infinite;
  opacity:0;
	box-shadow: rgba(0,0,0,0.47) 0 3px 6px;
}

@keyframes pathmove{
  0%{
    height:0;
    height:50px;
    opacity: 1;
  }
  25%{
    height:50px;
    opacity: 1;
  }
  50%{
    height:50px;
    top:30px;
    opacity: 1;
  }
  75%{
    height:50px;
    opacity: 1;
  }
  100%{
    height:0;
    height:50px;
    opacity: 1;
  }
}
@media only screen and (max-width : 900px) {
	.copy-right{
		border-top: 0;
	}
.scroll .sc-img{
	position: absolute;
	left: 0;
	right: -5vw;
	width: 5vw;
	margin-left: auto;
	margin-right: auto;
	top:0%;
}	
}