@charset "utf-8";

/*----------------------------------
mv
----------------------------------*/
body:not(.top) #mv .col-xs-12{
	background-image : url("/en/images/about/mv.jpg");
}

/*----------------------------------
common
----------------------------------*/
article h2{
	font-family : "Merriweather";
	font-weight : 700;
	color : #005fb6;
}
article:nth-of-type(even){
	background : #f3f3f3;
}
@media (max-width: 639px){
	article h2{
		font-size : 21px;
	}
}
@media (min-width: 640px ) and ( max-width: 767px){
	article h2{
		font-size : 42px;
	}
}
@media (min-width: 768px ) and ( max-width: 991px){
	article h2{
		font-size : 42px;
	}
}

@media ( min-width: 992px){
	article h2{
		font-size : 34px;
	}
}
/*----------------------------------
#brand
----------------------------------*/
#brand .col-xs-12 > p{
	font-family : "Merriweather";
	font-weight : 700;
	color : #000;
}
#brand .col-xs-12 > p strong{
	color : #0060b6;
}
#brand .col-xs-12 .row p{
	font-family : "Roboto";
	font-weight : 400;
	color : #000;
}
@media (max-width: 639px){
	#brand .col-xs-12 > p{
		font-size : 12.5px;
	}
	#brand .col-xs-12 .row p{
		font-size : 13px;
	}
}
@media (min-width: 640px ) and ( max-width: 767px){
	#brand .col-xs-12 > p{
		font-size : 25px;
	}
	#brand .col-xs-12 .row p{
		font-size : 26px;
	}
}
@media (min-width: 768px ) and ( max-width: 991px){
	#brand .col-xs-12 > p{
		font-size : 25px;
	}
	#brand .col-xs-12 .row p{
		font-size : 26px;
	}
}
@media ( max-width: 991px){
	#brand{
		padding-top : calc( 88 / 640 * 100% );
		padding-bottom : calc( 64 / 640 * 100% );
	}
	#brand .col-xs-12 > p{
		margin : calc( 59 / 640 * 100% ) auto 0;
		line-height : 1.1;
		width : calc( 480 * 100% / 580 );
	}
	#brand .col-xs-12 .row{
		margin-left : 0;
		margin-right : 0;
		margin-top : 74px;
	}
	#brand .col-xs-12 .row h3{
		padding-left : 0;
		padding-right : 0;
	}
	#brand .col-xs-12 .row h3 img{
		width : 100%;
		height : auto;
	}
	#brand .col-xs-12 .row p{
		margin-top : calc( 31 / 640 * 100% );;
		padding-left : calc( 30 * 100% / 580 );
		padding-right : calc( 30 * 100% / 580 );
		line-height : 1.4;
	}
}
@media ( min-width: 992px){
	#brand{
		padding-top : 105px;
		padding-bottom : 69px;
	}
	#brand .col-xs-12{
		padding-right : 0;
		padding-left : 0;
		max-width : 1080px;
	}
	#brand .col-xs-12 > p{
		margin-top : 75px;
		font-size : 21px;
	}
	#brand .col-xs-12 .row{
		margin-left : 0;
		margin-right : 0;
		display : -webkit-box;
		display : flex;
		-webkit-box-align : center;
		align-items : center;
		margin-top : 43px;
	}
	#brand .col-xs-12 .row h3{
		padding-left : 0;
		padding-right : 0;
	}
	#brand .col-xs-12 .row h3 img{
		width : 100%;
		height : auto;
	}
	#brand .col-xs-12 .row p{
		padding-right : 0;
		padding-left : calc( 64 * 100% / 1080 );
		vertical-align : middle;
		font-size : 19px;
		line-height : 29px;
	}
}
/*----------------------------------
#area
----------------------------------*/
#area p{
	font-family : "Roboto";
	font-weight : 400;
	color : #000;
}
@media (max-width: 639px){
	#area p{
		font-size : 13px;
	}
}
@media (min-width: 640px ) and ( max-width: 767px){
	#area p{
		font-size : 26px;
	}
}
@media (min-width: 768px ) and ( max-width: 991px){
	#area p{
		font-size : 26px;
	}
}

