@charset "utf-8";

/*common*/

.wfit {
	width: 100%;
	height: auto;
}
#contents .section { margin-bottom: 30px; }
#contents .section .caption {
	text-align: right;
	padding-top: 5px;
}
.accessContainer .title {
	margin-bottom: 8px;
	padding-top: 6px;
}
.accessContainer .title span {
	margin-bottom: 8px;
	display: inline-block;
}
#access #mainCpy .title span.vsp {
	display: none;
}
.obi_ttl {
	background: #53001A;
	background: #001033;
	text-align: center;
	padding: 10px 0;
}

@media screen and (max-width: 767px) {
	#access #mainCpy .title span.vsp {
			display: block;
	}
	#access #mainCpy .title span.vpc {
			display: none;
	}
}

@media screen and (max-width: 640px)  {
.obi_ttl h4 {
	font-size: 16px;
	line-height: 1;
}
.obi_ttl h4 img {
	width: auto;
	height: 1em;
}
}

.accessContainer {
	background: url(../img/common/ico_title.png) no-repeat left top;
	padding-left: 72px;
	box-sizing: border-box;
}

/*trainInformation*/
#trainInformation #routemap {
	margin: 20px auto 30px;
}
#trainInformation img {
	max-width:888px;
}
#trainInformation .time {
	margin-bottom: 3em;
}
#trainInformation .time ul{
	padding: 20px;
	box-sizing:border-box;
	text-align: center;
}
#trainInformation .time ul li{
	display:inline-block;
	vertical-align:  top;
	margin-right: 5.63%;
	width: 28.65%;
}
#trainInformation .time ul li:nth-child(3n){
	margin-right: 0;
	margin-bottom:15px;
}
#trainInformation .time ul li img{
	max-width:  100%;
}

#trainInformation #routemap2 {
	max-width:777px;
	margin:  20px auto 0;
}
#trainInformation #routemap2 img {
	width: 100%;
	max-width:777px;
	height: auto;
}


/*mainVisual*/
#mainVisual_bg{
	width:100%;
	background:url(../img/common/mainCpy_bg.jpg) repeat;
}
/*#mainVisual {
	max-width: 1200px;
	width: 100%;
	margin: 0 auto;
	position: relative;
	z-index: 0;
}*/
#mainVisual .photo {
	width: 33.33%;
	float: left;
	position: relative;
}
#mainVisual .photo img {
	width: 100%;
	height: auto;
}
#mainVisual .title {
	text-align: left;
}
/*#mainVisual .photo .caption {
	position: absolute;
	right: 10px;
	bottom: 5px;
	text-shadow: 0 0 3px rgba(0,0,0,.75);
}
#mainVisual .title {
	display: block;
	width: 100%;
	margin: auto;
	padding: 0 40px;
	box-sizing: border-box;
	max-width: 1200px;
	max-width: 1120px\9;
	text-align: left;
	position: absolute;
	top: 70px;
	left: 0;
	right: 0;
	z-index: 2;
}*/


/*odakyuLineInner*/

#odakyuLine {
	box-sizing: border-box;
	border: 1px solid #004e97;
	background-color: #ffffff;
}
#odakyuLine .ttl {
	background: #004e97;
	text-align: right;
	padding: 15px 2% 15px 12.5%;
	position: relative;
}
/*#odakyuLine .ttl img {
	max-width: 360px;
	width: 100%;
	height: auto;
}*/
#odakyuLine .ttl .pp {
	display: block;
	position: absolute;
	top:-17px;
	left:0px;
	width: 12%;
}
#odakyuLine .point {
	max-width: 605px;
	margin: 20px auto;
}
#odakyuLine .block {
	margin: 0 0 40px;
}
#odakyuLine .block .t{
	margin-bottom: 10px;
}
#odakyuLine .block .t img{
	vertical-align: middle;
	margin: 5px 0;
}
#odakyuLine .block .t span.m{
	margin-right: 15px;
}
#odakyuLine #point02 .cf {
	margin-top: 10px;
}
#odakyuLine #point02 .left {
	float: left;
	width: 48.7805%;
}
#odakyuLine #point02 .right {
	float: right;
	width: 48.7805%;
}
#odakyuLine #point03 .block {
	margin: 10px auto;
}
#odakyuLine #point03 .left {
	float: left;
	width: 37%;
	margin-top: 2.2%;
}
#odakyuLine #point03 .right {
	float: right;
	width: 60%;
	max-width: 487px;
}
#odakyuLine .point_head {
	padding: 5px 10px;
	line-height: 0;
	margin-bottom: 10px;
background: rgba(0,155,206,1);
background: -moz-linear-gradient(left, rgba(0,155,206,1) 0%, rgba(0,78,151,1) 100%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0,155,206,1)), color-stop(100%, rgba(0,78,151,1)));
background: -webkit-linear-gradient(left, rgba(0,155,206,1) 0%, rgba(0,78,151,1) 100%);
background: -o-linear-gradient(left, rgba(0,155,206,1) 0%, rgba(0,78,151,1) 100%);
background: -ms-linear-gradient(left, rgba(0,155,206,1) 0%, rgba(0,78,151,1) 100%);
background: linear-gradient(to right, rgba(0,155,206,1) 0%, rgba(0,78,151,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#009bce', endColorstr='#004e97', GradientType=1 );	
}

#odakyuLine .obi_ttl {
	/*background: #00a0e9;*/
	background: #001033;
}
#odakyuLineInner {
	/*border: 1px solid #00a0e9;*/
	background-color: #ffffff;
	padding: 20px 33px 0;
}
#odakyuLineInner .cpy {
	width: 275px;
	float: left;
}
#odakyuLineInner .figure {
	float: right;
	width: 498px;
}
#odakyuLine #odakyuLineInner .caption{
	margin-top: 10px;
	text-align: left;
}
#odakyuLineInner .figure img {
	width: 100%;
	height: auto;
}


