@charset "utf-8";


.content{
	min-width:940px;
}

#top_menu ul li:nth-child(3) p:first-child{
    color: #205167 !important;
}
.fixed{
	position:fixed !important;
}


.pc_menu {
    display: block !important;
    width: 100%;
    height: 60px;
    background: #fff;
    position: absolute;
    top: 0px;
	z-index:9999;
}

.pc_mansion_wrap {
    background-image: url(../../images/mansion/mansion_bg.jpg);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
}

.mansion_top_area{
	display:block;
	width:100%;
	height:604px;
	position:relative;
	background:url(../../images/mansion/mansion_top_bg.jpg) no-repeat top center;
	background-size:cover;
	margin-top:60px;
}

.mansion_top_area:before{
	display:block;
	width:100%;
	height:240px;
	content:'';
	position:absolute;
	background:url(../../images/mansion/mansion_top_area_before.png) no-repeat top left;
	background-size:cover;
	top:0;
	left:0;
}
.mansion_top_area:after{
	display:block;
	width:100%;
	height:240px;
	content:'';
	position:absolute;
	background:url(../../images/mansion/mansion_top_area_after.png) no-repeat top right;
	background-size:cover;
	bottom:0;
	right:0;
}


.mansion_top_area p.pan{
	position:relative;
	z-index:2;
	font-size:0.9rem;
	top:40px;
	width:95%;
	max-width:940px;
	margin:0 auto;
}
.mansion_top_area p.pan a{
	font-size:0.9rem;
	display:inline-block;
	margin-right:15px;
}

.mansion_top_area_title{
	width:100%;
	max-width:940px;
	margin:0 auto;
	position:relative;
	top:35%;
}


.mansion_top_area h2{
	display:block;
	width:470px;
	text-align:center;
	position:absolute;
	height:48px;
	line-height:48px;
	right:0;
	font-size:2.4rem;
	letter-spacing:0.8rem;
	color:#fff;
	font-weight:normal;
	z-index:2;
}

.mansion_top_area h2:after{
	position:absolute;
	display:block;
	content:'';
	height:22px;
	width:100%;
	bottom:-5px;
	background:rgba(0,29,49,0.5);
	z-index:-1;
}

.mansion_top_text{
	position:relative;
	width:100%;
	max-width:940px;
	margin:0 auto -120px;
	text-align:right;
	top:-120px;
	
}
.mansion_top_text p{
	font-size:1.1rem;
	line-height:2rem;
	color:#000;
}
.mansion_top_text p:first-child{
	margin-bottom:20px;
}

.mansion_title{
	width:100%;
	height:372px;
	background: url("../../images/mansion/mansion_content_title_bg.png") no-repeat top center;
    z-index: 99;
    position: relative;
}
.mansion_title .title{
	position:relative;
	top:20%;
}

.mansion_title .title h2{
	color:#fff;
}

.mansion_title .title p{
	color:#fff;
	font-weight:normal;
}

/*================================================*/
.mansion_content01{
    position: relative;
    width: 100%;
    height: 700px;
    background-size: cover;
    margin-top: -350px;
}

.mansion_content01 .inner{
    display: block;
    width: 90%;
    max-width: 1000px;
    position: relative;
    top: 240px;
    margin: 0 auto;
}

.mansion_content01 p{
	display:block;
	position:absolute;
	width:50%;
	color:#fff;
	font-weight:bold;
	line-height:2rem;
	font-size:1.1rem;
	right:0;
}

.mansion_content01 p font{
	font-weight:normal;
	display:block;
	margin-top:20px;
	font-size:0.8rem;
	line-height:1.8rem;
	position:relative;

}
.left_title1{
	position:absolute;
	left:0;
	top:100px;
	bottom:0;
    width: 260px;
    height: 160px;
	text-align:center;
    background: rgba(0,0,0,0.6);
}

.left_title1 p{
	display:block;
	width:100%;
	font-size:1.4rem;
	font-weight:normal;
	letter-spacing:0.2rem;
	bottom:30%;
	right:0;
	left:0;
	margin:auto;
	
}
.left_title1 p font{
	font-size:2.4rem;
	
}

.left_title1 .border-line-inner-wrap,.left_title2 .border-line-inner-wrap,
.left_title3 .border-line-inner-wrap,.left_title4 .border-line-inner-wrap,
.left_title5 .border-line-inner-wrap,.left_title6 .border-line-inner-wrap{
    height: 160px;
    margin: 0px;
}

/*================================================*/
.mansion_content02{
position: relative;
    width: 100%;
    height: 695px;
    background-size: cover;
    margin-top: -180px;
}

