@charset "utf-8";

.effect {
    opacity: 0;
    transform: translateY(20px);
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -ms-transition: all 1s;
    -o-transition: all 1s;
    transition: all 1s;
}

.effect.fadeInUp {
    opacity: 1;
    transform: translateY(0);
}

.renewMvPlot {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    opacity: 0;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -ms-transition: all 1s;
    -o-transition: all 1s;
    transition: all 1s;
}

.renewMvCopy {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    opacity: 0;
    -webkit-transition: all 2s;
    -moz-transition: all 2s;
    -ms-transition: all 2s;
    -o-transition: all 2s;
    transition: all 2s;
    transform: translateY(20px);
}

.renewMvPlot.active {
    opacity: 1;
}

.renewMvCopy.active {
    opacity: 1;
    transform: translateY(0);
}

#first-modal {
    display: block;
}

#contentsWrap {
	background:none;
}
.skipPrevWrap{
	line-height:1.5;
	font-size:16px;
	display:none;
}

.skipPrevWrap div{
	position:absolute;
	top: 10px;
	right:20px;
	background:#FFF;
	z-index:100000;
	cursor:pointer;
	font-size:0;
	line-height:0;
}

.skipPrevWrap div:hover img{
	opacity:0.5;
}

.volumeWrap{
	display:none;
}

.volumeWrap div{
	position:absolute;
	top: 10px;
	right:123px;
	background:#FFF;
	z-index:100000;
	cursor:pointer;
	font-size:0;
	line-height:0;
}

.volumeWrap div:hover img{
	opacity:0.7;
}

#mainImage{
	position:relative;
	/* margin-top:80px; */
	max-width:1400px;
	margin:0 auto;
	overflow: hidden;
	/* background:#000000; */
}

#mainImage:after {
	content:"";
	display:block;
	padding-top:50%;
}

.KVSecWrap{
	position:absolute;
	width:100%;
	max-width:1400px;
	margin:auto;
	top:0;
	left:0;
	right:0;
	z-index:99999;
	overflow:hidden;
}

.KVSecWrap div img:nth-child(n+2){
	display: block;
	position: absolute;
	z-index: 2;
	top: 0;
	left: 0;
	right:0;
	opacity:0;
	transition:opacity 1s ease-in-out 0s;
}

.KVSecWrap div img:nth-child(n+2).active{
	opacity:1;
}

#topVideo{
	position:absolute;
	width: 1400px;
	max-width:100%;
	/* height:1000px; */
	margin:auto;
	top: 0;
	left:0;
	right:0;
	/* bottom: 0; */
	z-index: 99999;
	/* margin-top:80px; */
	/* max-height:860px; */
	overflow:hidden;
	background: #000;
	display:none;
}

#topVideo:after{
	content:"";
	position:relative;
	padding-top:56.21428571428571%;
	z-index:90;
	display: block;
	overflow:hidden;
	background:transparent;
}

#topVideo iframe{
	width:100%;
	height:100%;
	/* max-height: 787px; */
	position:absolute;
	top: 0;
	left: 0;
}

.mobile #topVideo:after{
	z-index:1;
}

.mobile #topVideo iframe{
	z-index:2;
}

.kdtk_wrap{
	padding: 0 10px 10px;
}

.mainte_wrap{
	max-width:960px;
	border:1px solid #000;
	padding:15px;
	margin:0 auto;
	text-align:center;
	background:#FFF;
	letter-spacing:0.1em;
	box-sizing:border-box;
	color:#000;

}

.mainte_wrap .m1{
	border-bottom:1px solid #000;
	padding-bottom:10px;
	margin-bottom:10px;
}

.mainte_wrap .m2{
	border-bottom:1px dotted #000;
	padding-bottom:10px;
	margin-bottom:10px;
}

.kdtk{
	max-width:960px;
	margin: 0px auto;
}

.kdtk .txt{
	margin-bottom:10px;
}

.kdtk .txt2{
	margin-bottom:40px;
}

.kdtk .txt3{
	text-align:center;
	margin-bottom:20px;
}

.information {
    margin-top: -30px;
    padding-bottom: 10px;
    max-width: 630px !important;
}