@media ( max-width: 991px){
	#area{
		padding-top : calc( 100 / 640 * 100% );
		padding-bottom : calc( 78 / 640 * 100% );
	}
	#area .row .row{
		margin-top : calc( 48 / 640 * 100% );
	}
	#area h3{
		padding-left : 0;
		padding-right : 0;
	}
	#area h3 img{
		width : 100%;
		height : auto;
	}
	#area p{
		margin-top : calc( 63 / 640 * 100% );
		line-height : 1.4;
		padding-left : calc( 30 * 100% / 580 );
		padding-right : calc( 30 * 100% / 580 );
	}
}
@media ( min-width: 992px){
	#area{
		padding-top : 161px;
		padding-bottom : 212px;
	}
	#area .container{
		padding-right : 0;
		padding-left : 0;
		max-width : 1124px;
	}
	#area .container .row .row{
		margin-left : 0;
		margin-right : 0;
		margin-top : 87px;
		display : -webkit-box;
		display : flex;
		-webkit-box-align : center;
		align-items : center;
	}
	#area .container h3{
		padding-left : calc( 41 * 100% / 1124 );
		padding-right : 0;
	}
	#area .container h3 img{
		width : 100%;
		height : auto;
	}
	#area .container p{
		color : #000;
		font-size : 19px;
		line-height : 29px;
	}
}

