﻿@charset "UTF-8";

/* @class */
.two-column-layout > aside {
	width: 270px; }
	aside nav::before {
		content: attr(data-label);
		display: block;
		padding: 0 0 20px;
		color: #333;
		font-weight: bold;
		text-align: left; }
		aside nav .l-navi {}
			aside nav .l-navi li {
				border-bottom: 1px solid #ccc; }
				aside nav .l-navi .in-l-navi {
					background-color: rgb(242, 242, 242); }
				aside nav .l-navi .in-l-navi li:last-of-type {
					border-bottom: none; }
				aside nav .l-navi li:first-of-type {
					border-top: 1px solid #ccc; }
				aside nav .l-navi a {
					display: block;
					position: relative;
					padding: 10px 2em 10px 2.5em;
					color: #333; }
				aside nav .l-navi a.current {
					background-color: rgb(38, 139, 187);
					color: #fff; }
				aside nav .l-navi a:hover,
				aside nav .l-navi a:focus {
					background-color: rgb(38, 139, 187);
					color: #fff;
					text-decoration: none;
					-webkit-transition: 0.3s ease;
					transition: 0.3s ease; }
					aside nav .l-navi a::before,
					aside nav .l-navi a::after {
						position: absolute;
						margin: auto;
						vertical-align: middle;
						content: ""; }
					aside nav .l-navi a::before {
						width: 2em;
						left: 0;
						top: 50%;
						-webkit-transform: translateY(-50%);
						transform: translateY(-50%);
						font-size: 1.125rem;
						color: rgb(38, 139, 187);
						text-align: center; }
					aside nav a.icon-lnavi-howto::before {
						content: "\f05a";
						font-family: FontAwesome; }
					aside nav a.icon-lnavi-servicelist::before {
						content: "\f09d";
						font-family: FontAwesome; }
					aside nav a.icon-lnavi-highway::before {
						content: "\f040";
						font-family: FontAwesome; }
					aside nav a.icon-lnavi-expla2::before {
						content: "\f274";
						font-family: FontAwesome; }
					aside nav a.icon-lnavi-ktouroku::before {
						content: "\f007";
						font-family: FontAwesome; }
					aside nav a.icon-lnavi-khenkou::before {
						content: "\f013";
						font-family: FontAwesome; }
					aside nav .l-navi a::after {
						top: 0;
						bottom: 0;
						right: 1em;
						width: 0.5em;
						height: 0.5em;
						border-top: 1px solid #333;
						border-right: 1px solid #333;
						-webkit-transform: rotate(45deg);
						-ms-transform: rotate(45deg);
						transform: rotate(45deg); }
						/*aside nav .l-navi a.is-open::after {
							border: none;
							border-right: 1px solid #333;
							border-bottom: 1px solid #333; }*/
					aside nav .l-navi a.current::before,
					aside nav .l-navi a:hover::before,
					aside nav .l-navi a:focus::before {
						color: #fff; }
					aside nav .l-navi a.current::after,
					aside nav .l-navi a:hover::after,
					aside nav .l-navi a:focus::after {
						border-top: 1px solid #fff;
						border-right: 1px solid #fff; }

h2.crossheading-bg.step {
	position: relative;
	padding-left: 6em; }
	h2.crossheading-bg.step::before {
		content: attr(data-label);
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		height: 100%;
		padding: 13px 1em;
		background-color: rgb(38, 139, 187);
		color: #fff;
		font-weight: bold; }

h3.subheading {
	color: rgb(38, 139, 186); }

a.m-button.icon-howto,
a.m-button.icon-servicelist,
a.m-button.icon-highway {
	padding-left: 2em; }
	a.m-button.icon-howto::before,
	a.m-button.icon-servicelist::before,
	a.m-button.icon-highway::before {
		position: absolute;
		margin: auto;
		font-weight: normal;
		vertical-align: middle;
		content: ""; }
	a.m-button.icon-howto::before {
		left: 0;
		top: 50%;
		-webkit-transform: translateY(-50%);
		transform: translateY(-50%);
		width: 2em;
		text-align: center;
		content: "\f05a";
		font-family: FontAwesome; }
	a.m-button.icon-highway::before {
		left: 0;
		top: 50%;
		-webkit-transform: translateY(-50%);
		transform: translateY(-50%);
		width: 2em;
		text-align: center;
		content: "\f040";
		font-family: FontAwesome; }
	a.m-button.icon-servicelist::before {
		left: 0;
		top: 50%;
		-webkit-transform: translateY(-50%);
		transform: translateY(-50%);
		width: 2em;
		text-align: center;
		content: "\f09d";
		font-family: FontAwesome; }

@media screen and (max-width: 768px) {
	.two-column-layout > aside { 
		-webkit-box-ordinal-group: 1;
		-ms-flex-order: 1;
		-webkit-order: 1;
		order: 1;
		width: 100%;
		padding-top: 20px; }
		aside nav::before {
			text-align: center; }
	.two-column-layout .main-contents {
		margin-top: 25px;
		width: 100%; }
		p.lead,
		section.lead p {
			text-align: left; } 
}

/* 初めてご利用の方へ */
.subsection-howto {}
	.subsection-howto .in-subsection {
		background-color: rgb(242, 242, 242); }
		.subsection-howto .layout-table {}
			.subsection-howto .layout-table > .figure {
				width: 200px;
				text-align: center; }
			.subsection-howto .layout-table > .body {
				padding: 10px 0 10px 20px; }
				.subsection-howto .m-moreinfo {
					text-align: left; }

@media screen and (max-width: 768px) {
	.subsection-howto .layout-table > * {
			display: block; }
		.subsection-howto .layout-table > .figure {
			margin: auto;
			text-align: center; }
		.subsection-howto .layout-table > .body {
			padding-left: 0; }
			.subsection-howto .m-moreinfo {
				text-align: center; }
}

.subsection-step {}
	.subsection-step .in-subsection {
		background-color: rgb(242, 242, 242); }
		.subsection-step .layout-table {
			table-layout: fixed; }
			.subsection-step .layout-table > * {
				vertical-align: middle; }
			.layout-table.ut-vertical > * {
				vertical-align: top; }
			.subsection-step .layout-table > figure {}
			.subsection-step .layout-table > .body {
				padding: 10px 0 10px 20px; }

@media screen and (max-width: 768px) {
	.subsection-step .layout-table > * {
			display: block; }
		.subsection-step .layout-table > figure {
			margin: auto;
			text-align: center; }
		.subsection-step .layout-table > .body {
			padding-left: 0; }
}

/* コンビニエンスストアで発券可能なサービス */
.main-contents.convenience {}
	.main-contents.convenience .m-moreinfo {
		text-align: left; }
	.main-contents.convenience .m-moreinfo .notes {
		margin-top: 10px; }
		.main-contents.convenience .in-subsection {
			background-color: rgb(242, 242, 242); }
			.main-contents.convenience .figure {
				width: 184px;
				text-align: center; }
				.main-contents.convenience .figure .ut-bg-circle {
					width: 184px;
					height: 184px; }
					.main-contents.convenience .figure .ut-bg-circle img {
						position: relative;
						top: 50%;
						-webkit-transform: translateY(-50%);
						transform: translateY(-50%); }
			.main-contents.convenience .body {
				padding: 10px 0 10px 20px; }

@media screen and (max-width: 768px) {
	.main-contents.convenience .layout-table > * {
		display: block; }
		.main-contents.convenience .figure {
			margin: auto; }
		.main-contents.convenience .body {
			padding-left: 0; }
}

/* クレジットカード決済で発券可能なサービス */
.main-contents.credit {}
	.main-contents.credit .m-moreinfo {
		text-align: left; }
	.main-contents.credit .m-moreinfo .notes {
		margin-top: 10px; }
		.main-contents.credit .in-subsection {
			background-color: rgb(242, 242, 242); }
			.main-contents.credit .figure {
				width: 184px;
				text-align: center; }
				.main-contents.credit .figure .ut-bg-circle {
					width: 184px;
					height: 184px; }
					.main-contents.credit .figure .ut-bg-circle img {
						position: relative;
						top: 50%;
						-webkit-transform: translateY(-50%);
						transform: translateY(-50%); }
			.main-contents.credit .body {
				padding: 10px 0 10px 20px; }

@media screen and (max-width: 768px) {
	.main-contents.credit .layout-table > * {
		display: block; }
		.main-contents.credit .figure {
			margin: auto; }
		.main-contents.credit .body {
			padding-left: 0; }
}

/* お支払い方法 */
.subsection-service {}
	.subsection-service .m-moreinfo {
			text-align: left; }

.menu-servicelist.layout-flex {
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	-webkit-justify-content: space-between;
	justify-content: left; }
	.menu-servicelist li {
		width: 24%;
		border-radius: 4px;
		background-color: rgb(38, 139, 187); 
	    margin-right:10px;}
		.menu-servicelist a {
			display: block;
			position: relative;
			height: 100%;
			padding: 90px 10px 20px;
			color: #fff;
			text-align: center; }
		.menu-servicelist a:hover,
		.menu-servicelist a:focus {
			text-decoration: none;
			opacity: .5;
			-webkit-transition: 0.3s ease;
			transition: 0.3s ease; }
			.menu-servicelist a::after {
				display: block;
				position: absolute;
				bottom: 10px;
				left: 50%;
				width: 0;
				height: 0;
				margin: auto;
				border-top: 5px solid #fff;
				border-right: 5px solid transparent;
				border-left: 5px solid transparent;
				content: ""; }
		.menu-servicelist a {
			background-repeat: no-repeat;
			background-position: center 10px; }
		.menu-servicelist a.pic-cc {
			background-image: url(/hon/NewContent/Images/ServiceList/pic-menu-cc.png); }
		.menu-servicelist a.pic-cvs {
			background-image: url(/hon/NewContent/Images/ServiceList/pic-menu-cvs.png); }
		.menu-servicelist a.pic-ticketbooth {
			background-image: url(/hon/NewContent/Images/ServiceList/pic-menu-ticketbooth.png); }
		.menu-servicelist a.pic-carrier {
			background-image: url(/hon/NewContent/Images/ServiceList/pic-menu-carrier.png); }
		.menu-servicelist a.pic-code_paypay{
			background-image: url(/hon/NewContent/Images/ServiceList/pic-menu-carrier.png); }

.subsection-service#cc01 {}
	.subsection-service#cc01 .in-subsection {}
		.subsection-service#cc01 .logos-cc.layout-table {
			table-layout: fixed;
			border-collapse: separate;
			border-spacing: 10px 0; }
		.subsection-service#cc01 .logos-cc {
			margin: 10px 0 15px; }
			.subsection-service#cc01 .logos-cc.layout-table > * {
				vertical-align: middle; }
			.subsection-service#cc01 .logos-cc li {
				padding: 10px;
				background-color: #fff;
				text-align: center; }
			.subsection-service#cc01 .division {}
				.subsection-service#cc01 .item.layout-table {}
				.subsection-service#cc01 .item.layout-table > * {
					vertical-align: middle; }
					.subsection-service#cc01 .item > .figure {
						width: 74px;
						padding: 10px 0;
						background-color: rgb(38, 139, 187);
						text-align: center; }
					.subsection-service#cc01 .item .body-item {
						padding: 10px 20px;
						background-color: #fff; }