.mansion_content02 .inner{
	display:block;
	width:90%;
	max-width:1000px;
	position:relative;
	top:230px;
	margin:0 auto;
}

.mansion_content02 p{
	display:block;
	position:absolute;
	width:50%;
	color:#fff;
	font-weight:bold;
	line-height:2rem;
	font-size:1.1rem;
	right:0;
}

.mansion_content02 p font{
	font-weight:normal;
	display:block;
	margin-top:20px;
	font-size:0.8rem;
	line-height:1.8rem;
	position:relative;
}
.left_title2{
    position: absolute;
    left: 0;
    top: 60px;
    bottom: 0;
    width: 260px;
    height: 160px;
    text-align: center;
    background: rgba(0,0,0,0.6);
}

.left_title2 p{
	display:block;
	width:100%;
	font-size:1.4rem;
	font-weight:normal;
	letter-spacing:0.2rem;
	bottom:30%;
	right:0;
	left:0;
	margin:auto;
	
}
.left_title2 p font{
	font-size:2.4rem;
	
}
/*================================================*/
.mansion_content03{
	position:relative;
	width:100%;
	height:695px;

	background-size:cover;
	margin-top:-180px;
}

.mansion_content03 .inner{
	display:block;
	width:90%;
	max-width:1000px;
	position:relative;
	top:200px;
	margin:0 auto;
}

.mansion_content03 p{
	display:block;
	position:absolute;
	width:50%;
	color:#fff;
	font-weight:bold;
	line-height:2rem;
	font-size:1.1rem;
	right:0;
}

.mansion_content03 p font{
	font-weight:normal;
	display:block;
	margin-top:20px;
	font-size:0.8rem;
	line-height:1.8rem;
	position:relative;

}
.left_title3{
	position:absolute;
	left:0;
	top:100px;
	bottom:0;
	width:260px;
	height:160px;
	text-align:center;
    background: rgba(0,0,0,0.6);
}

.left_title3 p{
	display:block;
	width:100%;
	font-size:1.4rem;
	font-weight:normal;
	letter-spacing:0.2rem;
	bottom:30%;
	right:0;
	left:0;
	margin:auto;
	
}
.left_title3 p font{
	font-size:2.4rem;
	
}
/*================================================*/
.mansion_content04{
	position:relative;
	width:100%;
	height:695px;

	background-size:cover;
	margin-top:-180px;
}

.mansion_content04 .inner{
	display:block;
	width:90%;
	max-width:1000px;
	position:relative;
	top:200px;
	margin:0 auto;
}

.mansion_content04 p{
	display:block;
	position:absolute;
	width:50%;
	color:#fff;
	font-weight:bold;
	line-height:2rem;
	font-size:1.1rem;
	right:0;
}

.mansion_content04 p font{
	font-weight:normal;
	display:block;
	margin-top:20px;
	font-size:0.8rem;
	line-height:1.8rem;
	position:relative;

}
.left_title4{
	position:absolute;
	left:0;
	top:80px;
	bottom:0;
	width:260px;
	height:160px;
	text-align:center;
    background: rgba(0,0,0,0.6);
}

.left_title4 p{
	display:block;
	width:100%;
	font-size:1.4rem;
	font-weight:normal;
	letter-spacing:0.2rem;
	bottom:25%;
	right:0;
	left:0;
	margin:auto;
	
}
.left_title4 p font{
	font-size:2.4rem;
	
}
/*================================================*/
.mansion_content05{
	position:relative;
	width:100%;
	height:695px;
	background-size:cover;
	margin-top:-180px;
	margin-bottom: -100px;
}

.mansion_content05 .inner{
	display:block;
	width:90%;
	max-width:1000px;
	position:relative;
	top:200px;
	margin:0 auto;
}

.mansion_content05 p{
	display:block;
	position:absolute;
	width:50%;
	color:#fff;
	font-weight:bold;
	line-height:2rem;
	font-size:1.1rem;
	right:0;
}

.mansion_content05 p font{
	font-weight:normal;
	display:block;
	margin-top:20px;
	font-size:0.8rem;
	line-height:1.8rem;
	position:relative;

}
.left_title5{
	position:absolute;
	left:0;
	top:80px;
	bottom:0;
	width:260px;
	height:160px;
	text-align:center;
    background: rgba(0,0,0,0.6);
}

.left_title5 p{
	display:block;
	width:100%;
	font-size:1.4rem;
	font-weight:normal;
	letter-spacing:0.2rem;
	bottom:25%;
	right:0;
	left:0;
	margin:auto;
	
}
.left_title5 p font{
	font-size:2.4rem;
	
}