.odk1 {
	text-align: center;
	font-size: 0;
}
.odk1 li {
	display: inline-block;
	margin-top: 20px;
}

.odk1 li:nth-child(1) {
	margin-right: 0.5%;
	width: 49.6%;
}
.odk1 li:nth-child(2) {
	width: 49.2%;
}
.odk1 li:nth-child(3) {
	margin-right:1%;
	width: 18%;
}
.odk1 li:nth-child(4) {
	width: 81%;
}

.odk3 {
	text-align: center;
	font-size: 0;
}
.odk3 li {
	display: inline-block;
	margin-top: 20px;
	margin-right: 2%;
	width: 32%;
}
.odk3 li:last-child {
	margin-right: 0;
}




@media screen and (max-width: 640px)  {
#trainInformation .time ul{
	padding: 10px 0;
}
#trainInformation .time ul li,
#trainInformation .time ul li:nth-child(3n){
	display:inline-block;
	vertical-align:  top;
	margin-right: 1%;
	width: 48%;
	margin-bottom:6%;
}

#trainInformation .time ul li:nth-child(2n){
	margin-right: 0;
}
#odakyuLineInner {
	padding: 20px;
}
#odakyuLine .block .t span.m{
	margin: 0 0 10px;
	display: block;
	background: rgba(0,78,151,1.00);
}
#odakyuLine #point02 .left,
#odakyuLine #point02 .right{
	float: none;
	width: 100%;
	max-width: 400px;
	margin: 10px auto;
}
#odakyuLine #point03 .block {
	margin: 20px auto 30px;
}
#odakyuLine #point03 .left {
	float: none;
	width: 100%;
}
#odakyuLine #point03 .right {
	float: none;
	width: 100%;
	max-width: 487px;
}
	
	.odk1 li:nth-child(1) {
		margin-right: 0%;
		width: 100%;
	}
	.odk1 li:nth-child(2) {
		width: 100%;
	}
	.odk1 li:nth-child(3) {
		margin-right: 0%;
		width: 100%;
	}
	.odk1 li:nth-child(4) {
		width: 100%;
	}
	
	.odk3 li {
		margin-right: 0;
		width: 100%;
	}
	
	#odakyuLine .ttl {
		text-align: center;
		padding: 10px;
	}
	#odakyuLine .ttl .pp {
		position: static;
		width: 100%;
		margin: -20px auto 10px;
	}
}


/*simulation*/
#simulation .categoryName,
#simulation .subTitle {
	margin-bottom: 20px;
}
#simulation .subTitle span {
	margin-bottom: 10px;
	display: inline-block;
}
#simulation .figure img {
	width: 100%;
	height: auto;
}

#lastTrain {
	width: 425px;
	overflow: hidden;
	float: left;
}
#taxi {
	width: 425px;
	overflow: hidden;
	float: right;
}
#bus {
	overflow: hidden;
}
#busroute {
	width: 562px;
	float: left;
}
#busmap {
	width: 320px;
	float: right;
}
#busroute .figure {
	max-width: 562px;
	width: 100%;
	margin: 0 auto;
}
#busmap .figure {
	max-width: 320px;
	width: 100%;
	margin: 0 auto;
}

#lastTrain .figure,
#taxi .figure {
	max-width: 425px;
	width: 100%;
	margin: 0 auto;
}
#taxi .figure {
	margin-top: 35px;
}
#bus {
	clear: both;
}
#bus .title,
#shuden .title {
	padding: 20px 0 10px;
}

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

	#contents .accessContainer {
		background: none;
		padding-left: 0px;
	}

	#odakyuLineInner .cpy {
		width: 100%;
		float: none;
		margin-bottom: 20px;
	}
	#odakyuLineInner .figure {
		width: 100%;
		max-width: 498px;
		float: none;
		margin: 0 auto;
	}

	#busroute,
	#busmap,
	#lastTrain,
	#taxi {
		width: 100%;
		float: none;
	}
	#busmap {
		margin-top: 25px;
	}
	#taxi {
		margin-top: 40px;
	}
	#taxi .figure {
		margin-top: 0;
	}
}


@media screen and (max-width: 480px)  {
	#mainVisual {
		max-width: 100%;
	}
	#mainVisual .photo {
		width: 100%;
		height: 200px;
	}
	#mainVisual .title {
		padding: 0;
		max-width: 270px;
		top: 120px;
		left: 20px;
		right: auto;
	}
	#mainVisual .title img {
		width: 100%;
		height: auto;
	}
	
	#odakyuLineInner {
		padding: 25px 25px 0;
	}

	#access #mainCpy .title img {
		width: 95%;
		height: auto;
	}

}


/******************************************************

 clear fix
 
******************************************************/

#mainVisual:after,
#odakyuLineInner:after,
.section:after {
  display : block;
  clear : both;
  content : '';
}
#mainVisual,
#odakyuLineInner,
.section {
  zoom : 1;
}