.subsection-service#cc02 {}
	.subsection-service#cc02 .in-subsection {}
		.subsection-service#cc02 .division.layout-table {}
			.subsection-service#cc02 .division.layout-table > * {
				vertical-align: middle; }
			.subsection-service#cc02 .division > .figure {
				width: 114px;
				text-align: center; }
				.subsection-service#cc02 .division > .figure .ut-bg-circle {
					width: 114px;
					height: 114px; }
					.subsection-service#cc02 .division > .figure .ut-bg-circle img {
						position: relative;
						top: 50%;
						-webkit-transform: translateY(-50%);
						transform: translateY(-50%); }
			.subsection-service#cc02 .division .body-division {
					padding: 10px 0 10px 20px; }

.subsection-service#cvs {}
	.subsection-service#cvs .in-subsection {}
		.subsection-service#cvs .division.layout-table {
			border-collapse: separate;
			border-spacing: 2px 0; }
			.subsection-service#cvs .division.layout-table > div {
				vertical-align: middle; }
			.subsection-service#cvs .division > .figure {
				width: 114px;
				padding: 10px 0;
				text-align: center;
				background-color: #fff; }
			.subsection-service#cvs .division .body-division {
				padding: 10px 20px;
				background-color: #fff; }
				.subsection-service#cvs .division .body-division a {
					color: #333;
					text-decoration: underline; }