/*================================================*/




/* PC */

@media screen and (min-width:769px){
.sp_area{display:none;}
}

@media screen and (max-width:980px){
.pc_menu {
	display:none !important;
}
.mansion_top_area{
	display:block;
	margin-top:0px;

}
}


/* mobile */

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

.pc_menu {
	display:none !important;
}


.content{
	max-width:736px;
	min-width:320px;
	margin:0 auto;
}

.mansion_top_area{
	display:block;
	width:100%;
	height:400px;
	position:relative;
	background:url(../../images/mansion/mansion_top_bg.jpg) no-repeat top center;
	background-size:cover;
	margin-top:0;
}

.mansion_top_area:before{
	display:block;
	width:100%;
	height:90px;
	content:'';
	position:absolute;
	background:url(../../images/mansion/mansion_top_area_before.png) no-repeat top left;
	background-size:cover;
	top:0;
	left:0;
}
.mansion_top_area:after{
	display:block;
	width:100%;
	height:90px;
	content:'';
	position:absolute;
	background:url(../../images/mansion/mansion_top_area_after.png) no-repeat top right;
	background-size:cover;
	bottom:0;
	right:0;
}


.mansion_top_area p.pan{
	position:relative;
	z-index:2;
	font-size:0.7rem;
	top:10px;
	width:95%;
	max-width:940px;
	margin:0 auto;
}
.mansion_top_area p.pan a{
	font-size:0.7rem;
	display:inline-block;
	margin-right:15px;
}

.mansion_top_area_title{
	width:90%;
	max-width:940px;
	margin:0 auto;
	position:relative;
	top:35%;
}


.mansion_top_area h2{
	display:block;
	width:470px;
	text-align:center;
	position:absolute;
	height:48px;
	line-height:48px;
	right:0;
	font-size:2.4rem;
	letter-spacing:0.8rem;
	color:#fff;
	font-weight:normal;
	z-index:2;
}

.mansion_top_area h2:after{
	position:absolute;
	display:block;
	content:'';
	height:22px;
	width:100%;
	bottom:-5px;
	background:rgba(0,29,49,0.5);
	z-index:-1;
}

.mansion_top_text{
	position:relative;
	width:100%;
	max-width:80%;
	margin:0 auto -60px;
	text-align:left;
	top:0px;
	
}
.mansion_top_text p{
	font-size:1.1rem;
	line-height:2rem;
	color:#000;
}
.mansion_top_text p:first-child{
	margin-bottom:20px;
}



.mansion_title{
	width:100%;
	height:280px;
	background:#001D31;
	position:relative;
}



.mansion_title .title{
	position:relative;
	top:20%;
}

.mansion_title .title h2{
	color:#fff;
}

.mansion_title .title p{
	color:#fff;
	font-weight:normal;
}

/*=================================================*/

.sp_mansion_wrap {
    background-image: url(../../images/mansion/mansion_bg.jpg);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
}

.sp_mansion_content01{
	position:relative;
	width:100%;
	height:305px;
	background:url(../../images/mansion/mansion_content01.jpg);
    background-position: center top;
	background-size:cover;
	margin-top:-92px;
	z-index:99;
}
/*
.sp_mansion_content01:before{
    display: block;
    width: 100%;
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    min-height: 100px;
    background: url(../../images/mansion/sm_mansion_footer2.png) no-repeat top center;
    background-size: cover;
}
    
.sp_mansion_content01:after{
    display: block;
    width: 100%;
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    min-height: 100px;
    background: url(../../images/mansion/sm_mansion_footer.png) no-repeat top center;
    background-size: cover;
}
*/
.sp_mansion_content .sp_title01{
	width:196px;
	height:100px;
	text-align:center;
	position:relative;
	top:40%;
	left:40px;
    border: 1px solid #fff;
    background: rgba(0,0,0,0.6);
}

.sp_mansion_content .sp_title01 p{
	font-size:1rem;
	color:#fff;
	padding-top:15px;
	letter-spacing:0.2rem;
}
.sp_mansion_content .sp_title01 p font{
	display:block;
	margin-top:40px;
	font-size:1.6rem;
	color:#fff;
}

.sp_mansion_content .sp_mansion_text{
	color:#fff;
	display:block;
	width:50%;
	position:absolute;
	right:0;
	top:45%;
	line-height:1.6rem;
	font-weight:bold;
}



/*=================================================*/
.sp_mansion_content02{
	position:relative;
	width:100%;
	height:305px;
	background:url(../../images/mansion/mansion_content02.jpg) no-repeat top center;
	background-size:cover;
	margin-top:-96px;
	z-index:3;
}


