html {
scroll-behavior: smooth;
} #wrapper {
padding-top: 100px;
}
.rideshare-container {
width: 824px;
margin: 0 auto;
}
#header .rideshare-container {
width: 904px;
}
#header {
position: fixed;
height: 100px;
background: #00232E;
border-bottom: 4px solid #E9BF00;
top: 0;
left: 0;
right: 0;
width: 100%;
margin: 0 auto;
z-index: 9999;
}
.admin-bar #header {
top: 32px;
}
.nav-inner {
height: 100px;
}
.navbar {
display: flex;
justify-content: space-between;
padding: 0;
position: relative;
align-items: center;
height: 100%;
-webkit-transition: all 0.3s ease-out 0s;
transition: all 0.3s ease-out 0s;
}
a.navbar-brand {
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 20px;
line-height: 24px;
color: #fff;
padding: 0;
margin: 0;
display: block;
text-decoration: none;
}
a.navbar-brand:hover {
opacity: 0.7;
}
a.navbar-brand span {
color: #FF8C00;
}
.collapse:not(.show) {
display: flex;
}
.navbar-collapse {
display: block;
margin: 0;
padding: 0;
}
.navbar-nav {
display: flex;
list-style: none;
margin: 0;
column-gap: 26px;
align-items: center;
padding: 0;
}
.navbar-nav > li {
margin: 0;
padding: 0;
}
.navbar-nav > li a {
display: block;
width: 100%;
font-weight: 700;
font-family: "Inter", sans-serif;
font-size: 14px;
line-height: 18px;
padding: 0;
margin: 0;
color: #fff;
text-align: center;
text-decoration: none;
transition: 0.3s;
}
.navbar-nav > li a:hover {
opacity: 0.7;
}
.nav-contact-mobile ul {
display: none;
}
.mobile-menu-btn {
display: none;
}
#footer {
background: #003454;
padding: 70px 0;
margin: 0;
}
.footer-logo {
margin: 0 0 70px;
text-align: center;
}
.footer-logo p {
font-family: "Inter", sans-serif;
font-weight: 400;
font-size: 32px;
line-height: 40px;
color: #fff;
padding: 0;
margin: 0 0 15px;
}
.footer-logo h1 {
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 40px;
line-height: 56px;
color: #fff;
padding: 0;
margin: 0;
}
.footer-contact {
margin: 0 0 18px;
text-align: center;
}
.footer-contact address {
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 20px;
line-height: 24px;
color: #fff;
padding: 0;
margin: 0 0 18px;
font-style: normal;
}
.footer-contact p {
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 20px;
line-height: 24px;
color: #fff;
padding: 0;
margin: 0;
}
#footer-copyright p {
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 16px;
line-height: 20px;
color: #fff;
padding: 0;
margin: 0;
text-align: center;
}
p.pagetop {
position: fixed;
z-index: 999;
right: 60px;
bottom: 70px;
width: 100px;
padding: 0;
margin: 0;
}
p.pagetop a {
display: block;
width: 100%;
text-decoration: none;
}
p.pagetop a:hover {
opacity: 0.7;
}
p.pagetop a img {
display: block;
width: 100%;
}
#banner {
position: relative;
padding: 70px 0;
margin: 0;
background: #003454;
}
.banner-title {
margin: 0 0 40px;
}
.banner-title h1 {
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 20px;
line-height: 24px;
color: #E9BF00;
padding: 0;
margin: 0;
text-align: center;
}
.banner-title p {
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 16px;
line-height: 20px;
background: #E9BF00;
color: #003454;
padding: 10px;
width: 232px;
margin: 18px auto 0;
text-align: center;
border-radius: 40px;
}
.banner-highlight {
margin: 0 0 40px;
}
.banner-highlight h2 {
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 42px;
line-height: 1.4;
color: #fff;
padding: 0;
margin: 0;
text-align: center;
}
.banner-card {
width: max-content;
margin: 0 auto 40px;
border: 1px solid #C8C8C8;
background: rgba(195, 195, 195, 0.3);
padding: 16px 24px;
border-radius: 10px;
}
.banner-card p {
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 14px;
line-height: 20px;
color: #fff;
padding: 0;
margin: 0;
text-align: center;
}
.banner-card p span {
display: inline;
color: #FF8C00;
}
.banner-text p {
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 16px;
line-height: 20px;
color: #fff;
padding: 0;
margin: 0;
text-align: center;
}
#news {
position: relative;
padding: 100px 0 120px;
margin: 0;
background: #DEF1FF;
}
.home-section-title {
margin: 0 0 40px;
}
.home-section-title h2 {
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 24px;
line-height: 34px;
color: #000;
padding: 0;
margin: 0;
}
.home-section-title p {
font-family: "Inter", sans-serif;
font-weight: 500;
font-size: 14px;
line-height: 18px;
color: #000;
padding: 0;
margin: 0 0 12px;
text-transform: uppercase;
}
ul.rideshare-news-list {
margin: 0;
padding: 0;
list-style: none;
}
ul.rideshare-news-list li {
padding: 15px 0;
border-top: 1px solid #C4C4C4;
margin: 0;
}
ul.rideshare-news-list li:last-child {
border-bottom: 1px solid #C4C4C4;
}
ul.rideshare-news-list li a {
display: flex;
align-items: center;
column-gap: 20px;
row-gap: 0;
text-decoration: none;
}
ul.rideshare-news-list li a:hover {
opacity: 0.7;
}
.news-list-date {
flex-shrink: 0;
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 14px;
line-height: 18px;
color: #000;
padding: 0;
margin: 0 30px 0 0;
}
.news-list-category {
flex-shrink: 0;
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 12px;
line-height: 15px;
background: #00A200;
color: #fff;
padding: 4px 6px;
border-radius: 4px;
margin: 0;
}
h3.news-list-title {
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 14px;
line-height: 18px;
color: #000;
padding: 0;
margin: 0;
}
#about {
position: relative;
padding: 100px 0;
margin: 0;
background: #FFF;
}
ul.about-lists {
list-style: none;
margin: 0 0 80px;
padding: 0;
}
ul.about-lists li {
display: flex;
column-gap: 10px;
align-items: center;
padding: 20px 24px;
margin: 0 0 16px;
border-radius: 10px;
border: 1px solid #C8C8C8;
font-family: "Inter", sans-serif;
font-weight: 400;
font-size: 14px;
line-height: 1;
color: #000;
}
ul.about-lists li::before {
flex-shrink: 0;
display: block;
content: '';
width: 6px;
height: 6px;
border-radius: 6px;
background: #4E95FF;
}
ul.about-lists span {
background: #C3EBFF;
display: flex;
padding: 16px 20px;
margin: 0;
border-left: 3px solid #4E95FF;
font-family: "Inter", sans-serif;
font-weight: 400;
font-size: 14px;
line-height: 1;
color: #000;
}
ul.about-lists span::before {
flex-shrink: 0;
display: block;
content: '※';
}
.about-division h3 {
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 14px;
line-height: 1;
color: #000;
padding: 0;
margin: 0 0 44px;
}
.about-division ul {
display: flex;
justify-content: space-between;
list-style: none;
padding: 30px 80px;
margin: 0;
border-radius: 30px;
border: 1px solid #C8C8C8;
}
.about-division ul li {
width: 176px;
margin: 0;
}
.about-division ul li img {
display: block;
width: 64px;
margin: 0 auto 15px;
}
.about-division ul li h4 {
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 14px;
line-height: 20px;
height: 40px;
color: #00A200;
padding: 0;
margin: 0 0 15px;
text-align: center;
}
.about-division ul li p {
font-family: "Inter", sans-serif;
font-weight: 400;
font-size: 14px;
line-height: 20px;
height: 60px;
color: #000;
padding: 0;
margin: 0 0 15px;
text-align: center;
}
.about-division ul li span {
display: block;
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 14px;
line-height: 1;
color: #000;
padding: 0;
margin: 0;
text-align: center;
}
.about-division-separator {
width: 48px;
margin: 30px auto;
}
.about-division-separator img {
display: block;
width: 100%;
}
.about-division-card {
display: flex;
justify-content: space-between;
align-items: center;
list-style: none;
padding: 45px 120px;
margin: 0;
border-radius: 30px;
border: 1px solid #C8C8C8;
}
.about-division-card img {
display: block;
width: 120px;
margin: 0;
}
.about-division-card-content {
width: 420px;
}
.about-division-card-content h4 {
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 24px;
line-height: 1;
color: #00A200;
padding: 0;
margin: 0 0 18px;
}
.about-division-card-content p {
font-family: "Inter", sans-serif;
font-weight: 400;
font-size: 20px;
line-height: 1;
color: #000;
padding: 0;
margin: 0 0 18px;
}
.about-division-card-content p:nth-child(2) {
margin: 0 0 18px;
}
.about-division-card-content span {
display: block;
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 20px;
line-height: 1;
color: #000;
padding: 0;
margin: 0;
}
#service-area {
position: relative;
padding: 100px 0;
margin: 0;
background: #DEF1FF;
}
.service-area-card {
padding: 30px 27px;
background: #fff;
border: 1px solid #C8C8C8;
border-radius: 20px;
margin: 0 0 40px;
}
.service-area-card:last-child {
margin: 0;
}
.service-area-card h3 {
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 14px;
line-height: 1;
color: #000;
padding: 0;
margin: 0 0 18px;
}
.service-area-card p {
font-family: "Inter", sans-serif;
font-weight: 400;
font-size: 14px;
line-height: 1.4;
color: #000;
padding: 0;
margin: 0 0 15px;
}
.service-area-card img {
display: block;
width: 415px;
margin: 0 auto 20px;
}
.service-area-card ul {
list-style: none;
padding: 0;
margin: 0 0 20px;
}
.service-area-card ul li {
display: flex;
align-items: center;
column-gap: 6px;
padding: 0;
margin: 0 0 10px;
font-family: "Inter", sans-serif;
font-weight: 400;
font-size: 14px;
line-height: 1;
color: #000;
}
.service-area-card ul li:last-child {
margin: 0;
}
.service-area-card ul li::before {
flex-shrink: 0;
display: block;
content: '';
width: 16px;
height: 16px;
border-radius: 16px;
background: #000;
}
.service-area-card > span {
display: block;
background: #C3EBFF;
padding: 16px 20px;
margin: 0 0 20px;
border-left: 3px solid #4E95FF;
font-family: "Inter", sans-serif;
font-weight: 400;
font-size: 14px;
line-height: 1;
color: #000;
}
.service-area-card > span:last-child {
margin: 0;
}
.service-area-option {
display: flex;
justify-content: center;
column-gap: 60px;
}
.service-area-option-content {
width: 296px;
margin: 0;
}
.service-area-option-content h4 {
font-family: "Inter", sans-serif;
font-weight: 400;
font-size: 14px;
line-height: 1;
color: #000;
padding: 0;
margin: 0 0 16px;
}
.service-area-option-text {
display: flex;
align-items: center;
column-gap: 20px;
}
.service-area-option-text img {
display: block;
flex-shrink: 0;
width: 54px;
margin: 0 !important;
}
.service-area-option-text table {
width: 100%;
border: none;
margin: 0;
}
.service-area-option-text table tr {
border: none;
}
.service-area-option-text table tr td {
font-family: "Inter", sans-serif;
font-weight: 400;
font-size: 14px;
line-height: 1;
color: #000;
padding: 0 0 9px;
margin: 0;
border: none;
width: 98px;
}
.service-area-option-text table tr td:nth-child(2) {
font-size: 14px;
width: 26px;
text-align: center;
}
.service-area-option-text table tr:last-child td {
padding: 0;
}
#hours-fare {
position: relative;
padding: 100px 0;
margin: 0;
background: #FFF;
}
ul.hours-fare-point {
display: flex;
column-gap: 12px;
list-style: none;
padding: 0;
margin: 0 0 30px;
}
ul.hours-fare-point li {
width: max-content;
padding: 10px 20px;
margin: 0;
border-radius: 35px;
background: #A1C7FF;
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 12px;
line-height: 15px;
color: #003454;
}
table.hours-fare-table-desktop {
display: table;
}
table.hours-fare-table-mobile {
display: none;
}
#hours-fare table {
width: 100%;
border: none;
border-radius: 10px 10px 0 0;
overflow: hidden;
}
#hours-fare table tr {
border: none;
}
#hours-fare table tr th {
background: #003454;
padding: 16px 20px;
text-align: left;
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 14px;
line-height: 18px;
color: #fff;
border: none;
}
#hours-fare table tr th:nth-child(2) {
text-align: right;
padding-right: 32px;
}
#hours-fare table tr td {
padding: 12px 20px;
text-align: left;
font-family: "Inter", sans-serif;
font-weight: 400;
font-size: 14px;
line-height: 18px;
color: #000;
border: none;
border-bottom: 2px solid #C8C8C8; 
}
#hours-fare table tr td:nth-child(2) {
text-align: right;
font-weight: 700;
padding-right: 32px;
}
#hours-fare table tr.mobile-remarks td {
padding: 18px 0 6px;
border-bottom: 0;
font-weight: 400;
text-align: center;
}
#guide {
position: relative;
padding: 100px 0;
margin: 0;
background: #DEF1FF;
}
ul.guide-lists {
position: relative;
list-style: none;
margin: 0;
padding: 0;
}
ul.guide-lists::before {
position: absolute;
top: 0;
left: 26px;
display: block;
content: '';
width: 1px;
height: 1460px;
background: #C8C8C8;
z-index: 1;
}
ul.guide-lists li {
position: relative;
display: flex;
column-gap: 20px;
padding: 0;
margin: 0 0 55px;
z-index: 2;
}
ul.guide-lists li:last-child {
margin: 0;
}
.guide-number {
flex-shrink: 0;
width: 53px;
height: 53px;
background: url(https://tahara-michinoeki.com/site/wp-content/themes/flatsome-child/ride-share/images/guide-num-bg.png) no-repeat;
background-size: contain;
background-position: center center;
font-family: "Noto Serif JP", serif;
font-weight: 700;
font-size: 16px;
line-height: 53px;
color: #fff;
margin: 0;
padding: 0;
text-align: center;
}
.guide-card {
width: 100%;
background: #fff;
border: 1px solid #C4C4C4;
border-radius: 10px;
padding: 20px;
}
.guide-card h3 {
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 20px;
line-height: 24px;
color: #000;
margin: 0 0 12px;
padding: 0;
}
.guide-card p {
font-family: "Inter", sans-serif;
font-weight: 400;
font-size: 20px;
line-height: 24px;
color: #000;
margin: 0 0 10px;
padding: 0;
}
.guide-card p span {
font-weight: 700;
}
.guide-card p:last-child {
margin: 0;
}
.guide-note {
font-family: "Inter", sans-serif;
font-weight: 400;
font-size: 14px;
line-height: 18px;
color: #000;
margin: 0 0 24px;
}
.guide-phone {
margin: 0 0 44px;
}
.guide-phone p {
width: max-content;
background: #E9BF00;
padding: 10px;
border-radius: 10px;
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 20px;
line-height: 24px;
color: #000;
margin: 0 0 10px;
}
.guide-phone span {
display: block;
font-family: "Inter", sans-serif;
font-weight: 400;
font-size: 16px;
line-height: 20px;
color: #000;
margin: 0;
}
.guide-phone span span {
display: inline;
font-size: 16px;
line-height: 20px;
margin: 0;
}
.guide-phone span span::before {
display: inline;
content: "／";
}
.guide-image {
display: flex;
justify-content: center;
column-gap: 32px;
margin: 12px 0 0;
}
.guide-image img {
display: block;
width: 248px;
margin: 0;
}
ul.guide-lists li:first-child .guide-image img {
width: 328px;
}
ul.guide-lists li:nth-child(3) .guide-image img {
width: 416px;
}
#contact {
position: relative;
padding: 100px 0;
margin: 0;
background: #FFF;
}
.contact-card {
padding: 26px;
background: #003454;
border-radius: 20px;
}
.contact-card h3 {
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 20px;
line-height: 24px;
color: #FFF;
padding: 0;
margin: 0 0 22px;
text-align: center;
}
.contact-card ul {
display: flex;
align-items: center;
justify-content: center;
list-style: none;
padding: 0;
margin: 0;
}
.contact-card ul li {
width: 262px;
padding: 28px 0;
margin: 0;
}
.contact-card ul li h4 {
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 24px;
line-height: 30px;
color: #FFF;
padding: 0;
margin: 0;
text-align: center;
}
.contact-card ul li p {
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 32px;
line-height: 40px;
color: #FFF;
padding: 0;
margin: 22px 0 0;
text-align: center;
}
.contact-card ul li a {
display: block;
width: max-content;
background: #E9BF00;
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 18px;
line-height: 22px;
color: #FFF;
padding: 16px 32px;
margin: 15px 0 0;
text-decoration: none;
border-radius: 54px;
}
.contact-card ul li a:hover {
opacity: 0.7;
}
.contact-separator {
width: 2px;
height: 146px;
margin: 0 66px;
background: #C8C8C8;
}
#faq {
position: relative;
padding: 100px 0;
margin: 0;
background: #DEF1FF;
}
ul.faq-lists {
list-style: none;
padding: 0;
margin: 0;
}
ul.faq-lists li {
background: #fff;
padding: 34px;
margin: 0 0 24px;
border: 1px solid #C4C4C4;
border-radius: 10px;
}
.faq-question {
position: relative;
padding-right: 35px;
cursor: pointer;
}
.faq-question::before {
display: block;
content: '';
position: absolute;
top: 9px;
right: 0;
width: 18px;
height: 2px;
border-radius: 2px;
background: #00A200;
transform: rotate(90deg);
}
ul.faq-lists li.faq-open .faq-question::before {
display: none;
}
.faq-question::after {
display: block;
content: '';
position: absolute;
top: 9px;
right: 0;
width: 18px;
height: 2px;
border-radius: 2px;
background: #00A200;
}
.faq-question p {
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 16px;
line-height: 1.4;
color: #000;
padding: 0;
margin: 0;
}
.faq-answer {
display: none;
margin: 30px 0 0;
}
ul.faq-lists li.faq-open .faq-answer {
display: block;
}
.faq-answer p {
font-family: "Inter", sans-serif;
font-weight: 400;
font-size: 16px;
line-height: 1.4;
color: #000;
padding: 0;
margin: 0;
}
.desktop-only {
display: block;
}
.mobile-only {
display: none;
}
@media (max-width: 1023px) and (min-width: 640px) {
#wrapper {
padding-top: 9.77vw;
}
.rideshare-container {
width: 80.47vw;
}
#header .rideshare-container {
width: 88.28vw;
}
#header {
height: 9.77vw;
border-bottom: 0.39vw solid #E9BF00;
}
.admin-bar #header {
top: 3.13vw;
}
.nav-inner {
height: 9.77vw;
}
a.navbar-brand {
font-size: 1.95vw;
line-height: 2.34vw;
}
.navbar-nav {
column-gap: 2.54vw;
}
.navbar-nav > li a {
font-size: 1.37vw;
line-height: 1.76vw;
}
#footer {
padding: 6.84vw 0;
}
.footer-logo {
margin: 0 0 6.84vw;
}
.footer-logo p {
font-size: 3.13vw;
line-height: 3.91vw;
margin: 0 0 1.46vw;
}
.footer-logo h1 {
font-size: 3.91vw;
line-height: 5.47vw;
}
.footer-contact {
margin: 0 0 1.76vw;
}
.footer-contact address {
font-size: 1.95vw;
line-height: 2.34vw;
margin: 0 0 1.76vw;
}
.footer-contact p {
font-size: 1.95vw;
line-height: 2.34vw;
}
#footer-copyright p {
font-size: 1.56vw;
line-height: 1.95vw;
}
p.pagetop {
right: 5.86vw;
bottom: 6.84vw;
width: 9.77vw;
}
#banner {
padding: 6.84vw 0;
}
.banner-title {
margin: 0 0 3.91vw;
}
.banner-title h1 {
font-size: 1.95vw;
line-height: 2.34vw;
}
.banner-title p {
font-size: 1.56vw;
line-height: 1.95vw;
padding: 0.98vw;
width: 22.66vw;
margin: 1.76vw auto 0;
border-radius: 3.91vw;
}
.banner-highlight {
margin: 0 0 3.91vw;
}
.banner-highlight h2 {
font-size: 4.10vw;
}
.banner-card {
margin: 0 auto 3.91vw;
border: 0.10vw solid #C8C8C8;
padding: 1.56vw 2.34vw;
border-radius: 0.98vw;
}
.banner-card p {
font-size: 1.37vw;
line-height: 1.95vw;
}
.banner-text p {
font-size: 1.56vw;
line-height: 1.95vw;
}
#news {
padding: 9.77vw 0 11.72vw;
}
.home-section-title {
margin: 0 0 3.91vw;
}
.home-section-title h2 {
font-size: 2.34vw;
line-height: 3.32vw;
}
.home-section-title p {
font-size: 1.37vw;
line-height: 1.76vw;
margin: 0 0 1.17vw;
}
ul.rideshare-news-list li {
padding: 1.46vw 0;
border-top: 0.10vw solid #C4C4C4;
}
ul.rideshare-news-list li:last-child {
border-bottom: 0.10vw solid #C4C4C4;
}
ul.rideshare-news-list li a {
column-gap: 1.95vw;
}
.news-list-date {
font-size: 1.37vw;
line-height: 1.76vw;
margin: 0 2.93vw 0 0;
}
.news-list-category {
font-size: 1.17vw;
line-height: 1.46vw;
padding: 0.39vw 0.59vw;
border-radius: 0.39vw;
}
h3.news-list-title {
font-size: 1.37vw;
line-height: 1.76vw;
}
#about {
padding: 9.77vw 0;
}
ul.about-lists {
margin: 0 0 7.81vw;
}
ul.about-lists li {
column-gap: 0.98vw;
padding: 1.95vw 2.34vw;
margin: 0 0 1.56vw;
border-radius: 0.98vw;
border: 0.10vw solid #C8C8C8;
font-size: 1.37vw;
}
ul.about-lists li::before {
width: 0.59vw;
height: 0.59vw;
border-radius: 0.59vw;
}
ul.about-lists span {
padding: 1.56vw 1.95vw;
border-left: 0.29vw solid #4E95FF;
font-size: 1.37vw;
}
.about-division h3 {
font-size: 1.37vw;
margin: 0 0 4.30vw;
}
.about-division ul {
padding: 2.93vw 7.81vw;
border-radius: 2.93vw;
border: 0.10vw solid #C8C8C8;
}
.about-division ul li {
width: 17.19vw;
}
.about-division ul li img {
width: 6.25vw;
margin: 0 auto 1.46vw;
}
.about-division ul li h4 {
font-size: 1.37vw;
line-height: 1.95vw;
height: 3.91vw;
margin: 0 0 1.46vw;
}
.about-division ul li p {
font-size: 1.37vw;
line-height: 1.95vw;
height: 5.86vw;
margin: 0 0 1.46vw;
}
.about-division ul li span {
font-size: 1.37vw;
}
.about-division-separator {
width: 4.69vw;
margin: 2.93vw auto;
}
.about-division-card {
padding: 4.39vw 11.72vw;
border-radius: 2.93vw;
border: 0.10vw solid #C8C8C8;
}
.about-division-card img {
width: 11.72vw;
}
.about-division-card-content {
width: 41.02vw;
}
.about-division-card-content h4 {
font-size: 2.34vw;
margin: 0 0 1.76vw;
}
.about-division-card-content p {
font-size: 1.95vw;
margin: 0 0 1.76vw;
}
.about-division-card-content p:nth-child(2) {
margin: 0 0 1.76vw;
}
.about-division-card-content span {
font-size: 1.95vw;
}
#service-area {
padding: 9.77vw 0;
}
.service-area-card {
padding: 2.93vw 2.64vw;
border: 0.10vw solid #C8C8C8;
border-radius: 1.95vw;
margin: 0 0 3.91vw;
}
.service-area-card h3 {
font-size: 1.37vw;
margin: 0 0 1.76vw;
}
.service-area-card p {
font-size: 1.37vw;
margin: 0 0 1.46vw;
}
.service-area-card img {
width: 40.53vw;
margin: 0 auto 1.95vw;
}
.service-area-card ul {
margin: 0 0 1.95vw;
}
.service-area-card ul li {
column-gap: 0.59vw;
margin: 0 0 0.98vw;
font-size: 1.37vw;
}
.service-area-card ul li::before {
width: 1.56vw;
height: 1.56vw;
border-radius: 1.56vw;
}
.service-area-card > span {
padding: 1.56vw 1.95vw;
margin: 0 0 1.95vw;
border-left: 0.29vw solid #4E95FF;
font-size: 1.37vw;
}
.service-area-option {
column-gap: 5.86vw;
}
.service-area-option-content {
width: 28.91vw;
}
.service-area-option-content h4 {
font-size: 1.37vw;
margin: 0 0 1.56vw;
}
.service-area-option-text {
column-gap: 1.95vw;
}
.service-area-option-text img {
width: 5.27vw;
}
.service-area-option-text table tr td {
font-size: 1.37vw;
padding: 0 0 0.88vw;
width: 9.57vw;
}
.service-area-option-text table tr td:nth-child(2) {
font-size: 1.37vw;
width: 2.54vw;
}
#hours-fare {
padding: 9.77vw 0;
}
ul.hours-fare-point {
column-gap: 1.17vw;
margin: 0 0 2.93vw;
}
ul.hours-fare-point li {
padding: 0.98vw 1.95vw;
border-radius: 3.42vw;
font-size: 1.17vw;
line-height: 1.46vw;
}
#hours-fare table {
border-radius: 0.98vw 0.98vw 0 0;
}
#hours-fare table tr th {
padding: 1.56vw 1.95vw;
font-size: 1.37vw;
line-height: 1.76vw;
}
#hours-fare table tr th:nth-child(2) {
padding-right: 3.13vw;
}
#hours-fare table tr td {
padding: 1.17vw 1.95vw;
font-size: 1.37vw;
line-height: 1.76vw;
border-bottom: 0.20vw solid #C8C8C8; 
}
#hours-fare table tr td:nth-child(2) {
padding-right: 3.13vw;
}
#hours-fare table tr.mobile-remarks td {
padding: 1.76vw 0 0.59vw;
}
#guide {
padding: 9.77vw 0;
}
ul.guide-lists::before {
left: 2.54vw;
width: 0.10vw;
height: 142.58vw;
}
ul.guide-lists li {
column-gap: 1.95vw;
margin: 0 0 5.37vw;
}
.guide-number {
width: 5.18vw;
height: 5.18vw;
font-size: 1.56vw;
line-height: 5.18vw;
}
.guide-card {
border: 0.10vw solid #C4C4C4;
border-radius: 0.98vw;
padding: 1.95vw;
}
.guide-card h3 {
font-size: 1.95vw;
line-height: 2.34vw;
margin: 0 0 1.17vw;
}
.guide-card p {
font-size: 1.95vw;
line-height: 2.34vw;
margin: 0 0 0.98vw;
}
.guide-note {
font-size: 1.37vw;
line-height: 1.76vw;
margin: 0 0 2.34vw;
}
.guide-phone {
margin: 0 0 4.30vw;
}
.guide-phone p {
padding: 0.98vw;
border-radius: 0.98vw;
font-size: 1.95vw;
line-height: 2.34vw;
margin: 0 0 0.98vw;
}
.guide-phone span {
font-size: 1.56vw;
line-height: 1.95vw;
}
.guide-phone span span {
font-size: 1.56vw;
line-height: 1.95vw;
}
.guide-image {
column-gap: 3.13vw;
margin: 1.17vw 0 0;
}
.guide-image img {
width: 24.22vw;
}
ul.guide-lists li:first-child .guide-image img {
width: 32.03vw;
}
ul.guide-lists li:nth-child(3) .guide-image img {
width: 40.63vw;
}
#contact {
padding: 9.77vw 0;
}
.contact-card {
padding: 2.54vw;
border-radius: 1.95vw;
}
.contact-card h3 {
font-size: 1.95vw;
line-height: 2.34vw;
margin: 0 0 2.15vw;
}
.contact-card ul li {
width: 25.59vw;
padding: 2.73vw 0;
}
.contact-card ul li h4 {
font-size: 2.34vw;
line-height: 2.93vw;
}
.contact-card ul li p {
font-size: 3.13vw;
line-height: 3.91vw;
margin: 2.15vw 0 0;
}
.contact-card ul li a {
font-size: 1.76vw;
line-height: 2.15vw;
padding: 1.56vw 3.13vw;
margin: 1.46vw 0 0;
border-radius: 5.27vw;
}
.contact-separator {
width: 0.20vw;
height: 14.26vw;
margin: 0 6.45vw;
}
#faq {
padding: 9.77vw 0;
}
ul.faq-lists li {
padding: 3.32vw;
margin: 0 0 2.34vw;
border: 0.10vw solid #C4C4C4;
border-radius: 0.98vw;
}
.faq-question {
padding-right: 3.42vw;
}
.faq-question::before {
top: 0.88vw;
width: 1.76vw;
height: 0.20vw;
border-radius: 0.20vw;
}
.faq-question::after {
top: 0.88vw;
width: 1.76vw;
height: 0.20vw;
border-radius: 0.20vw;
}
.faq-question p {
font-size: 1.56vw;
}
.faq-answer {
margin: 2.93vw 0 0;
}
.faq-answer p {
font-size: 1.56vw;
}
}
@media (max-width: 639px) {
body {
width: 100%;
}
#wrapper {
padding-top: 16vw;
}
.rideshare-container {
width: 84vw;
}
#header .rideshare-container {
width: 84vw;
}
#header {
height: 16vw;
border-bottom: 0.53vw solid #E9BF00;
width: 100vw;
}
.nav-inner {
height: 16vw;
}
a.navbar-brand {
font-size: 4.27vw;
line-height: 5.33vw;
}
.collapse:not(.show) {
display: none;
}
.navbar-collapse {
display: block;
width: 100vw;
height: calc(100vh - 16vw);
background: #00232E;
margin: 0 -8vw;
padding: 5.6vw 8vw 8vw;
position: absolute;
top: 15.2vw;
overflow-y: scroll;
}
.navbar-nav {
display: block;
}
.navbar-nav > li {
margin: 0 0 8vw;
}
.navbar-nav > li a {
font-size: 4.8vw;
line-height: 5.87vw;
}
.nav-contact-mobile ul {
display: block;
list-style: none;
padding: 0;
margin: 15.2vw 0 0;
}
.nav-contact-mobile ul li {
padding: 0;
margin: 0;
}
.nav-contact-mobile ul li h4 {
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 6.4vw;
line-height: 8vw;
color: #FFF;
padding: 0;
margin: 0;
text-align: center;
}
.nav-contact-mobile ul li p {
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 8.53vw;
line-height: 10.67vw;
color: #FFF;
padding: 0;
margin: 4vw 0 0;
text-align: center;
}
.nav-contact-mobile ul li a {
display: block;
width: max-content;
background: #E9BF00;
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 4.8vw;
line-height: 5.87vw;
color: #FFF;
padding: 4.27vw 8.53vw;
margin: 4vw auto 0;
text-decoration: none;
border-radius: 14.4vw;
}
.nav-contact-mobile ul li a:hover {
opacity: 0.7;
}
.nav-contact-separator {
width: 39.2vw;
height: 0.53vw;
margin: 4vw auto;
background: #C8C8C8;
}
.mobile-menu-btn {
display: block;
position: absolute;
right: 0;
padding: 0;
margin: 0;
}
.mobile-menu-btn:focus {
text-decoration: none;
outline: none;
-webkit-box-shadow: none;
box-shadow: none;
}
.mobile-menu-btn .toggler-icon {
width: 6.4vw;
height: 0.8vw;
border-radius: 0.8vw;
background-color: #fff;
display: block;
margin: 1.6vw 0;
position: relative;
-webkit-transition: all 0.3s ease-out 0s;
transition: all 0.3s ease-out 0s;
}
.mobile-menu-btn .toggler-icon:nth-of-type(1), .mobile-menu-btn .toggler-icon:nth-of-type(3) {
margin: 0;
}
.mobile-menu-btn.active .toggler-icon:nth-of-type(1) {
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
top: 2.4vw;
}
.mobile-menu-btn.active .toggler-icon:nth-of-type(2) {
opacity: 0;
}
.mobile-menu-btn.active .toggler-icon:nth-of-type(3) {
-webkit-transform: rotate(135deg);
transform: rotate(135deg);
top: -2.4vw;
}
#footer {
padding: 34.4vw 0 40vw;
}
.footer-logo {
margin: 0 0 13.6vw;
}
.footer-logo p {
font-size: 5.33vw;
line-height: 6.4vw;
margin: 0 0 3.2vw;
}
.footer-logo h1 {
font-size: 7.47vw;
line-height: 10.67vw;
}
.footer-contact {
margin: 0 0 3.2vw;
}
.footer-contact address {
font-size: 3.73vw;
line-height: 4.8vw;
margin: 0 0 3.2vw;
}
.footer-contact p {
font-size: 3.73vw;
line-height: 4.8vw;
}
#footer-copyright p {
font-size: 2.67vw;
line-height: 3.2vw;
}
p.pagetop {
right: 8vw;
bottom: 11.2vw;
width: 17.07vw;
}
#banner {
padding: 18.4vw 0;
}
.banner-title {
margin: 0 0 8vw;
}
.banner-title h1 {
font-size: 3.73vw;
line-height: 4.8vw;
}
.banner-title p {
font-size: 3.2vw;
line-height: 4vw;
padding: 2.67vw;
width: 49.07vw;
margin: 3.73vw auto 0;
border-radius: 9.33vw;
}
.banner-highlight {
margin: 0 0 8vw;
}
.banner-highlight h2 {
font-size: 6.4vw;
line-height: 1.4;
}
.banner-card {
width: 100%;
margin: 0 0 5.33vw;
border: 0.27vw solid #C8C8C8;
padding: 2.67vw;
border-radius: 2.67vw;
}
.banner-card p {
font-size: 3.2vw;
line-height: 1.4;
}
.banner-card p span {
display: block;
}
.banner-text p {
font-size: 3.2vw;
line-height: 1.4;
}
#news {
padding: 16vw 0 21.6vw;
}
.home-section-title {
margin: 0 0 8vw;
}
.home-section-title h2 {
font-size: 4.8vw;
line-height: 6.93vw;
}
.home-section-title p {
font-size: 3.73vw;
line-height: 4.8vw;
margin: 0 0 2.13vw;
}
ul.rideshare-news-list li {
padding: 4vw 0;
border-top: 0.27vw solid #C4C4C4;
}
ul.rideshare-news-list li:last-child {
border-bottom: 0.27vw solid #C4C4C4;
}
ul.rideshare-news-list li a {
column-gap: 2.4vw;
row-gap: 3.2vw;
flex-wrap: wrap;
}
.news-list-date {
font-size: 3.2vw;
line-height: 4vw;
margin: 0;
}
.news-list-category {
font-size: 3.2vw;
line-height: 4vw;
padding: 1.07vw 1.6vw;
border-radius: 1.07vw;
}
h3.news-list-title {
width: 100%;
font-size: 3.2vw;
line-height: 4.8vw;
}
#about {
padding: 16vw 0;
}
ul.about-lists {
margin: 0 0 13.6vw;
}
ul.about-lists li {
column-gap: 2.4vw;
padding: 3.2vw 4vw;
margin: 0 0 4vw;
border-radius: 2.67vw;
border: 0.27vw solid #C8C8C8;
font-size: 3.2vw;
line-height: 1.4;
}
ul.about-lists li::before {
width: 1.6vw;
height: 1.6vw;
border-radius: 1.6vw;
}
ul.about-lists span {
padding: 3.2vw;
border-left: 0.8vw solid #4E95FF;
font-size: 3.2vw;
line-height: 1.4;
}
.about-division h3 {
font-size: 3.73vw;
margin: 0 0 5.6vw;
}
.about-division ul {
display: block;
list-style: none;
padding: 16vw;
border-radius: 8vw;
border: 0.27vw solid #C8C8C8;
}
.about-division ul li {
width: 100%;
margin: 0 0 21.6vw;
}
.about-division ul li:last-child {
margin: 0;
}
.about-division ul li img {
width: 32vw;
margin: 0 auto 4vw;
}
.about-division ul li h4 {
font-size: 5.33vw;
line-height: 1.4;
height: auto;
margin: 0 0 4vw;
}
.about-division ul li p {
font-size: 4.27vw;
line-height: 1.4;
height: auto;
margin: 0 0 4vw;
}
.about-division ul li span {
font-size: 4.27vw;
}
.about-division-separator {
width: 12.8vw;
margin: 8vw auto;
}
.about-division-card {
display: block;
padding: 16vw 12vw;
border-radius: 8vw;
border: 0.27vw solid #C8C8C8;
}
.about-division-card img {
width: 32vw;
margin: 0 auto 4vw;
}
.about-division-card-content {
width: 100%;
}
.about-division-card-content h4 {
font-size: 5.33vw;
line-height: 1.4;
margin: 0 0 4vw;
text-align: center;
}
.about-division-card-content p {
font-size: 4.27vw;
line-height: 1.4;
margin: 0 0 4vw;
text-align: center;
}
.about-division-card-content p:nth-child(2) {
margin: 0;
}
.about-division-card-content span {
font-size: 4.27vw;
line-height: 1.4;
text-align: center;
}
#service-area {
padding: 16vw 0;
}
.service-area-card {
padding: 7.2vw 4.8vw;
border: 0.27vw solid #C8C8C8;
border-radius: 5.33vw;
margin: 0 0 10.67vw;
}
.service-area-card h3 {
font-size: 3.73vw;
margin: 0 0 5.33vw;
}
.service-area-card p {
font-size: 3.73vw;
line-height: 1.4;
margin: 0 0 5.33vw;
}
.service-area-card img {
width: 100%;
margin: 0 0 10.67vw;
}
.service-area-card ul {
margin: 0 0 7.2vw;
}
.service-area-card ul li {
column-gap: 1.6vw;
margin: 0 0 2.67vw;
font-size: 3.2vw;
line-height: 1.4;
}
.service-area-card ul li::before {
width: 4.27vw;
height: 4.27vw;
border-radius: 4.27vw;
}
.service-area-card > span {
padding: 3.2vw;
margin: 0 0 10.67vw;
border-left: 0.8vw solid #4E95FF;
font-size: 3.2vw;
line-height: 1.4;
}
.service-area-option {
display: block;
}
.service-area-option-content {
width: 100%;
margin: 0 0 7.2vw;
}
.service-area-option-content:last-child {
margin: 0;
}
.service-area-option-content h4 {
font-size: 3.73vw;
margin: 0 0 4vw;
}
.service-area-option-text {
column-gap: 5.33vw;
}
.service-area-option-text img {
width: 14.4vw;
}
.service-area-option-text table tr td {
font-size: 3.2vw;
line-height: 3.73vw;
padding: 0 0 2.4vw;
width: 22.4vw;
}
.service-area-option-text table tr td:nth-child(2) {
font-size: 3.73vw;
width: 6.93vw;
}
#hours-fare {
padding: 16vw 0;
}
ul.hours-fare-point {
display: block;
margin: 0 0 12vw;
}
ul.hours-fare-point li {
padding: 2.67vw 5.33vw;
margin: 0 0 3.2vw;
border-radius: 9.33vw;
font-size: 3.2vw;
line-height: 4vw;
}
ul.hours-fare-point li:last-child {
margin: 0;
}
table.hours-fare-table-desktop {
display: none;
}
table.hours-fare-table-mobile {
display: table;
}
#hours-fare table {
border-radius: 2.67vw 2.67vw 0 0;
}
#hours-fare table tr th {
padding: 4.27vw 5.33vw;
font-size: 3.73vw;
line-height: 4.8vw;
}
#hours-fare table tr th:last-child {
padding-right: 8.53vw;
}
#hours-fare table tr td {
padding: 3.2vw 5.33vw;
font-size: 3.73vw;
line-height: 4.8vw;
border-bottom: 0.53vw solid #C8C8C8; 
}
#hours-fare table tr td:last-child {
padding-right: 8.53vw;
}
#hours-fare table tr.mobile-remarks td {
padding: 4.8vw 0 1.6vw;
border-bottom: 0;
font-weight: 400;
text-align: center;
}
#guide {
padding: 16vw 0;
}
ul.guide-lists::before {
left: 4vw;
width: 0.53vw;
height: 410.67vw;
}
ul.guide-lists li {
column-gap: 2.67vw;
margin: 0 0 6.4vw;
}
.guide-number {
width: 8.53vw;
height: 8.53vw;
font-size: 3.2vw;
line-height: 8.53vw;
}
.guide-card {
border: 0.27vw solid #C4C4C4;
border-radius: 2.67vw;
padding: 6.4vw 3.2vw;
}
.guide-card h3 {
font-size: 4.27vw;
line-height: 5.33vw;
margin: 0 0 5.33vw;
}
.guide-card p {
font-size: 3.73vw;
line-height: 1.4;
margin: 0 0 1.6vw;
letter-spacing: -0.08vw;
}
.guide-note {
font-size: 3.2vw;
line-height: 1.4;
margin: 0 0 5.33vw;
}
.guide-phone {
margin: 0 0 5.33vw;
}
.guide-phone p {
padding: 2.67vw;
border-radius: 2.67vw;
font-size: 5.33vw;
line-height: 1.4;
margin: 0 auto 6.4vw;
}
.guide-phone span {
font-size: 3.2vw;
line-height: 4vw;
}
.guide-phone span span {
display: block;
font-size: 2.67vw;
line-height: 3.2vw;
margin: 1.33vw 0 0;
}
.guide-phone span span::before {
display: none;
}
.guide-image {
display: block;
margin: 3.73vw 0 0;
}
.guide-image img {
width: 100%;
margin: 0 0 8vw;
}
.guide-image img:last-child {
margin: 0;
}
ul.guide-lists li:first-child .guide-image img {
width: 100%;
}
ul.guide-lists li:nth-child(3) .guide-image img {
width: 100%;
}
#contact {
padding: 16vw 0;
}
.contact-card {
padding: 11.2vw 4.8vw;
border-radius: 5.33vw;
}
.contact-card h3 {
font-size: 5.33vw;
line-height: 1.4;
margin: 0 0 9.6vw;
text-align: left;
}
.contact-card ul {
display: block;
}
.contact-card ul li {
width: 100%;
padding: 0;
}
.contact-card ul li h4 {
font-size: 6.4vw;
line-height: 8vw;
}
.contact-card ul li p {
font-size: 8.53vw;
line-height: 10.67vw;
margin: 4vw 0 0;
}
.contact-card ul li a {
font-size: 4.8vw;
line-height: 5.87vw;
padding: 4.27vw 8.53vw;
margin: 4vw auto 0;
border-radius: 14.4vw;
}
.contact-separator {
width: 39.2vw;
height: 0.53vw;
margin: 8vw auto;
}
#faq {
padding: 16vw 0;
}
ul.faq-lists li {
padding: 6.4vw 4.8vw;
margin: 0 0 6.4vw;
border: 0.27vw solid #C4C4C4;
border-radius: 2.67vw;
}
.faq-question {
padding-right: 9.33vw;
}
.faq-question::before {
top: 2.4vw;
right: 0;
width: 4.8vw;
height: 0.53vw;
border-radius: 0.53vw;
}
.faq-question::after {
top: 2.4vw;
right: 0;
width: 4.8vw;
height: 0.53vw;
border-radius: 0.53vw;
}
.faq-question p {
font-size: 3.73vw;
line-height: 1.4;
}
.faq-answer {
margin: 8.8vw 0 0;
}
.faq-answer p {
font-size: 3.73vw;
line-height: 1.4;
}
.desktop-only {
display: none;
}
.mobile-only {
display: block;
}
}