.subsection-service#ticketBooth {}

.subsection-service#carrier {}
	.subsection-service#carrier .in-subsection {}
		.subsection-service#carrier .division.layout-table {}
			.subsection-service#carrier .division.layout-table > * {
				vertical-align: middle; }
			.subsection-service#carrier .division > .figure {
				width: 114px;
				text-align: center; }
				.subsection-service#carrier .division > .figure .ut-bg-circle {
					width: 114px;
					height: 114px; }
					.subsection-service#carrier .division > .figure .ut-bg-circle img {
						position: relative;
						top: 50%;
						-webkit-transform: translateY(-50%);
						transform: translateY(-50%); }
			.subsection-service#carrier .division .body-division {
					padding: 10px 0 10px 20px; }

.subsection-service#Code_PayPay {}
	.subsection-service#Code_PayPay .in-subsection {}
		.subsection-service#Code_PayPay .division.layout-table {}
			.subsection-service#Code_PayPay .division.layout-table > * {
				vertical-align: middle; }
			.subsection-service#Code_PayPay .division > .figure {
				width: 114px;
				text-align: center; }
				.subsection-service#Code_PayPay .division > .figure .ut-bg-circle {
					width: 114px;
					height: 114px; }
					.subsection-service#Code_PayPay .division > .figure .ut-bg-circle img {
						position: relative;
						top: 50%;
						-webkit-transform: translateY(-50%);
						transform: translateY(-50%); }
			.subsection-service#Code_PayPay .division .body-division {
					padding: 10px 0 10px 20px; }

