@charset "utf-8";

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

	タクシー

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

/** 共通ファイルの継承 **/
@import url( "../../css/common.css" );

/*------------------------------------------------------------------------------

	ヘッダー画像

------------------------------------------------------------------------------*/

main > header {
    background-image: url(../img/header_image.jpg);
	background-position: center;
}

/*------------------------------------------------------------------------------

	contents

------------------------------------------------------------------------------*/

main .content_box {
	font-size: 1.1em;
}

main .gmap {
	position: relative;
    width: 90%;
	aspect-ratio: 3 / 2;
	margin: 2.5em auto 2em;
}

main .gmap iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.ko main .text_box p,
.ru main .text_box p {
	text-align: left;
}

@media screen and (max-width: 820px){
	
.en main .text_box p {
	text-align: left;
}	
	
}

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

main .gmap {
    width:100%;
	aspect-ratio: 1 / 1;
	margin: 5vw auto 5vw;
}

}

main table a,
main table a:visited {
	color: #FFF;
}

main table thead th {
	width: 30%;
	text-align: center;
}

main table thead th:first-child {
	width: auto;
}

main table tbody td {
	text-align: right;
}

main .setting {
    margin: 0 0 5em;
}

main .case {
	display: flex;
	justify-content: space-between;
}

main .case {
	width: 65%;
	margin: auto;
}

main .case section {
	width: 49%;
}

main .application {
	display: flex;
    align-items: center;
}

main .application figure {
    width: 135px;
	margin: 0;
}

main .application .apple {
    padding-left: 10px;
}

main .application .google {
    margin-top: -10px;
}

main .application .google img {
    width: 156px;
}

main .reserv {
	text-align: center;
}

main .case h4 {
	padding: 0.5em;
	background: rgba(38,161,214,0.2);
	text-align: center;
}

.getting_onoff .map {
    width: 70%;
}

main .taxi_info {
	margin-top: 5em;
}

.detail main .content_box .taxi_info h3 {
	margin-bottom: 1.5em;
}

main .external {
	display: flex;
	margin: 0;
	list-style: none;
	flex-wrap: wrap;
	justify-content: flex-start;
}

main .external a {
	position: relative;
	display: flex;
	align-items: center;
	width: 32%;
	padding: 1em 2em;
	text-decoration: none;
    margin: 0.5em 2% 0.5em 0;
	border: 1px solid #CCC;
}

main .external a:nth-child(3n){
	margin-right: 0;
}

main .external a::after {
	position: absolute;
	top: 50%;
    transform: translate(-50%,-50%);
	right: 0.5em;
}

@media screen and (max-width: 767px){
	
main table,
.external a {
	font-size: 2.5vw;
}
	
main table thead th {
	width: 20%;
}

main .setting {
    margin: 0 0 2em;
}
	
main .case {
	display: block;
}
	
main .case,
main .case section {
	width: 100%;
}
	
main .case figure {
	text-align: center;
}
	
.getting_onoff .map {
    width: 100%;
	margin-top: 1.5em;
}
	
main .ride img {
    width: 100%;
}
	
main .taxi_info {
	margin-top: 2em;
}
	
main .external a {
    width: 48%;
}
	
main .external a:nth-child(3n) {
    margin-right: 2%;
}
	
main .external a:nth-child(2n) {
    margin-right: 0;
}


}