/*=================================================*/

.sp_mansion_content03{
	position:relative;
	width:100%;
	height:305px;
	background:url(../../images/mansion/mansion_content03.jpg) no-repeat top center;
	background-size:cover;
	margin-top:-96px;
	z-index:3;
}

/*=================================================*/

.sp_mansion_content04{
	position:relative;
	width:100%;
	height:305px;
	background:url(../../images/mansion/mansion_content04.jpg) no-repeat top center;
	background-size:cover;
	margin-top:-96px;
	z-index:3;
}
.sp_mansion_content .sp_title02{
	width:196px;
	height:100px;
	border:1px solid #fff;
	text-align:center;
	position:relative;
	top:40%;
	left:40px;
    background: rgba(0,0,0,0.6);
}

.sp_mansion_content .sp_title02 p{
	font-size:1rem;
	color:#fff;
	padding-top:15px;
	letter-spacing:0.2rem;
}
.sp_mansion_content .sp_title02 p font{
	display:block;
	margin-top:20px;
	font-size:1.6rem;
	color:#fff;
}
.sp_mansion_content04 .sp_mansion_text{
	width:60% !important;
}


/*=================================================*/

.sp_mansion_content05{
	position:relative;
	width:100%;
	height:305px;
	background:url(../../images/mansion/mansion_content05.jpg) no-repeat top center;
	background-size:cover;
	margin-top:-96px;
	z-index:3;
}


/*=================================================*/




.sp_mansion_slide{
	width:100%;
	background:#001D31;
	padding:100px 0 120px;
	position:relative;
	z-index:2;
	top:0;
	margin-top:-100px;
}

.sp_mansion_slide:after{
	display:block;
	position:absolute;
	bottom:0;
	height:100px;
	width:100%;
	content:' ';
	background:url(../../images/mansion/mansion_top_area_after.png) no-repeat top center;
	background-size:cover;
}

.sp_mansion_slide section{
	display:none;
	height:0;
	width:90%;
	max-width:580px;
	margin:0 auto;
	overflow:hidden;
    -webkit-transition: 0.3s ease-in-out;
            transition: 0.3s ease-in-out;
}

.sp_mansion_slide section:after{
	display:none !important;
}


.sp_mansion_slide section p{
	color:#fff;
	line-height:1.6rem;
	padding:15px 0;
	border-top:1px solid #fff;
	border-bottom:1px solid #fff;
	margin:20px 0;
}

.sp_mansion_slide input{
	display:none;
}

.sp_mansion_slide label{
	display:block;
	width:250px;
	height:54px;
	background:url(../../images/mansion/mansion_more_btn1.png) no-repeat top center;
	background-size:cover;
	margin:0 auto;
	cursor:pointer;
}

.sp_mansion_slide input:checked ~ label{
	background:url(../../images/mansion/mansion_more_btn2.png) no-repeat top center !important;
	background-size:cover !important;
}

.sp_mansion_slide input:checked + .sp_mansion_slide section{
	display:block;
	height:auto;
}

.bottom_img{
	width:100%;
	display:block;
	position:relative;
	top:0;
	margin-top:-88px;
	z-index:2;
}

.content{
	position:relative;
	margin-top:-10px;
	z-index:3;
}

/* 																												end
----------------------------------------------------------------------------------------------------------------- */}
@media screen and (max-width:640px){
.content{
	max-width:640px;
	min-width:320px;
}

.mansion_top_text {
    margin: 0 auto 0px;
}

.bottom_img{
	width:100%;
	display:block;
	position:relative;
	top:0;
	margin-top:-78px;
	z-index:2;
}
    



/* 																												end
----------------------------------------------------------------------------------------------------------------- */}
    /******アンドロイド対応*******/
@media screen and (min-width: 640px) {
.android .left_title5 p {
    letter-spacing: 0.1rem;
}
}