@media screen and (max-width: 768px) {
	.subsection-service {}
		.subsection-service .in-subsection {}
			.subsection-service .m-moreinfo {
				text-align: center; }
	.menu-servicelist.layout-flex {
		-ms-flex-wrap: wrap;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap; }
		.menu-servicelist li {
			width: 100%;
			margin-bottom: 15px; }
		.menu-servicelist li:last-of-type {
			margin-bottom: 0; }
			.menu-servicelist a {
				min-height: 64px;
				padding: 10px 2em 10px 80px;
				color: #fff;
				text-align: left;
				position: relative; }
				.menu-servicelist a .ut-position {
					position: absolute;
					top: 50%;
					-webkit-transform: translateY(-50%);
					transform: translateY(-50%); }
			.menu-servicelist a {
				background-position: 10px center;
				background-size: 60px 44px; }
				.menu-servicelist li a::after {
					top: 0;
					bottom: 0;
					right: 1em;
					margin: auto;
					margin-right: 0;
					vertical-align: middle; }
		.subsection-service#cc02 .division.layout-table > * {
			display: block; }
		.subsection-service#cc02 .division > .figure {
			margin: auto; }
		.subsection-service#cc02 .division .body-division {
			padding-left: 0; }
}

/* 発車オーライネット決済サービス */
.lead-netweb {
	text-align: left; }
.lead-netweb h2.crossheading {
	margin-top: 30px;
	margin-bottom: 30px;
	font-size: 1.5rem;
	text-align: center; }