/*----------------------------------
#environment
----------------------------------*/
#environment p{
	font-family : "Roboto";
	font-weight : 400;
	color : #000;
}
@media (max-width: 639px){
	#environment p{
		font-size : 13px;
	}
}
@media (min-width: 640px ) and ( max-width: 767px){
	#environment p{
		font-size : 26px;
	}
}
@media (min-width: 768px ) and ( max-width: 991px){
	#environment p{
		font-size : 26px;
	}
}
@media ( max-width: 991px){
	#environment{
		padding-top : calc( 94 / 640 * 100% );
		padding-bottom : calc( 83 / 640 * 100% );
	}
	#environment .col-xs-12{
		display : -webkit-box;
		display : flex;
		-webkit-box-orient : vertical;
		-webkit-box-direction : normal;
		flex-direction : column;
	}
	#environment .col-xs-12 h2{
		-webkit-box-ordinal-group : 2;
		order : 1;
	}
	#environment .col-xs-12 p{
		padding-left : calc( 30* 100% / 580 );
		padding-right : calc( 30* 100% / 580 );
		margin : calc( 25 * 100% / 610 ) auto 0;
		-webkit-box-ordinal-group : 4;
		order : 3;
	}
	#environment .col-xs-12 .row{
		-webkit-box-ordinal-group : 3;
		order : 2;
		margin-left : 0;
		margin-right : 0;
		margin-top : 51px;
	}
	#environment .col-xs-12 .row li{
		padding-right : 0;
		padding-left : 0;
	}
	#environment .col-xs-12 .row li:not(:first-child){
		margin-top : calc( 55 * 100% / 610 );
	}
	#environment .col-xs-12 .row img{
		width : 100%;
		height : auto;
	}
}
@media ( max-width: 991px){
	@-moz-document url-prefix(){
		#environment p{
			margin-top : 25px!important;
		}
	}
}
@media ( min-width: 992px){
	#environment{
		padding-top : 106px;
		padding-bottom : 159px;
	}
	#environment .container{
		max-width : 1180px;
		width : inherit;
	}
	#environment .container p{
		font-size : 19px;
		line-height : 29px;
		max-width : 1080px;
		margin : 81px auto 0;
	}
	#environment .container .row .row{
		margin-left : 0;
		margin-right : 0;
		margin-top : 76px;
	}
	#environment .container .row .row img{
		width : 100%;
		height : auto;
	}
	#environment .container .row .row li:nth-child(1){
		padding-left : 0;
		padding-right : calc( 67 * 2 / 3 * 100% /1180 );
	}
	#environment .container .row .row li:nth-child(2){
		padding-left : calc( 67 * 1 / 3 * 100% /1180 );
		padding-right : calc( 67 * 1 / 3 * 100% /1180 );
	}
	#environment .container .row .row li:nth-child(3){
		padding-right : 0;
		padding-left : calc( 67 * 2 / 3 * 100% /1180 );
	}
}
@media (min-width: 1200px){
	#environment .container{
		padding-right : 0;
		padding-left : 0;
	}
}
/*----------------------------------
#profile
----------------------------------*/
#profile .row .row{
	display : -webkit-box;
	display : flex;
	flex-wrap : wrap;
}
#profile .row .row > dt , #profile .row .row > dd{
	color : #242424;
}
#profile .row .row > dt:nth-of-type(odd) , #profile .row .row > dd:nth-of-type(odd){
	background : white;
}
#profile .row .row > dt{
	font-weight : 700;
	font-family : "Roboto";
}
#profile .row .row > dd{
	font-family : "Roboto";
	font-weight : 400;
}
#profile .row .row > dd a{
	color : #000;
	display : inline;
	text-decoration : underline;
}
#profile .row .row > dd a:hover{
	color : #0060b6;
}
#profile dl dl dt{
	font-weight : 400;
}
#profile dl dl dt:before{
	content : "＜\00a0";
}
#profile dl dl dt:after{
	content : "\00a0＞";
}
@media (max-width: 639px){
	#profile .row .row > dt , #profile .row .row > dd{
		font-size : 12px;
		min-height : 65px;
	}
	#profile .row .row dl dt:first-child{
		margin-top : 12.5px;
	}
	#profile .row .row dl dt:not(:first-child){
		margin-top : 20px;
	}
}
@media (min-width: 640px ) and ( max-width: 767px){
	#profile .row .row > dt , #profile .row .row > dd{
		font-size : 24px;
		min-height : 130px;
	}
	#profile .row .row dl dt:first-child{
		margin-top : 25px;
	}
	#profile .row .row dl dt:not(:first-child){
		margin-top : 40px;
	}
}
@media (min-width: 768px ) and ( max-width: 991px){
	#profile .row .row > dt , #profile .row .row > dd{
		font-size : 24px;
		min-height : 130px;
	}
	#profile .row .row dl dt:not(:first-child){
		margin-top : 40px;
	}
}
@media ( max-width: 991px){
	#profile{
		padding-top : calc( 79 * 100% / 610 );
		padding-bottom : calc( 157 * 100% / 610 );
	}
	#profile .row .row{
		margin-top : calc( 75 * 100% / 610 );
		display : -webkit-box;
		display : flex;
	}
	#profile .row .row::before{
		content : none!important;
	}
	#profile .row .row > dt , #profile .row .row > dd{
		padding-top : calc( 15 * 100% / 610 );
		padding-bottom : calc( 15 * 100% / 610 );
		float : none;
	}
	#profile .row .row > dt{
		padding-left : calc( 11 * 100% / 610 );
		padding-right : 0;
		display : -webkit-box;
		display : flex;
		-webkit-box-align : center;
		align-items : center;
		width : 42%;
	}
	#profile .row .row dt:nth-of-type(4){
		display : block;
	}
	#profile .row .row > dd{
		padding-left : 0;
		padding-left : calc( 15 * 100% / 610 );
		display : -webkit-box;
		display : flex;
		-webkit-box-align : center;
		align-items : center;
		width : 58%;
	}
	#profile .row .row dl dt{
		font-family : "Roboto";
		font-weight : 700;
	}
}
@media ( min-width: 992px){
	#profile{
		padding-top : 104px;
		padding-bottom : 155px;
	}
	#profile .container{
		max-width : 1180px;
		width : inherit;
	}
	#profile .container .row .row{
		margin-left : 0;
		margin-right : 0;
		margin-top : 79px;
		display : -webkit-box;
		display : flex;
		flex-wrap : wrap;
	}
	#profile .container .row .row::before{
		content : none!important;
	}
	#profile .container .row .row > dt , #profile .container .row .row > dd{
		min-height : 55px;
		padding-top : 15px;
		padding-bottom : 15px;
		font-size : 18px;
		display : -webkit-box;
		display : flex;
		-webkit-box-align : center;
		align-items : center;
	}
	#profile .container .row .row > dt{
		padding-left : calc( 55 * 100% / 1180 );
	}
	#profile .container .row .row dl dt:not(:first-child){
		margin-top : 33px;
	}
}



/*----------------------------------
#location
----------------------------------*/
#location dt{
	font-family : Roboto;
	font-weight : 400;
	color : #000;
}
#location dd li{
	background-repeat : no-repeat;
	background-position : left top;
}
#location dd li h3{
	font-family : "Roboto";
	font-weight : 700;
	color : #0060b6;
}
#location dd li h3:before{
	content : "＜\00a0";
	font-family : "Roboto";
	font-weight : 400;
}
#location dd li h3:after{
	content : "\00a0＞";
	font-family : "Roboto";
	font-weight : 400;
}
#location dd li p{
	color : #000;
}
#location dd li:first-child h4{
	color : #c1a470;
}
#location dd li p:last-child:before {
	content : "● ";
	font-family : "Roboto";
	font-weight : 400;
}
.txt-JR {
	font-weight: bold;
	color: #33cc00;
}
.txt-Metro {
	font-weight: bold;
	color: #00d5e8;
}
.txt-Toei {
	font-weight: bold;
	color: #1a6700;
}
.txt-MIR {
	font-weight: bold;
	color: #001598;
}