.information201812{
	margin-top: 20px;
	padding: 40px 0;
	max-width: 800px !important;
}
@media screen and (max-width: 768px){
	.information201812{
		margin-top: 0;
		max-width: 560px !important;
	}
}

#information .newInfo {
    text-align: center;
    margin-top: 50px;
}

#information .newInfo p {
    display: inline-block;
    box-sizing: border-box;
    padding-left: 70px;
    font-size: 20px;
    font-family: "游明朝", Yu Mincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
    color: #333;
    line-height: 1.6;
    text-align: left;
    position: relative;
    color: #FFF;
}

#information .newInfo p .icon {
    display: block;
    position: absolute;
    top: 2px;
    left: 0;
    font-size: 18px;
    color: #FFF;
    background-color: #bc1017;
    line-height: 1;
    padding: 5px 5px 4px;
    vertical-align: top;
    margin-right: 10px;
}

#information .informationBnr{
	max-width: 600px;
	/*margin-top: 50px;*/
	margin-top: 30px;
	color: #fff;
}


div#top_flo {
    position: fixed;
    right: 70px;
    top: 200px;
    z-index: 1000000;
    width: 250px;
    height: 167px;
}

div#top_flo_area{
    cursor: move;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

div#top_flo .flo_close{
	position:absolute;
	right:3px;
	top:3px;
	z-index:100;
}

div#top_flo_area p{
    line-height: 0;
    font-size: 0;
}



.price{
	background: url(../img/bg_black.jpg) center top repeat;
	padding:20px 10px;
	text-align:center;
	line-height:0;
	font-size:0;
}

.price .human{
	max-width:930px;
	margin:0 auto;
}

.price .human li{
	float:left;
	width:48.93%;
}

.price .human li:nth-child(2){
	float:right;
}

.designer .human{
	max-width:930px;
	margin:0 auto;
}

.designer .human li{
	float:left;
	width:48.93%;
}

.designer .human li:nth-child(2){
	float:right;
}

.main_obi{
	background:url("../../img/main_obi_bg.jpg") center top repeat;
	padding: 30px 10px;
}

.obi_in{
	max-width:960px;
	margin:0 auto;
}

.obi_in .obi_box{
	max-width:930px;
	margin:0 auto;
	border:2px solid #FFF;
	padding:10px;
	box-sizing:border-box;
}


.event_cap{
	max-width:960px;
	margin:0 auto;
}

.event{
	/*
	border-top:1px solid #CCC;
	border-bottom:1px solid #CCC;
	background:url("../../img/info_bg.png") left top repeat;
	*/
	padding: 0 10px 30px;
	margin-top: -20px;
}

.linkBnr {
    max-width: 960px;
    width: 100%;
    margin: 50px auto 0;
}

.linkBnr li + li {
    margin-top: 20px;
}

.b_ttl{
	background: #8F935B;
	padding:5px;
}

.event_in{
	max-width:960px;
	border: 3px solid #8F935B;
	background:#FFF;
	margin:0 auto;
	padding: 20px;
	box-sizing:border-box;
	/* margin-bottom: 50px; */
	width: 95%;
}

.seminarTtl {
    margin-bottom: 20px;
}

.seminarList li + li {
    margin-top: 40px;
    padding-top: 40px;
    border-top: solid 1px #80835e;
}

.uline{
	border-bottom:1px dotted rgba(0,0,0,0.5);
	padding-bottom: 20px;
}

.uline02{
	border-top:1px dotted rgba(0,0,0,0.5);
	border-bottom:1px dotted rgba(0,0,0,0.5);
	padding:20px 0;
}

.event_wrap{
	position:relative;
}

.ev_btn{
	position:absolute;
	right:23.4%;
	top:8px;
	z-index:100;
	max-width: 220px;
}

.red_obi{
	background:url(../../img/red_obi_bg.jpg) center top repeat-x;
	text-align:center;
	padding:20px 10px;
	vertical-align:middle;
	margin-bottom:45px;
	margin-top:-1px;
	z-index:99999;
	position:relative;
}

.obi_info{
	border:1px solid #860D10;
	max-width:780px;
	margin:30px auto 30px;
	padding:10px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	text-align:center;
}