.subsection-netweb {}
	.subsection-netweb .in-subsection {
		background-color: rgb(242, 242, 242); }
		.subsection-netweb .layout-table {
			table-layout: fixed; }
			.subsection-netweb .layout-table > * {
				vertical-align: middle; }
			.layout-table.ut-vertical > * {
				vertical-align: top; }
			.subsection-netweb .layout-table > figure {}
			.subsection-netweb .layout-table > .body {
				padding: 10px 0 10px 20px; }
				.subsection-netweb .m-moreinfo {
					margin-top: 0; }

@media screen and (max-width: 768px) {
	.subsection-netweb .layout-table > * {
			display: block; }
		.subsection-netweb .layout-table > figure {
			margin: auto;
			text-align: center; }
		.subsection-netweb .layout-table > .body {
			padding-left: 0; }
}

/* 取り扱い総合 */
.menu-tebiki {
	text-align: left; }
	.menu-tebiki li {
		display: inline-block;
		margin-bottom: 10px; }
		.menu-tebiki ul li:first-of-type {
			float: left;
			width: 8em;
			margin-right: 1em;
			padding: 10px 0;
			text-align: right; }
		.menu-tebiki a.m-button {
			font-size: .875rem; } 
.subsection-tebiki {}
	.subsection-tebiki .division:first-of-type {
		margin-top: 0; }
		.subsection-tebiki h3.head-th {
			width: 7em;
			white-space: nowrap; }
		.subsection-tebiki .body-division {
			padding-left: 20px; }
			.bnrs-tebiki.layout-flex {
				-webkit-flex-wrap: wrap;
				-ms-flex-wrap: wrap;
				flex-wrap: wrap;
				width: 100%; }
				.bnrs-tebiki li {
					margin-right: 10px;
					margin-bottom: 10px; }
					.bnrs-tebiki a {
						display: block;
						padding: 13px 13px 13px 57px;
						border: 1px solid #ccc;
						border-radius: 4px;
						color: #333;
						font-size: 1rem;
						font-weight: bold;
						line-height: 1.2; }
					.bnrs-tebiki a {
						background-repeat: no-repeat;
						background-position: 8px center; }
					.bnrs-tebiki a.illust-loppi {
						background-image: url(/hon/NewContent/Images/ServiceList/illust-loppi-02.png); }
					.bnrs-tebiki a.illust-famiport {
						background-image: url(/hon/NewContent/Images/ServiceList/illust-famiport-02.png); }
					.bnrs-tebiki a.illust-kst {
						background-image: url(/hon/NewContent/Images/ServiceList/illust-kst-02.png); }
					.bnrs-tebiki a.illust-multicopy {
						background-image: url(/hon/NewContent/Images/ServiceList/illust-multicopy-02.png); }
						.bnrs-tebiki a:hover,
						.bnrs-tebiki a:focus {
							text-decoration: none;
							opacity: .5;
							-webkit-transition: 0.3s ease;
							transition: 0.3s ease; }
@media screen and (max-width: 768px) {
	.menu-tebiki {}
		.menu-tebiki li {}
			.menu-tebiki ul li:first-of-type {
				display: block;
				float: none;
				width: 100%;
				font-weight: bold;
				text-align: left;
				padding: 0; }
	.subsection-tebiki {}
		.subsection-tebiki .division.layout-table > * {
			display: block; }
			.subsection-tebiki h3.head-th {
				width: 100%;
				margin-bottom: .5em; }
			.subsection-tebiki .body-division {
				padding-left: 0; }
			.subsection-tebiki .br::before {
				content: none; }
}

@media screen and (max-width: 640px) {
	.bnrs-tebiki li {
		width: 100%;
		margin-right: 0; }
}

