@charset "UTF-8";

/*---------------------------
大規模駅前開発
---------------------------*/

#content_Wrap {
overflow: hidden;
}
#content_Wrap img{
	width: 100%;
}

.cap_R {
    right: 5px;
}
.cap_B {
    color: #333;
}
.cap_Txt {
    position: absolute;
    font-size: 12px;
    bottom: 5px;
    transform: rotate(.028deg);
}
.main {
    position: relative;
}
.main .ttl_wrap {
width: 100%;
text-align: center;
    position: absolute;
    top: 25%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    -webkit- transform: translateY(-50%) translateX(-50%);
}
.main .ttl_wrap h2 {
font-size: 3vw;
    text-align: center;
    letter-spacing: 4px;
    margin-bottom: 20px;
}
.main .ttl_wrap .txt {
    text-align: center;
    font-size: 20px;
}
.main .ttl_wrap img {
max-width: 400px;
margin: 0 auto;
text-align: center;
}

.navBtn {
width: 1000px;
max-width: 90%;
margin: 80px auto 0;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.navBtn li {
width: 48%;
margin-bottom: 20px;
}
.navBtn li a {
display: block;
transition: 0.3s;
}
.navBtn li a:hover {
opacity: 0.7;
}




/*VALUE共通*/
.value_box {
width: 100%;
margin: 100px auto;
}
.value_box .ttl_vaue {
width: 100%;
align-items: center;
display: flex;
margin-bottom: 50px;
}
.value_box .ttl_vaue img {
max-width: 280px;
}
.value_box .ttl_vaue::before,
.value_box .ttl_vaue::after {
background-color: #CBBF84;
content: "";
flex-grow: 1;
height: 0.5px;
}
.value_box .ttl_vaue::before {
margin-right: 0px;
}
.value_box .ttl_vaue::after {
margin-left: 0px;
}

.value_box .inner {
width: 1000px;
max-width: 90%;
margin: 0 auto;
}

.value_box .copy_block {
width: 100%;
margin: 0 auto 50px;
text-align: center;
}
.value_box .copy_block .copy_ttl {
color: #CBBF84;
font-size: 25px;
line-height: 1.8;
margin-bottom: 20px;
display: flex;
justify-content: center;
align-items: center;
}
.value_box .copy_block h3 {
color: #CBBF84;
font-size: 25px;
line-height: 1.8;
margin-bottom: 20px;
}
.value_box .copy_block .copy_ttl .num {
font-size: 100px;
margin-bottom: 0;
margin-right: 50px;
padding-right: 50px;
border-right: 1px solid #7e7a64;
color: #464331;
line-height: 1;
font-style: italic;
}
.value_box .copy_block .copy_ttl p {
color: #CBBF84;
font-size: 25px;
line-height: 1.8;
text-align: left;
}
.value_box .copy_block p {
font-size: 16px;
line-height: 2;
}

.value_box h4 {
width:100%;
text-align: center;
background: #CBBF84;
color: #000;
padding: 5px 0;
line-height: 1.6;
font-weight: 600;
margin-bottom: 20px;
}

.value_box h5 {
width:100%;
text-align: center;
font-size: 25px;
padding-bottom: 10px;
line-height: 1.6;
font-weight: 600;
margin-bottom: 70px;
border-bottom: 4px double #575757;
}

.value_box figure {
margin-bottom: 40px;
}
.value_box figure p {
margin-top: 15px;
text-align: right;
font-size: 11px;
font-feature-settings: "palt";
letter-spacing: 1px;
}

.value_box .topics {
width: 100%;
max-width: 100%;
border: 1px solid #CBBF84;
padding: 40px;
position: relative;
margin: 0 auto 70px;
overflow: visible;
}
.value_box .topics .ttl {
width: 350px;
max-width: 90%;
position: absolute;
left: 20px;
top: -20px;
}
.value_box .topics ul {
width: 100%;
display: flex;
justify-content: space-between;
flex-wrap: wrap;align-items: center;
}
.value_box .topics ul li.txt {
width: 45%;
}
.value_box .topics ul li.img {
width: 50%;
}
.value_box .topics ul li.txt p.title {
font-size: 22px;
line-height: 1.8;
margin-bottom: 20px;
}
.value_box .topics ul li.txt p {
font-size: 14px;
line-height: 2;
}
.value_box .topics ul li.txt a {
display: block;
width: 100%;
background: #AA0211;
color: #fff;
text-align: center;
margin-top: 20px;
padding: 10px 0;
transition: 0.3s;
}
.value_box .topics ul li.txt a:hover {
background: #d33745;
}
.arrow{
	position: relative;
	display: inline-block;
	padding: 0 0 0 16px;
	color: #000;
	vertical-align: middle;
	text-decoration: none;
	font-size: 15px;
}
.arrow::before,
.arrow::after{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.arrow::before{
	right: 4px;
	box-sizing: border-box;
	width: 10px;
	height: 10px;
	border: 5px solid transparent;
	border-left: 7px solid #fff;
}

.value_box .inner .p_text {
font-size: 16px;
line-height: 1.8;
margin-bottom: 20px;
}
.value_box .inner .p_text.small {
font-size: 11px;
}

.value_box .inner .center_txt {
font-size: 16px;
line-height: 1.8;
margin-bottom: 20px;
text-align: center;
}





/*VALUE1*/


/*VALUE2*/


/*VALUE3*/
.value3 .kaiteki {
width: 100%;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.value3 .kaiteki li {
width: 48%;
margin-bottom: 40px;
}
.value3 .kaiteki li .tit {
text-align: center;
font-size: 25px;
padding: 20px 0;
line-height: 1.5;
margin-bottom: 20px;
border-bottom: 1px solid #575757;
}
.value3 .kaiteki li .tit small {
font-size: 14px;
}
.value3 .kaiteki li p {
text-align: left;
font-size: 15px;
line-height: 2;
}


/*VALUE4*/
.value_box .copy_block .copy_ttl p strong {
font-size: 200%;
}
.value_box .copy_block p strong {
font-size: 150%;
}
.value_box .plan_Area {
margin-bottom: 100px;
}
.value_box .plan_Area ul {
display: flex;
justify-content: center;
flex-wrap: wrap;
align-items: flex-end;
margin-bottom: 40px;
}
.value_box .plan_Area ul li:first-child {
width: 396px;
max-width: 100%;
margin-right: 10%;
}
.value_box .plan_Area ul li:last-child {
width: 325px;
max-width: 100%;
}
.value_box .plan_Area figure.uh {
width: 504px;
max-width: 90%;
margin: 0 auto;
}
.value_box .plan_Area figure.uf {
width: 812px;
max-width: 90%;
margin: 0 auto;
}
.btn_planlist {
width: 400px;
max-width: 100%;
display: block;
margin: 0 auto;
transition: 0.3s;
}
.btn_planlist:hover {
opacity: 0.7;
}

.page_inlink {
width: 100%;
height: 1px;
visibility: hidden;
margin-top: -120px;
padding-top: 120px;
}



/*-----------------------------
tab横〜
-----------------------------*/
@media only screen and (max-width: 1024px) {

}


/*-----------------------------
tab・sp
-----------------------------*/
@media only screen and (max-width: 768px) {

.main .ttl_wrap {
top: 23%;
}
.main .ttl_wrap img {
max-width: 70%;
}

.main_img .caption{
font-size: 12px;
}
p.caption {
font-size: 12px;
}
.ttl {
padding: 20px 0;
font-size: 20px;
}
.main .ttl_wrap {
width: 100%;
}
.main .ttl_wrap h2 {
font-size: 32px;
}
.main .ttl_wrap .txt {
font-size: 20px;
}

.navBtn {
margin: 50px auto 0;
}
.navBtn li {
width: 100%;
}


.value_box {
margin: 60px auto;
}

.value_box .ttl_vaue {
margin-bottom: 30px;
}
.value_box .ttl_vaue img {
max-width: 180px;
}
.value_box .copy_block .copy_ttl {
font-size: 18px;
font-feature-settings: "palt";
align-items: center;
justify-content: flex-start;
}
.value_box .copy_block .copy_ttl .num {
font-size: 60px;
margin-right: 0px;
padding-right: 0px;
margin-left: 0;
padding-left: 0;
border: none;
}
.value_box .copy_block .copy_ttl p {
font-size: 17px;
border-left: 1px solid #7e7a64;
padding-left: 20px;
margin-left: 20px;
}
.value_box .copy_block p {
text-align: left;
line-height: 1.9;
font-size: 14px;
}
.value_box .copy_block h3 {
font-size: 19px;
}

.value_box h4 {
font-size: 15px;
}
.value_box figure p {
line-height: 1.5;
}

.value_box h5 {
font-size: 20px;
margin-bottom: 40px;
}

.js-scrollable {}
.js-scrollable.js01 img {
height: 300px;
width: auto !important;
padding-bottom: 15px;
}
.js-scrollable.js02 img {
height: 400px;
width: auto !important;
padding-bottom: 15px;
}
.js-scrollable.js03 img {
height: 200px;
width: auto !important;
padding-bottom: 15px;
}

.value_box .topics {
padding: 40px 20px 20px;
overflow: visible;
}
.value_box .topics ul li.txt ,
.value_box .topics ul li.img {
width: 100%;
}
.value_box .topics ul li.txt p.title {
font-size: 19px;
margin-bottom: 15px;
}
.value_box .topics ul li.img {
margin-top: 20px;
}
.value_box .topics .ttl {
top: -30px;
}

.value_box .inner .p_text {
font-size: 14px;
}

.value3 .kaiteki li {
width: 100%;
}
.value3 .kaiteki li .tit {
font-size: 20px;
padding: 10px 0;
}
.value3 .kaiteki li p {
font-size: 14px;
}
.value_box .inner .center_txt {
text-align: left;
}

.value_box .plan_Area ul li:first-child {
margin-right: 0;
margin-bottom: 20px;
}

.btn_planlist {
max-width: 80%;
margin: 0 auto;
}

.page_inlink {
width: 100%;
height: 1px;
visibility: hidden;
margin-top: -80px;
padding-top: 80px;
}

}