/* 180422 */
#point {
    padding: 40px 0;
    border-bottom: solid 1px #a2a2a2;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#003311+0,016032+50,003311+100 */
    background: rgb(0,51,17); /* Old browsers */
    background: -moz-linear-gradient(left, rgba(0,51,17,1) 0%, rgba(1,96,50,1) 50%, rgba(0,51,17,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(0,51,17,1) 0%,rgba(1,96,50,1) 50%,rgba(0,51,17,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(0,51,17,1) 0%,rgba(1,96,50,1) 50%,rgba(0,51,17,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#003311', endColorstr='#003311',GradientType=1 ); /* IE6-9 */
}

#point ul li {
    float: left;
    max-width: 324px;
    width: 32.4%;
}

#point ul li + li {
    margin-left: 1.4%;
}

#information {
    padding: 25px 0 40px;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#003311+0,016032+50,003311+100 */
    background: rgb(0,51,17); /* Old browsers */
    background: -moz-linear-gradient(left, rgba(0,51,17,1) 0%, rgba(1,96,50,1) 50%, rgba(0,51,17,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(0,51,17,1) 0%,rgba(1,96,50,1) 50%,rgba(0,51,17,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(0,51,17,1) 0%,rgba(1,96,50,1) 50%,rgba(0,51,17,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#003311', endColorstr='#003311',GradientType=1 ); /* IE6-9 */
}

#information .notes {
    font-size: 11px;
    line-height: 1.8;
    color: #FFF;
    text-align: left;
    font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
    max-width: 800px;
    width: 90%;
    margin: 15px auto 0;
}

#cpBnr {
    padding: 60px 0;
}

#cpBnr span {
    display: block;
    max-width: 900px;
    width: 100%;
    margin: 0 auto;
}

#cpBnr span + span {
    margin-top: 30px;
}

.bgBox.cpArea {
    padding: 0 0 60px;
}

#pickupPlan {
    background: url(../../img/renew/plan_bg.jpg) no-repeat center;
    background-size: cover;
}

#pickupPlan h3 {
	background: url(../../img/renew/plan_ttl_bg.png) no-repeat bottom center;
	background-size: 100% 100%;
	padding: 40px 0 80px;
	margin-bottom: 40px;
}

#pickupPlan h3 img {
    max-width: 640px;
    width: 87.5%;
    margin: 0 auto;
}

#pickupPlan .planWrap {
    max-width: 900px;
    /* max-width: 1310px; */
    overflow: hidden;
}

#pickupPlan .planMain {
    max-width: 410px;
    width: 45.5556%;
    /* width: 31.2978%; */
    margin: 0 auto;
}

#pickupPlan .planMain h4 {
    margin-bottom: 30px;
}

#pickupPlan .planMain .figure {
    margin-top: 30px;
}

#pickupPlan .planWrap .fl {
    float: left;
    margin: 0 auto;
}

#pickupPlan .planWrap .fr {
    float: right;
    margin: 0 auto;
}

#pickupPlan .planWrap .fl + .fl {
    margin-left: 3.0534%;
}

#pickupPlan .planMain a {
    display: block;
    max-width: 300px;
    margin: 40px auto 0;
}

#pickupPlan .planMain .notes {
    margin-top: 10px;
}

#pickupPlan .linkBox {
    margin-top: 50px;
    background: rgba(207, 207, 207, 0.4);
    padding: 50px 0 30px;
}

#pickupPlan .linkBox ul {
    letter-spacing: 40px;
}

#pickupPlan .linkBox ul li {
    display: inline-block;
    max-width: 320px;
    margin-bottom: 20px;
}

#pickupPlan .planMain h4 img {
    display: block;
}


@media screen and (max-width: 1366px) {
	#pickupPlan .planWrap {
		max-width: 900px;
	}

	#pickupPlan .planMain {
		width: 45.5556%;
	}

	#pickupPlan .planWrap .fl + .fl {
		margin-left: 0;
		float: right;
	}

	#pickupPlan .planWrap .fl + .fl + .fl {
		float: none;
		margin: 0 auto;
	}

	#pickupPlan .planWrap .fl {
		margin-bottom: 60px;
	}
}