/* ローソン・ミニストップでの発券 */
.main-contents.jtbhta {}
	.main-contents.jtbhta .layout-table {
		table-layout: fixed;
		border-collapse: collapse; }
		.main-contents.jtbhta .layout-table > * {
			padding: 30px;
			border: 1px solid #ddd;
			vertical-align: middle;
			text-align: center; }
			.main-contents.jtbhta .layout-table .order-2 {
				background-color: rgb(242, 242, 242); }
				.main-contents.jtbhta .m-moreinfo .notes {
					margin-top: 10px; }

@media screen and (max-width: 768px) {
	.main-contents.jtbhta {}
		.main-contents.jtbhta .subsection {
			margin-bottom: 40px;
			padding: 0 20px; }
			.main-contents.jtbhta .layout-table > * {
				display: block;
				padding: 20px; }
				.main-contents.jtbhta .layout-table .order-2 {
					margin-top: -1px; }
}

/* インターネット乗車票 */
.main-contents.busplaza {}
	.main-contents.busplaza .layout-table {
		table-layout: fixed;
		border-collapse: collapse; }
		.main-contents.busplaza .layout-table > * {
			padding: 30px;
			border: 1px solid #ddd;
			vertical-align: middle;
			text-align: center; }
			.main-contents.busplaza .order-1 {
				background-color: rgb(242, 242, 242); }
				.main-contents.busplaza .order-1 h2.subheading {
					margin-bottom: .5em; }
				.main-contents.busplaza .m-moreinfo .notes {
					margin-top: 10px; }
				.main-contents.busplaza .figure {
					width: 114px;
					margin: 0 auto 10px;
					text-align: center;  }
					.main-contents.busplaza .ut-bg-circle {
						width: 114px;
						height: 114px; }
						.main-contents.busplaza .ut-bg-circle img {
							position: relative;
							top: 50%;
							-webkit-transform: translateY(-50%);
							transform: translateY(-50%); }
				.main-contents.busplaza .order-2 .division:first-of-type {
					margin-bottom: 30px; }

@media screen and (max-width: 768px) {
	.main-contents.busplaza {
		width: 100%; }
		.main-contents.busplaza .subsection {
			margin-bottom: 40px;
			padding: 0 20px; }
			.main-contents.busplaza .layout-table > * {
				display: block;
				padding: 20px; }
				.main-contents.busplaza .layout-table .order-2 {
					margin-top: -1px; }
}

/* 予約方法 */
.subsection-highway {}
	.subsection-highway .in-subsection {
		background-color: rgb(242, 242, 242); }
		.subsection-highway .layout-table {
			table-layout: fixed; }
			.subsection-highway .layout-table > * {
				vertical-align: middle; }
			.subsection-highway .layout-table > figure {}
			.subsection-highway .layout-table > .body {
				padding: 10px 0 10px 20px; }

section.lead .m-moreinfo {
	text-align: right; }