@media screen and (max-width:414px){
.content{
	max-width:414px;
	min-width:320px;
}
.mansion_top_area{
	height:300px;
}
.mansion_top_area h2{
	width: 300px;
	font-size: 1.6rem;
	letter-spacing: 0.3rem;
}
.mansion_top_area h2::after{
	bottom:5px;
	height:18px;
}

.mansion_top_text p{
	font-size: 0.6rem;
	line-height: 1.6rem;
	color: #000;
}



/*=================================================*/
.sp_mansion_content01{
	position:relative;
	width:100%;
	height:305px;
	background:url(../../images/mansion/mansion_content01.jpg) no-repeat top center;
	background-size:cover;
	margin-top:-88px;
	z-index:100;
}

.sp_mansion_content .sp_title01{
	width:130px;
	height:80px;
	border:1px solid #fff;
	text-align:center;
	position:relative;
	top:40%;
	left:5px;
    background: rgba(0,0,0,0.6);
}

.sp_mansion_content .sp_title01 p{
	font-size:8px;
	color:#fff;
	padding-top:10px;
	letter-spacing:0.1rem;
}
.sp_mansion_content .sp_title01 p font{
	display:block;
	margin-top:20px;
	font-size:1.4rem;
	color:#fff;
}

.sp_mansion_content .sp_mansion_text{
	color:#fff;
	display:block;
	width:60%;
	position:absolute;
	right:0;
	top:45%;
	font-size:0.6rem;
	line-height:1.4rem;
	font-weight:bold;
}







/*=================================================*/
.sp_mansion_content02{
	position:relative;
	width:100%;
	height:305px;
	background:url(../../images/mansion/mansion_content02.jpg) no-repeat top center;
	background-size:cover;
	margin-top:-88px;
	z-index:3;
}


/*=================================================*/

.sp_mansion_content03{
	position:relative;
	width:100%;
	height:305px;
	background:url(../../images/mansion/mansion_content03.jpg) no-repeat top center;
	background-size:cover;
	margin-top:-88px;
	z-index:3;
}

/*=================================================*/

.sp_mansion_content04{
	position:relative;
	width:100%;
	height:305px;
	background:url(../../images/mansion/mansion_content04.jpg) no-repeat top center;
	background-size:cover;
	margin-top:-88px;
	z-index:3;
}
.sp_mansion_content .sp_title02{
	width:120px;
	height:80px;
	border:1px solid #fff;
	text-align:center;
	position:relative;
	top:40%;
	left:5px;
    background: rgba(0,0,0,0.6);
}

.sp_mansion_content .sp_title02 p{
	font-size:8px;
	color:#fff;
	padding-top:10px;
	letter-spacing:0.2rem;
}
.sp_mansion_content .sp_title02 p font{
	display:block;
	margin-top:10px;
	font-size:1.2rem;
	color:#fff;
}
.sp_mansion_content04 .sp_mansion_text{
	width:60% !important;
}


/*=================================================*/

.sp_mansion_content05{
	position:relative;
	width:100%;
	height:305px;
	background:url(../../images/mansion/mansion_content05.jpg) no-repeat top center;
	background-size:cover;
	margin-top:-88px;
	z-index:3;
}


/*=================================================*/

.sp_mansion_slide section{
	width:95%;
}
.sp_mansion_slide section p{
	font-size:10px;
	line-height:1.4rem;
}

.bottom_img{
	width:100%;
	display:block;
	position:relative;
	top:0;
	margin-top:-70px;
	z-index:2;
}


.content{
	position:relative;
	margin-top:20px;
	z-index:3;
}



/* 																												end
----------------------------------------------------------------------------------------------------------------- */}


@media screen and (max-width:375px){
.content{
	max-width:375px;
	min-width:320px;
}

.sp_mansion_slide section p{
	font-size:9px;
	line-height:1.4rem;
}
.sp_mansion_content .sp_title02 p{
	font-size:0.5rem;
	color:#fff;
	padding-top:10px;
	letter-spacing:0.2rem;
}
.sp_mansion_content .sp_title01 p{
	font-size:0.5rem;
	color:#fff;
	padding-top:10px;
	letter-spacing:0.2rem;
}
.bottom_img{
	width:100%;
	display:block;
	position:relative;
	top:0;
	margin-top:-65px;
	z-index:2;
}

/* 																												end
----------------------------------------------------------------------------------------------------------------- */}


@media screen and (max-width:320px){
.content{
	max-width:320px;
	min-width:320px;
}
.mansion_top_text{
	max-width:90% !important;
}
.sp_mansion_slide section p{
	font-size:8px;
	line-height:1.4rem;
}

.sp_mansion_content04 .sp_mansion_text{
    width: 60% !important;
	right:0;
}

.sp_mansion_content .sp_title01{
	width:110px;
	height:80px;
	border:1px solid #fff;
	text-align:center;
	position:relative;
	top:40%;
	left:5px;
    background: rgba(0,0,0,0.6);
}
.mansion_top_area h2 {
    width: 240px;
    font-size: 1rem;
    letter-spacing: 0.4rem;
}
.bottom_img{
	width:100%;
	display:block;
	position:relative;
	top:0;
	margin-top:-60px;
	z-index:2;
}

/* 																												end
---------------------------------------------------------------------------------------------------------------- */}