.specNotes {
    font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
    margin-top: 20px;
}

.figureNotes {
    font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
    margin-top: 5px;
    font-size: 11px;
}

#merit {
    background: url(../../img/renew/merit_bg.jpg) no-repeat center;
    background-size: cover;
    padding-bottom: 90px;
}

#merit h3 {
	background: url(../../img/renew/merit_ttl_bg.png) no-repeat bottom center;
	background-size: 100% 100%;
	padding: 50px 0 90px;
	margin-bottom: 60px;
}

#merit h3 img {
    max-width: 640px;
    width: 87.5%;
    margin: 0 auto;
}

#merit ol {
    max-width: 860px;
    width: 95%;
    margin: 0 auto;
}

#merit ol li {}

#merit ol li + li {
    margin-top: 40px;
}

#merit ol li h4 {
    font-size: 27px;
    font-weight: normal;
    color: #000000;
    font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
    line-height: 1.4;
    padding-left: 55px;
    position: relative;
    text-align: left;
}

#merit ol li h4 .num {
    max-width: 35px;
    display: block;
    position: absolute;
    top: 0;
    left: 15px;
}

#merit ol li .figure {
    margin-top: 20px;
}

#merit ol li p {
    font-size: 16px;
    line-height: 1.6;
    text-align: left;
    padding-left: 55px;
    margin-top: 10px;
    color: #000000;
    font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

#topLinkArea {}

#topLinkArea .linkBoxInner {
    float: left;
    width: 25%;
    box-sizing: border-box;
    padding: 20px;
    position: relative;
    overflow: hidden;
    margin: 0;
}

#topLinkArea .linkBoxInner a {
    display: block;
    width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
    border: solid 1px #a2a2a2;
    padding: 50px 0 30px;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -ms-transition: all 1s;
    -o-transition: all 1s;
    transition: all 1s;
}

#topLinkArea .linkBoxInner:hover a {
    background: rgba(0, 0, 0, 0.4);
}

#topLinkArea .linkBoxInner .ttl {
    display: block;
    max-width: 260px;
    width: 72.2223%;
    margin: 0 auto 20px;
}

#topLinkArea .linkBoxInner .text {
    display: block;
    max-width: 260px;
    width: 72.2223%;
    margin: 0 auto 25px;
}

#topLinkArea .linkBoxInner .btn {
    display: block;
    max-width: 240px;
    width: 66.6667%;
    margin: 0 auto;
}

.linkBoxInner .bg {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: 0;
    z-index: -1;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -ms-transition: all 1s;
    -o-transition: all 1s;
    transition: all 1s;
    width: 100%;
}

.linkBoxInner.plan .bg {
	background: url(../../img/renew/plan_link_bg.jpg) no-repeat center;
	background-size: cover;
}
.linkBoxInner.access .bg {
	background: url(../../img/renew/access_link_bg.jpg) no-repeat center;
    background-size: cover;
}
.linkBoxInner.location .bg {
	background: url(../../img/renew/location_link_bg.jpg) no-repeat center;
    background-size: cover;
}
.linkBoxInner.landplan .bg {
	background: url(../../img/renew/landplan_link_bg.jpg) no-repeat center;
    background-size: cover;
}
.linkBoxInner.gallery .bg {
	background: url(../../img/renew/gallery_link_bg.jpg) no-repeat center;
    background-size: cover;
}
.linkBoxInner.life .bg {
	background: url(../../img/renew/life_link_bg.jpg) no-repeat center;
    background-size: cover;
}
.linkBoxInner.equipment .bg {
	background: url(../../img/renew/equipment_link_bg.jpg) no-repeat center;
    background-size: cover;
}
.linkBoxInner.bus .bg {
	background: url(../../img/renew/bus_link_bg.jpg) no-repeat center;
    background-size: cover;
}

#topLinkArea .linkBoxInner.equipment {
    border: none;
}

.linkBoxInner:hover .bg {
    width: 120%;
    margin-left: -10%;
}

.linkBoxInner:hover .bg {
    width: 120%;
    margin-left: -10%;
}