@media (max-width: 639px){
	#location dt{
		font-size : 12px;
	}
	#location dd li h3{
		font-size : 12px;
	}
	#location dd li p{
		font-size : 12px;
	}
}
@media (min-width: 640px ) and ( max-width: 767px){
	#location dt{
		font-size : 24px;
	}
	#location dd li h3{
		font-size : 24px;
	}
	#location dd li p{
		font-size : 24px;
	}
}
@media (min-width: 768px ) and ( max-width: 991px){
	#location dt{
		font-size : 24px;
	}
	#location dd li h3{
		font-size : 24px;
	}
	#location dd li p{
		font-size : 24px;
	}
}
@media ( max-width: 991px){
	#location{
		padding-top : calc( 120 * 100% / 610 );
		padding-bottom : calc( 180 * 100% / 610 );
	}
	#location .col-xs-12{
		display : -webkit-box;
		display : flex;
		-webkit-box-orient : vertical;
		-webkit-box-direction : normal;
		flex-direction : column;
	}
	#location .col-xs-12 h2{
		-webkit-box-ordinal-group : 2;
		order : 1;
	}
	#location .col-xs-12 dl.row{
		margin : calc( 46 * 100vw / 610 ) auto 0;
		-webkit-box-ordinal-group : 4;
		order : 3;
	}
	#location .col-xs-12 dt{
		font-weight : 700;
		padding-left : 0;
		padding-right : 0;
	}
	#location .col-xs-12 dd{
		padding-left : calc( 30 * 100% / 610  );
		padding-right : 0;
	}
	#location .col-xs-12 dd li{
		padding-left : calc( 76 * 100% / 610 );
		display : -webkit-box;
		display : flex;
		-webkit-box-orient : vertical;
		-webkit-box-direction : normal;
		flex-direction : column;
		-webkit-box-pack : center;
		justify-content : center;
		padding-bottom : calc( 44 * 100vw / 610 );
		background-size : calc( 60 * 100% / 580 );
	}
	#location .col-xs-12 dd li:first-child{
		margin-top : calc( 21 * 100vw / 610 );
	}
	#location .col-xs-12 #maps{
		-webkit-box-ordinal-group : 3;
		order : 2;
		margin-top : calc( 80 * 100vw / 610 );
		margin-left : 0;
		margin-right : 0;
		position : relative;
		padding-bottom : calc( 700 * 100vw / 640 );
		height : 0;
		overflow : hidden;
	}
	#location .col-xs-12 #maps iframe , #location .col-xs-12 #maps object , #location .col-xs-12 #maps embed{
		position : absolute;
		top : 0;
		left : 0;
		width : 100%;
		height : 100%;
	}
}
@media ( min-width: 992px){
	#location{
		padding-top : 100px;
		padding-bottom : 174px;
	}
	#location .container{
		max-width : 1080px;
		width : inherit;
	}
	#location .container dl.row{
		max-width : 738px;
		margin : 51px auto 0;
	}
	#location .container dt{
		font-size : 18px;
		font-weight : 700;
		padding-left : 0;
		padding-right : 0;
	}
	#location .container dd{
		padding-left : calc( 53.5 * 100% / 738  );
		padding-right : 0;
	}
	#location .container dd li{
		padding-left : calc( 77 * 100% / 500 );
		min-height : 57px;
		display : -webkit-box;
		display : flex;
		-webkit-box-orient : vertical;
		-webkit-box-direction : normal;
		flex-direction : column;
		-webkit-box-pack : center;
		justify-content : center;
	}
	#location .container dd li h3{
		font-size : 18px;
	}
	#location .container dd li p{
		color : #000;
		font-size : 18px;
	}
	#location .container dd li:nth-child(n+2){
		margin-top : 17px;
	}
	#location .container ul.row{
		margin-top : 59px;
	}
	#location #maps{
		margin-top : 63px;
		position : relative;
		padding-bottom : calc( 500 * 100% / 1080 );
		height : 0;
		overflow : hidden;
	}
	#location #maps iframe , #location #maps object , #location #maps embed{
		position : absolute;
		top : 0;
		left : 0;
		width : 100%;
		height : 100%;
	}
}