.subsection.menu-howto {}
	.menu-howto .tabs {
		margin-bottom: 30px; }
		.menu-howto .tabs .layout-table {
			table-layout: fixed;
			border-bottom: 2px solid rgb(38, 139, 187);
			text-align: center; }
			.menu-howto .tabs ul li {
				border-right: 2px solid #fff;
				background-color: #ddd;
				font-weight: bold; }
			.menu-howto .tabs ul li:last-of-type {
				border-right: none; }
				.menu-howto .tabs li a {
					display: block;
					position: relative;
					padding: 10px 0.5em 10px 2em;
					color: #333; }
				.menu-howto .tabs li a.current {
					background-color: rgb(38, 139, 187);
					color: #fff; }
				.menu-howto .tabs li a:hover,
				.menu-howto .tabs li a:focus {
					background-color: rgb(38, 139, 187);
					color: #fff;
					text-decoration: none;
					-webkit-transition: 0.3s ease;
					transition: 0.3s ease; }
					.menu-howto .tabs li a.current::after {
						position: absolute;
						left: 50%;
						bottom: -10px;
						width: 0;
						height: 0;
						margin-left: -10px;
						border-top: 10px solid rgb(38, 139, 187);
						border-right: 10px solid transparent;
						border-left: 10px solid transparent;
						content: ""; }
				.icon-tab-highway {
					background-image: url(/hon/NewContent/Images/Howto/icon-tab-highway.png);
					background-repeat: no-repeat;
					background-position: 7px center; }
					.icon-tab-highway.current, .icon-tab-highway:hover, .icon-tab-highway:focus {
						background-image: url(/hon/NewContent/Images/Howto/icon-tab-highway_on.png); }
				.icon-tab-airportline {
					background-image: url(/hon/NewContent/Images/Howto/icon-tab-airportline.png);
					background-repeat: no-repeat;
					background-position: 7px center; }
					.icon-tab-airportline.current, .icon-tab-airportline:hover, .icon-tab-airportline:focus {
						background-image: url(/hon/NewContent/Images/Howto/icon-tab-airportline_on.png); }
				.icon-tab-tours {
					background-image: url(/hon/NewContent/Images/Howto/icon-tab-tours.png);
					background-repeat: no-repeat;
					background-position: 7px center; }
					.icon-tab-tours.current, .icon-tab-tours:hover, .icon-tab-tours:focus {
						background-image: url(/hon/NewContent/Images/Howto/icon-tab-tours_on.png); }
				.icon-tab-routelist {
					background-image: url(/hon/NewContent/Images/Howto/icon-tab-routelist.png);
					background-repeat: no-repeat;
					background-position: 7px center; }
					.icon-tab-routelist.current, .icon-tab-routelist:hover, .icon-tab-routelist:focus {
						background-image: url(/hon/NewContent/Images/Howto/icon-tab-routelist_on.png); }
	.menu-howto h2.crossheading {
		margin: 0 auto 30px;
		padding: 0 20px;
		color: rgb(251, 145, 1);
		font-size: 1.5rem;
		text-align: center; }
		.menu-howto h2.crossheading span {
			color: #333;
			font-size: 0.875rem;
			font-weight: normal; }
	.menu-howto .flowchart-sp {
		display: none; }
		img[usemap] {
			max-width: 100%;
			height: auto; }

.subsection-highway.step-login {}
	.subsection-highway.step-login .layout-flex {
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		-webkit-justify-content: space-between;
		justify-content: space-between; }
		.subsection-highway.step-login .layout-flex > figure {
			width: 48%;
			margin-bottom: 15px; }
			.subsection-highway.step-login .layout-flex > figure figcaption {
				margin-bottom: 10px;
				text-align: center; }
			.subsection-highway.step-login .layout-flex > figure .caption {}

.subsection-highway.step-thanks {}
	.subsection-highway.step-thanks .layout-table > * {
		vertical-align: top; }

@media screen and (max-width: 768px) {
	section.lead .m-moreinfo {
		text-align: center; }
	.subsection.menu-howto {
		margin-bottom: 40px; }
	.subsection-highway {}
		.subsection-highway .layout-table {}
			.subsection-highway .layout-table > * {
				display: block; }
				.subsection-highway .layout-table > figure {
					margin: auto;
					text-align: center; }
				.subsection-highway .layout-table > .body {
					padding-left: 0; }
		.subsection-highway.step-login .layout-flex {
			-ms-flex-wrap: wrap;
			-webkit-flex-wrap: wrap;
			flex-wrap: wrap; }
			.subsection-highway.step-login .layout-flex > figure {
				width: 100%;
				text-align: center; }
				.subsection-highway.step-login .layout-flex > figure p {
					text-align: left; }
		.subsection-highway .m-moreinfo {
			text-align: center; }
}

@media screen and (max-width: 640px) {
	.menu-howto .tabs li a {
		padding: 45px .5em 10px; }
		.icon-tab-highway {
			background-position: center 7px; }
		.icon-tab-airportline {
			background-position: center 7px; }
		.icon-tab-tours {
			background-position: center 7px; }
		.icon-tab-routelist {
			background-position: center 7px; }
	.subsection.menu-howto .flowchart {
		display: none; }
	.subsection.menu-howto .flowchart-sp {
		display: block; }
}