#topLinkArea .linkBoxInner.new:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    max-width: 100px;
    width: 28.5715%;
    height: 100px;
    background: url(../../img/renew/link_ico_new.png) no-repeat top right;
    background-size: contain;
    z-index: 1;
}
.bgBox{
	background: url(../../img/renew/plan_bg.jpg) no-repeat center;
	background-size: cover;
}
.application {
/*    background: url(../../img/renew/plan_bg.jpg) no-repeat center;*/
/*    background-size: cover;*/
   padding: 50px 0 0px;
}

.application span {
    max-width: 620px;
    width: 87.5%;
    margin: 0 auto;
    display: block;
}

.infoRegist {
    max-width: 620px !important;
    margin-top: 40px;
}


@media (max-width: 768px) {
	#merit ol li .figure img{
		margin-left: auto;
		margin-right: auto;
	}
}


@media (max-width: 767px) {

	.skipPrevWrap div{
		top:10px;
	}

	.KVSecWrap div:before{
	    top: 42%;
	}

	.KVSecWrap div:after{
	    top: 42%;
	}

	.volumeWrap div{
		top:10px;
	}

	#mainImage{
		height:auto;
		/* padding-top:30px; */
	}

	#topVideo{
		padding-top: 40px;
		top:0;
	}

	#topVideo:after{
		z-index:1;
	}

	#topVideo iframe{
		z-index:2;
		top: 40px;
		height: calc(100% - 40px);
		bottom: 0;
	}

	.KVSecWrap{
		position:relative;
		max-height: none;
	}

	.event_cap{
		max-width:640px;
		margin:0 auto;
	}

	.event{
		padding: 0 10px 50px;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
		margin-top: -20px;
	}

	.ev_btn{
		position:static;
		padding-top: 10px;
		margin: auto;
	}

	.price{
		padding:20px;
	}

	.red_obi{
		margin-bottom:30px;
		background-size:auto 100%;
		padding:20px;
	}

	.kdtk .txt{
		margin-bottom:20px;
	}

	.kdtk .txt2{
		margin-bottom:30px;
	}


	.price .human li{
		float:none;
		width:auto;
		text-align:center;
		margin-bottom:20px;
	}

	.price .human li:nth-child(2){
		float:none;
		width:auto;
		margin-bottom:0;
	}

	.main_obi{
		padding:30px 10px;
	}

	.obi_in .obi_box{
		float:none;
		max-width:460px;
		margin:0 auto;
		width:auto;
		padding:15px 10px;
	}

	.information {
	    padding-bottom: 70px;
	}

	.information201812{
		padding: 40px 20px 20px;
	}

	#information .newInfo p {
		font-size: 16px;
		padding-left: 60px;
	}

	#information .newInfo p .icon {
		font-size: 14px;
		top: 0;
		left: 0;
	}

	#information .informationBnr{
		margin-top: 30px;
	}

	.event_in {
		width: 87.5%;
		/* margin-bottom: 20px; */
	}

	.bgBox.cpArea {
		padding: 0 0 40px;
	}

	#cpBnr {
		padding: 40px 0;
	}

	#point ul li {
	    float: none;
	    max-width: 100%;
	    width: 100%;
	}

	#point ul li + li {
	    margin-left: 0;
	    margin-top: 20px;
	}

	#pickupPlan .planWrap .fl {
	    float: none;
	    margin-bottom: 50px;
	}

	#pickupPlan .planWrap .fr {
	    float: none;
	}

	#pickupPlan .planWrap .fl + .fl {
		margin-left: 0;
	}

	#pickupPlan .planMain {
	    max-width: 100%;
	    width: 100%;
	}

	#merit ol li h4 {
	    font-size: 18px;
	    padding-left: 45px;
	}

	#merit ol li h4 .num {
	    max-width: 20px;
	    top: 2px;
	    line-height: 1;
	}

	#merit ol li p {
	    padding-left: 45px;
	    font-size: 14px;
	}

	#modelroom h4 {
	    font-size: 19px;
	}

	#topLinkArea .linkBoxInner {
	    float: none;
	    width: 100%;
	}

	#merit ol li .figure {
	    width: 80%;
	    margin: 20px auto 0;
	}





}




	
