@charset "UTF-8";
/*--------------------------------
初期設定
---------------------------------*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@100;300;400;500;700;900&display=swap');

html {font-size: 62.5%;} /* 1.6rem=16px */
body {width: 100%; color: #000; font-family: 'Noto Sans JP', sans-serif,"Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;line-height: 1; word-break: break-all; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt";  min-width: 320px; padding: 0px;font-weight: 400;position: relative;overflow: hidden}

a:hover img {}
img {max-width: 100%;height: auto;}
p, ul li, ol li, dl dt, dl dd,figure{margin:0; padding:0; font-size:1.6rem}
ul,h1,h2,h3,h4,h5,h6{ margin:0; padding:0}
ul li{ margin:0; padding:0; list-style-type:none}

.pb40{ padding-bottom:40px;}
.mb60{ margin-bottom:60px!important;}
.mb40{ margin-bottom:40px!important;}
.mb10{ margin-bottom:10px!important;}
.mb15{ margin-bottom:15px!important;}
.pb20{ padding-bottom:20px;}
.pb80{ padding-bottom:80px;}
.attention,.rd{ color:#C00}
.ib{ display:inline-block}
.f-l{ float:left}
.f-r{ float: right}
.clear{ clear:both}
.w100{ width:100%}
caption{ font-size:1.6rem; padding-bottom:10px; text-align:left}
.min,
.point-section ol li h3,
.sys section h1{  font-family: 'Noto Serif JP', "Times New Roman", Times, serif, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; transform: rotate(.03deg);}
html{overflow-y:scroll;}
.bk{ color:#000!important}
.right{ text-align:right}
.bold{ font-weight:bold}
.clearfix::after,.imgLeft,.imgRight,.pager{ content: ""; display: block; clear: both;}


.pc-mode{display: none}
figcaption{margin-top:10px 
}

/*--------------------------------
share
---------------------------------*/
img[src$=".svg"] {width: 100%; height: auto;}
a:hover{ text-decoration:none;}
.center{ text-align:center}
.ggmap-wrap{max-width: 960px;margin: 0 auto;padding: 2px; border:1px solid #999}
.ggmap {position: relative; padding-bottom: 30.25%; padding-top: 30px; height: 0; overflow: hidden;}
.ggmap iframe,
.ggmap object,
.ggmap embed {position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.main section, ul li {line-height:1.8}
/* page-top */
#pagetop {position: fixed; bottom: 0px; right: 0px; margin:0;}
#pagetop a {width: 70px; height:70px;}
#pagetop a img{width: 70px;height:70px;vertical-align: bottom;}
#pagetop a:hover {}
/* パンくず */
.BreadcrumbList{  padding:0 0 10px 10px; box-sizing:border-box;  margin:80px 0 0;}
.BreadcrumbList li{ display:inline; font-size:1.2rem; line-height:1.4;font-weight: bold; color: #1a1e31}
.BreadcrumbList li:after { content: ">"; padding: 0 5px;    color: #999;}
.BreadcrumbList li:last-child:after { content: "";}
.BreadcrumbList li a{text-decoration:none;font-weight:normal; color: #666}
.BreadcrumbList li a:hover{ text-decoration:underline}

/* ページャー */


.pager .pagination {margin: 0;padding: 60px 0 0; 
  text-align: center;
}

.pager .pagination li {
  display: inline;
  margin: 0 2px;
  padding: 0;
  display: inline-block;
  width: 30px;
  height: 30px;
  text-align: center;
  position: relative;
  border-radius: 10px;
}


.pager .pagination li a{
  vertical-align: middle;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  display:table;
  text-decoration: none;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all  0.3s ease;
	color: #333
}

.pager .pagination li a span{
  display:table-cell;
  vertical-align:middle;
}

.pager .pagination li a:hover,
.pager .pagination li a.active{
  color: #fff;
  background: #333;
}



.js-fade {
    opacity: 0;
    visibility: hidden;
    transform: translateY(50px);
    transition: opacity 1s,visibility 1s, transform 1s;
}

.scroll {
    opacity: 1;
    visibility: visible;
    transform: translateY(0px);
}


/* btn */

a.anchor {
    display: block;
    padding-top: 100px;
    margin-top: -100px;
}


main{clear: both; padding: 20px;}
section{clear: both; padding:0 15px;}
section p{font-size: 1.6rem;line-height: 2;font-weight: 400;}
.sub-section{padding: 0}
footer{box-sizing: border-box;padding:15px 0; text-align: center;font-size: 1.2rem}


/* header */

header {width: 100%;box-sizing: border-box}
header a{color: #000;text-decoration: none}
.logo{font-weight: bold}
.title-wrap{padding: 50px 0; color: #fff;background: url("../img/bg_sub.png") center center no-repeat;background-size: cover;font-size: 2rem;text-align: center}
.header-wrap h1 img,
.logo img{margin-right: 5px;width: 30px ;height: 30px; vertical-align: text-top;}
header h1,
.logo{font-size: 1.6rem}
header h1 a,
.logo a{display: inline-block;padding: 15px 0 15px 10px}
.recruit a span{ background: linear-gradient(43deg, #0caadf 0%,#1dc971 100%);
  -webkit-background-clip: text;
  color: transparent;}
.recruit{background: #333}
.apply a span{ background: linear-gradient(43deg, #e2017d 0%,#fec820 100%);
  -webkit-background-clip: text;
  color: transparent;}
.apply{background: #333}
/*------ スライダーの横幅 ------*/
.slider{
  width:100%;
  margin:0 auto;
}

/*------ スライダー画像 ------*/
.slider img{
	width:100%;
}

.slider .slick-slide{
	height:auto!important;
	opacity: .4
}
.slider .slick-current{opacity: 1}


/* テキスト部分 */
.text-gradation {
}
.main-img {
            width: 100%;
            overflow: hidden; /* 画像がはみ出した場合のスクロールバーを防止 */
        }

.main-img img{
            width: 100%;
            height: auto; /* アスペクト比を維持 */
            display: block; /* 下部の余白を除去 */
        }
.title02 span{display: block}
.title02{}

.gtranslate{position: absolute;right: 80px;top:7px}
.recruit a,
.apply a{font-weight: bold!important}

.overlay-recruitment {
  position: absolute; 
  text-align: right;
  width: 100%; 
z-index: 10;      
}

.overlay-recruitment img {
    width: 28%;
    height: auto;
    margin-top: -35%;
    margin-right: 10px;
}
.bg01{padding-bottom: 100px; background: #f6f6f6 url("../img/bg01_sp.png")center bottom no-repeat}

.bg02{padding-top: 40px}
.bg03{padding-top: 40px;padding-bottom: 40px; background: #f6f6f6}
.order-section{padding-top: 40px;}
.recruit-section{padding-top: 40px;padding-bottom: 40px}
.company-section{padding-top: 40px;padding-bottom: 100px; background: #f6f6f6}
.title02{ margin-bottom:30px; text-align: center;font-size: 2.2rem;line-height: 1.6}
.title02 div{display: inline-block;padding:0 10px 10px;
  border-bottom: 5px solid;
  border-image-source: linear-gradient(
    to right, 
    #029ddd,
    #1849a3, 
    #401c86,
    #9c0e82,
    #e2017a,
    #e51936,
    #eb4d1f,
	  #f68c20,
	  #fec220,
	  #91b233,
	  #04974a
  );
  border-image-slice: 1; /* グラデーション全体を線に適用 */ }
.title02 span{display: block;padding: 25px 0 30px; background: url("../img/titlebg.png") center center no-repeat;background-size: 50px auto;font-size: 1.2rem;font-family: Oswald;font-weight: normal}
.text01{font-size: 1.4rem}
.text02{font-size: 1.1rem}
.obArea-wrap{display: flex; position: relative;background: #0885cd;}
.obArea-wrap-img{position: absolute;bottom: 0;width: 37%; vertical-align: bottom}
.obArea-wrap-img img{vertical-align: bottom}
.obArea-wrap h3{padding: 10px 10px 10px 0 ; color: #fff;line-height: 1.4;text-align: left}
.obArea-wrap h3 strong{display:block}
.obArea-wrap p{padding:0 10px 10px 0; line-height: 1.4; color: #9ddbff;text-align: left}
.obArea-wrap ul{display: flex}
.obArea-wrap ul img{}
.obArea-wrap ul li{padding: 0 5px}
.obArea > li{margin-bottom: 30px; }
.obArea-wrap-contets{width: 60%;margin-left: 40%}
.obArea{max-width: 380px; margin: 0 auto; padding: 40px 0px 20px;}
.obimg_right .obArea-wrap-img{width: 43%;right: 0}
.obimg_right .obArea-wrap-contets{margin-left: auto;margin-right: 44%;padding-left: 10px;box-sizing: border-box; text-align: left;}
.call_taxi {
  display: inline-block;
  margin-bottom: 10px;
  /* paddingの全角スペースを除去 */
  padding: 5px 10px 5px 34px;
  /* backgroundを整理（sizeは別行のままでもOKですが、値を整理しました） */
  background-color: #000;
  background-image: url("../img/call.png");
  background-repeat: no-repeat;
  background-position: left 10px center; /* 左から10px、上下中央 */
  background-size: 26px auto;
  border-radius: 10px;
  font-weight: bold;
  font-size: 1.8rem; /* セミコロンを追加 */
}
.call_taxi a{text-decoration: none;color: #fff}

.obimg_right p {
  padding-right: 0;
}

  .taxi_fares{
           
            max-width: 630px;
            margin: 20px auto;
            color: #333;
        }

        .route-item {
            display: flex;
            align-items: center;
            padding: 15px 5px;
            background-color: #f0eaf1; /* 薄いパープルの背景 */
            margin-bottom: 1px;
            border-bottom: 1px dotted #999; /* 点線の区切り */
			font-size: 1.2rem
        }

        /* 偶数行の背景を少し変えるか、すべて同じにするかはお好みで */
        .route-item:nth-child(even) {
            background-color: #ffffff;
        }

        .station-group {
            display: flex;
            align-items: center;
            width: 40%;
            color: #800080; /* 紫色 */
        }

        .arrow {
            margin: 0 15px;
            font-size: 1.2rem;
        }

        .info-group {
            display: flex;
            width: 60%;
            justify-content: space-between;
        }

        .info-item {
            display: flex;
            align-items: center;
        }

        /* アイコンの代わり */
        .icon {
            display: inline-flex;
            justify-content: center;
            align-items: center;
            width: 24px;
            height: 24px;
            border: 2px solid #800080;
            border-radius: 50%;
            margin-right: 8px;
            color: #800080;
            font-weight: bold;
        }

        .time-icon::before { content: "";display: inline-block;width: 20px;height: 20px;margin-right: 3px; background: url("../img/time_icon.png") left top no-repeat;background-size: 20px 20px;}
        .price-icon::before { content: "";display: inline-block;width: 20px;height: 20px;margin-right: 3px;background: url("../img/en_icon.png") left top no-repeat;background-size: 20px 20px; }
.payment-wrap{max-width: 630px;margin: 0 auto;
}
.payment-info {margin-top: 20px; font-size: 1.2rem;
            line-height: 1.8;}

        .row {
            margin-bottom: 10px;
        }

        .payment-label {
            color: #8a207d;
            font-weight: bold;
            white-space: nowrap;
            margin-right: 8px;
        }

        .payment-content {display: block; letter-spacing: 0.02em; }
.ourfleet h3{font-size:2.4rem}
.ourfleet ul{text-align: center}
.ourfleet ul li{margin-bottom: 30px}
.ourfleet ul li p{ font-size: 1.2rem}
.btn001{text-align: center}
.btn001 a {
  display: inline-block;
  /* 右側にアイコン分の余白を確保 */
  padding: 15px 60px 15px 30px; 
  background-color: #000;
  /* 修正：位置指定を整理。'right 10px center' で右端から10pxの位置に固定 */
  background-image: url("../img/ar.png");
  background-repeat: no-repeat;
  background-position: right 20px center;
  background-size: 20px auto;
  color: #fff;
  text-decoration: none;
  font-size: 1.6rem;
  /* 念のため、はみ出し防止 */
  box-sizing: border-box;
}
.recruit-section h3{font-size: 1.8rem;text-align: center;margin:30px 0;line-height: 1.6}

.recruit-section .text01,
.recruit-section .btn001{margin-bottom: 40px}
.footer-u-nav{display: flex}
.footer-u-nav li{width: 50%;padding: 10px 10px 30px;box-sizing: border-box; text-align: center;color: #fff;}
.footer-u-nav li a{color: #fff;text-decoration: none}
.footer-u-nav li:first-child{background:#3e3e3e }
.footer-u-nav li:last-child{background:#6b6b6b}
.footer-u-nav li:last-child a{}
.f-u-title{padding: 30px 0 10px; font-size: 2.2rem;font-weight: bold}
.icon-area{text-align: center;}
.footer-u-nav li:first-child .icon-area img{width: 100%; max-width: 440px}
.footer-u-nav li:last-child .icon-area img{width: 100%; max-width: 100px}


.footer-nav{margin: 40px 0; text-align: center; }
.footer-nav li{position: relative;display: inline-block;content: "｜";}
.footer-nav li:after{position:absolute;right: -10px; content: "｜";}
.footer-nav li:last-child:after{position:absolute;right: -10px; content:none;}
.footer-nav li a{padding:5px 10px; color: #000;text-decoration: none}
.footer-add{margin-bottom: 40px; text-align: center}
.footer-add dt{padding-bottom: 20px;font-size: 2.4rem; font-weight: bold}
.footer-add dd{line-height: 1.6}






@media screen and (max-width: 767px){
	.title02 span{display: inline-block;
    padding: 15px 0 20px;
        margin-right: 10px;
        vertical-align: super;}
	.title02 div{
        line-height: 1;
        padding-bottom: 10px;}
	.order-section{padding-top: 20px}
	.title-wrap{margin-bottom: 20px;}
}

@media screen and (min-width: 768px){
	.route-item {font-size: 1.4rem }

}

@media screen and (max-width: 960px){
	.gtranslate{position: absolute;right: 70px;top:7px}
	.payment-wrap02{display: flex; align-items: flex-end;}
	.payment-info{width: 60%;padding-bottom: 20px}
	.payment-img{width: 40%}
}


@media screen and (min-width: 961px){
  a[href^="tel:"]{
    pointer-events: none;
  }

	a:hover{opacity: 0.5;transition: opacity 0.3s ease;}
	.overlay-recruitment a:hover{opacity: .8;}

	header{display: flex;align-items:center;justify-content: space-between;height: 80px;}
	header h1 a, .logo a{}
	.gtranslate{left: 230px;right: auto}
	.recruit,
	.apply{border-radius: 5px;	}
	.recruit{margin-right:5px}
	.gtranslate{top: 15px;}
	.title02{margin-bottom: 60px; font-size: 3.6rem}
	.title02 span{margin:60px 0 20px; font-size: 1.8rem;  background-size: 70px auto;	}
	.text01{font-size: 1.6rem}
.overlay-recruitment img {width: 20%;margin-top: -28%;}
	.obArea{display: flex;justify-content: space-around;width: 100%;max-width: 960px;margin: 0 auto; padding: 60px 0px 20px;}
	.obArea > li{width: 450px; }
.obArea-wrap h3{font-size: 2.4rem}
	.call_taxi{padding: 5px 20px 5px 44px;font-size: 2.2rem}
	.obimg_right .obArea-wrap-contets{padding-left: 30px}
	.obArea-wrap p{font-size: 1.2rem}
	.obArea-wrap-contets{min-height: 200px;}
	.bg01{padding-bottom: 20px; background: #f6f6f6 url("../img/bg01.png")center top no-repeat}
     .route-item {padding: 20px;font-size: 1.6rem}
	.taxi_fares{margin: 40px auto;	}
	.row {margin-bottom: 10px;display: flex;align-items: flex-start;}
	.payment-wrap{max-width: 840px;padding-bottom: 50px}
	.payment-info{font-size: 1.6rem;padding-right: 0}
	.payment-wrap02{position: relative}
.payment-img{position: absolute;right: -200px;bottom: -61px;width: 340px;height: auto}
.bg02{background: #fff url("../img/bg04.jpg") no-repeat center -220px;}
	.ourfleet ul{display: flex; justify-content: space-around;max-width:1080px;margin:60px auto}
.f-u-title{font-size: 2.6rem;}
.footer-nav{padding: 40px 0;}
	.title-wrap{padding: 80px 0}
	
}


@media screen and (min-width: 1024px) {
}

	@media screen and (min-width: 1200px){
		
}

@media screen and (min-width: 1260px){
}
