@charset "UTF-8";

@import url(./common.css);
@import url(../manage/common/font-awesome.min.css);

/* resetcss */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,select,p,blockquote,th,td,figure{ margin:0;padding:0;}table {border-collapse:collapse;border-spacing:0;}fieldset,img { border:0;vertical-align:bottom;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}ol,ul{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after {content:'';}abbr,acronym { border:0;}a{outline:none;}
/* clearfix */.clearfix{zoom:1;}.clearfix:after{content:""; display: block; clear: both; height: 0; visibility:hidden;}.clear {clear:both; line-height:0;}
body *{-webkit-box-sizing: border-box;box-sizing: border-box;}

/*==================== 基本設定 ====================*/
body {font-family: -apple-system, BlinkMacSystemFont, "HiraKakuProN W3", "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN,Arial,Roboto,"Droid Sans","Helvetica Neue", "游ゴシック", YuGothic, Arial, "メイリオ", Meiryo, sans-serif;
font-size: 16px;line-height: 1.5;letter-spacing: 0.5px;color: #272a38;}
/**
明朝の場合はこっち font-family:'fgutsukushiweb','Garamond','Times New Roman','ヒラギノ明朝 Pro W3','Hiragino Mincho Pro','HiraMinProN-W3','游明朝','Yu Mincho','游明朝体','YuMincho','HGS明朝E','HG明朝E','ＭＳ Ｐ明朝','MS PMincho',serif;
 **/
table{font-size:1em;width: 100%;}
a{text-decoration: none;color: #272a38;transition: all 0.3s linear;}
img{width: 100%;max-width: 100%;}

.none{display: none;}

/********** container **********/
.l_container{}
.l_gride{width:950px;margin:0 auto;}

/********** ヘッダー **********/
.l_header{}
.l_header .cont{width:1000px;margin-right:auto;margin-left:auto;}
.l_header h1{}
.l_header h1 a,.l_header h1 span{display:block;}
.l_help_navi{}
.l_help_navi ul{}
.l_help_navi li{}

.l_main_navi{}
.l_main_navi ul{}
.l_main_navi li{}

.l_header_image{}

/********** コンテンツ *********/
.l_contents{margin-right:auto;margin-left:auto;}

.l_breadcrumb ul{text-align:left;display: flex;}
.l_breadcrumb li{display:inline-block;}

.l_column_sub{width:180px;}
.l_column_main{width:780px;}

.Wrapper{margin: 0 auto;}

.SecondTitle{width: 100%;background: #212b6a;}
.SecondTitle .Wrapper{width: 100%;height: 100%;display: flex;justify-content: center;align-items: center;}
.SecondTitle .Wrapper h1{color: #fff;}

h2{font-weight: bold;}
.Title h2{position: relative;}

.AreaHeader .Header .Data{display: flex;align-items: center;}
.Logo{text-indent:100%;white-space:nowrap;overflow:hidden;width: 110px;height: 60px;
	background: url(../images/LogoKari.jpg) no-repeat;background-size: contain;margin-right: 10px;
	
	}
.AreaHeader .Header .Data .Name span {
    display: block;
    font-size: 22px;
    font-weight: bold;
}


/********** フッター **********/

.FooterOrder{background-color: #f1f2f7;}

.AreaOrder{-webkit-border-radius: 5px;border-radius: 5px;box-shadow: 5px 0 20px rgba(0, 0, 0, 0.2);}
.AreaOrder h2{background: #272a38;color: #fff;}
.AreaOrder h2 span{ position: relative;}
.AreaOrder ul li a{display: flex;justify-content: center;align-items: center;line-height: 1;}
.AreaOrder ul li a span.Box{font-family: Helvetica, Arial, sans-serif;display: block;text-align: center;}
.AreaOrder ul li a span.TelNumber{display: block;font-weight: bold;}
.AreaOrder ul li a span.TelNumber b::before,.AreaOrder ul li a span.TelNumber b::after{content: "-";vertical-align: 10%;}
.AreaOrder >div{background: #fff;-webkit-border-radius: 0 0 5px 5px;border-radius:  0 0 5px 5px;border-right: 3px solid #212b6a;border-bottom: 3px solid #212b6a;border-left: 3px solid #212b6a;}
.AreaOrder >div p{background: #f1f2f7;color: #545765;text-align: center;}
.AreaOrder >div p span.TelNumber{font-family: Helvetica, Arial, sans-serif;color: #272a38;font-weight: bold;}


.FooterMain{background: #272a38;color: #fff;}
.FooterMain a{color: #fff;}

ul.Sns li a{width: 60px;height: 60px;background: #fff;-webkit-border-radius: 100vh;border-radius: 100vh;display: flex;text-indent:100%;white-space:nowrap;overflow:hidden;font-size: 0;}

.FooterMain .Wrapper{}
.FtBtm{border-top: 1px solid #fff;}


.Btn a{display: flex;justify-content: center;align-items: center;position: relative;border: 1px solid #272a38;color: #272a38;-webkit-border-radius: 100vh;border-radius: 100vh;}

.ComeTable{border-top: 1px solid #ccc;width: 100%;}
table.ComeTable th,table.ComeTable td,dl.ComeTable > div,ul.ComeTable li{border-bottom: 1px solid #ccc;}
table.ComeTable th,table.ComeTable td,dl.ComeTable dt,dl.ComeTable dd,ul.ComeTable li span.Time,ul.ComeTable li p{width: 100%;}



/********** ログインフォーム **********/
#gotop{position: fixed;right: 0;bottom: 0;display: none;}


.AreaHeader{background: #fff;}
.BtnMenu {position: absolute;display: flex;justify-content: center;align-items: center;right: 0;width: 60px;height: 60px;}
.BtnMenu p{position: relative;display: flex;justify-content: center;align-items: center;}
.BtnMenu p span, .BtnMenu p span::before, .BtnMenu p span::after {display: block;overflow: hidden;height: 2px;background: #141a3a;}
.BtnMenu p span::before,.BtnMenu p span::after{content: "";display: block;position: absolute;transition: all 0.3s linear;}

.RecruitBtn a{background: #c78e25;height: 100%;font-weight: bold;color: #fff;text-align: center;position: relative;}
.OrderBtn a{background: url(../images/BgHeaderTaxi.png) no-repeat center #141a3a;height: 100%;text-align: center;font-weight: bold;color: #fff;position: relative;}

.FadeIn{transform: translateY(80px);}
.FadeIn.ScrollIn{transform: translateY(0px);}

/********** レスポンシブル ********/
@media screen and (max-width:767px) {
	body{font-size: 15px;}
	body.Scrolled{padding-top: 60px;margin-top: -60px;}
	.pc{display:none !important;}
	.sp{}

	.Wrapper{padding-right: 15px;padding-left: 15px;}
	.SecondTitle{height: 100px;}
	.SecondTitle .Wrapper h1{font-size: 24px;}

		.Logo {
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
		width: 55px;
		height: 30px;
		background: url(../images/LogoKari.jpg) no-repeat;
		background-size: contain;
		margin-right: 10px;
	}
	/********** ヘッダー **********/
	.AreaHeader{box-shadow: 0 1px 10px rgba(0,0,0,0.2);height: 60px;}
	.AreaHeader .Wrapper{display: flex;justify-content: space-between;max-width: 1980px;padding: 0;}
	.AreaHeader .Header{padding-left: 10px;}
	.AreaHeader .Header .Data {height: 60px;}
	.AreaHeader .Header .Data .Name{font-size: 0;}

	.BtnMenu p {width: 40px;height: 18px;}
	.BtnMenu p span, .BtnMenu p span::before, .BtnMenu p span::after{width: 40px;}

	.AreaHeader .BtnMenu.Active p span,.AreaHeader .BtnMenu.Active p span::before,.AreaHeader .BtnMenu.Active p span::after {
		width: 30px;
	}
	.AreaHeader .BtnMenu.Active p span::before{left: 10px;}
	.MainNavi{padding: 0 15px 20px;}
	.AreaHeader .Wrapper nav ul.MainNavi li a{border-bottom: 1px solid #ccc;}



	/********** フッター **********/
	.FooterOrder{background-image: url(../images/SP/BgFooterOrder.png);background-repeat: repeat-x;background-position: left bottom;background-size: 265px 23px;}
	.FooterOrder .Wrapper{padding: 30px 15px 45px;}
	
	.FooterMain{background-image: url(../images/SP/BgFooter.jpg);background-repeat: no-repeat;background-position: center bottom;background-size: contain;}
	.FooterMain .Wrapper{padding: 28px 15px 18px;}
	.FooterMain .Wrapper p{font-size: 14px;line-height: 1;}
	.FooterMain .Wrapper .FtTop{padding-bottom: 30px;}
	.FooterMain .Wrapper .FtTop .Company{flex-wrap: wrap;margin-bottom: 39px;}
	.FooterMain .Wrapper .FtTop .Company > p{margin-bottom: 10px;font-size: 12px;line-height: 1.5;}
	.FooterMain .Wrapper p.Name{font-size: 24px;font-weight: bold;margin-bottom: 19px;}
	.FooterMain .Wrapper .FtTop .Company .Address a{margin-top: 10px;display: inline-block;text-decoration: underline;}
	.FooterMain .Wrapper .FtTop .Links{display: flex;justify-content: flex-end;align-items: center;}
	.FooterMain .Wrapper .FtTop .Links > p{width: 50%;text-align: center;}
	.FooterMain .Wrapper .FtTop .Links > p:nth-of-type(1) img{width: 50%;}
	.FooterMain .Wrapper .FtBtm{padding-top: 19px;}
	.FooterMain .Wrapper p.Copyright{font-size: 10px;line-height: 1;text-align: center;}
	.FooterMain .Wrapper .FtBtm ul li{line-height: 12px;margin-left: 21px;position: relative;}
	.FooterMain .Wrapper .FtBtm ul li::before{content: "/";position: absolute;left: -13px;top: 3px;font-size: 12px;}
	.FooterMain .Wrapper .FtBtm ul li:first-of-type::before{content: none;}
	.FooterMain .Wrapper .FtBtm ul li a{font-size: 12px;text-decoration: underline;}



    .AreaOrder h2{-webkit-border-radius: 5px 5px 0 0;border-radius: 5px 5px 0 0;height: 68px;font-size: 22px;line-height: 60px;display: flex;align-items: center;padding: 0 20px;}
    .AreaOrder h2 span{display: inline-block;line-height: 24px;font-size: 18px;padding-left: 60px;}
    .AreaOrder h2 span::before{content: "";display: inline-block;width: 42px;height: 35px;background: url(../images/SP/IconOrderTitle.png) no-repeat;position: absolute;left: 0;top: 6px;background-size: contain;}
	.AreaOrder ul li{width: 100%;padding-bottom: 26px;position: relative;}
	.AreaOrder ul li:nth-of-type(2)::before,.AreaOrder ul li:nth-of-type(2)::after{content: "";display: block;width: 145px;height: 1px;background: #8f92a2;position: absolute;left: 50%;transform: translateX(-50%);}
	.AreaOrder ul li:nth-of-type(2)::before{top: -14px;}
	.AreaOrder ul li:nth-of-type(2)::after{bottom: 14px;}
	.AreaOrder ul li:nth-of-type(3){padding-bottom: 20px;}
	.AreaOrder ul li a span.TelNumber{position: relative;font-size: 38px;margin-top: 0;}
	.AreaOrder ul li a span.TelNumber::before{content: "";display: inline-block;width: 20px;height: 29px;margin-right: 3px;background: url(../images/SP/IconOrderTel.png) no-repeat;background-size: contain;}
    .AreaOrder >div{padding: 25px 15px;}
	.AreaOrder >div p{margin: 0 auto;line-height: 1.4;padding: 18px 16px 18px;}
	.AreaOrder >div p span.TelNumber{font-size: 26px;margin-top: 7px;display: block;}

	ul.Sns{display: flex;justify-content: center;margin-top: 30px;}
	ul.Sns li{margin-right: 10px;}
	ul.Sns li.Insta a{background-image: url(../images/SP/BtnInstagram.png);background-repeat: no-repeat;background-position: center;background-size: 35px 36px;}
	ul.Sns li.YouTube a{background-image: url(../images/SP/BtnYouTube.png);background-repeat: no-repeat;background-position: center;background-size: 38px 28px;}


	.AreaHeader .Wrapper .Menu nav{top: 60px;position: absolute;left: 0;
		width: 100%;background: rgba(255, 255, 255, .9);transition: all 0.3s linear;opacity: 0;height: 0;overflow: hidden;
	}
	.AreaHeader .Wrapper .Menu.Active nav{
		height: 100vh;opacity: 10;overflow: visible;
	}

	.Menu.Active nav{top: 60px;position: absolute;width: 100%;left: 0;background: #fff;height: 100vh;z-index: 10;}


	.AreaBtn li{padding: 5px 15px;}
	.OrderBtn a,.RecruitBtn a{display: block;border-radius: 5px;padding: 10px;height: 70px;}
	.OrderBtn a{display: flex;align-items: center;font-size: 20px;justify-content: center;background-position: left;}
	.RecruitBtn a{font-size: 12px;}
	.OrderBtn a br,.RecruitBtn a br{display: none;}
	.RecruitBtn a b {font-size: 22px;display: block;}



}

@media screen and (min-width:768px) {
	.pc{}
	.sp{display:none !important;}
	a[href^="tel:"]{pointer-events: none;}

	.Wrapper{max-width: 1200px;}
	.SecondTitle{height: 200px;}
	.SecondTitle .Wrapper h1{font-size: 32px;}
    h2{ font-size: 26px;}
	.Btn a:hover{background: #141a3a;border-color: #141a3a;color: #fff;}
	table.ComeTable th,table.ComeTable td,dl.ComeTable dt,dl.ComeTable dd,ul.ComeTable li span.Time,ul.ComeTable li p{padding: 23px 20px;}


	/********** ヘッダー **********/
	.AreaHeader{box-shadow: 0 1px 10px rgba(0,0,0,0.2);height: 90px;}
	.AreaHeader .Wrapper{display: flex;justify-content: space-between;max-width: 1980px;padding: 0;}
	.AreaHeader .Wrapper nav,.AreaHeader .Wrapper nav ul{display: flex;height: 90px;}

	.Logo{text-indent:100%;white-space:nowrap;overflow:hidden;width: 110px;height: 60px;
		background: url(../images/LogoKari.jpg) no-repeat;background-size: contain;margin-right: 10px;
		
		}
	.MainNavi{align-items: flex-end;font-size: 18px;font-weight: bold;margin-right: 33px;}
	.MainNavi li{line-height: 1;padding-left: 27px;padding-bottom: 22px;}

	.OrderBtn a{width: 180px;background: url(../images/BgHeaderTaxi.png) no-repeat center #141a3a;height: 100%;display: flex;justify-content: center;align-items: center;text-align: center;font-weight: bold;color: #fff;position: relative;font-size: 18px;}
	.OrderBtn a span{line-height: 1.2;display: block;}
	.RecruitBtn a{width: 200px;height: 100%;display: flex;justify-content: center;align-items: center;font-size: 24px;font-weight: bold;color: #fff;text-align: center;position: relative;}
	.RecruitBtn a span.Inner > span{font-size: 12px;display: block;line-height: 1.25;font-weight: normal;}
	.RecruitBtn a span.Inner > b{margin-right: 13px;}
	.RecruitBtn a::after{content: "";display: block;width: 21px;height: 21px;background: url(../images/IconHeaderBtn.png) no-repeat center;position: absolute;right: 29px;bottom: 18px;}


	.AreaHeader .Header{display: flex;align-items: center;padding-left: 40px;}
	.AreaHeader .Header .Data{display: flex;align-items: center;height: 90px;}
	.AreaHeader .Header .Data .Name{font-size: 11px;}
	.AreaHeader .Header .Data .Name span{display: block;font-size: 22px;font-weight: bold;}

	/********** フッター **********/
	.FooterOrder{background-image: url(../images/BgFooterOrder.png);background-repeat: repeat-x;background-position: left bottom;}
	.FooterOrder .Wrapper{padding: 53px 0 52px;}
	
	.FooterMain{background-image: url(../images/BgFooter.jpg);background-repeat: no-repeat;background-position: right top;}
	.FooterMain .Wrapper{padding: 48px 0 36px;}
	.FooterMain .Wrapper p{font-size: 14px;line-height: 1;}
	.FooterMain .Wrapper > div{display: flex;justify-content: space-between;}
	.FooterMain .Wrapper .FtTop .Company,.FooterMain .Wrapper .FtTop ul.Sns,.FooterMain .Wrapper .FtTop .Links,.FooterMain .Wrapper .FtBtm nav ul{display: flex;}
	.FooterMain .Wrapper .FtTop .Company{flex-wrap: wrap;margin-bottom: 39px;width: 50%;}
	.FooterMain .Wrapper .FtTop .Company > p{width: 100%;margin-bottom: 10px;}
	.FooterMain .Wrapper p.Name{font-size: 26px;font-weight: bold;margin-bottom: 19px;}
	.FooterMain .Wrapper .FtTop .Company .Address a{margin-top: 10px;display: inline-block;text-decoration: underline;}
	.FooterMain .Wrapper .FtTop .Links{width: 50%;justify-content: flex-end;}
	.FooterMain .Wrapper .FtTop .Links > p{margin-left: 30px;}
	.FooterMain .Wrapper .FtBtm{padding-top: 19px;}
	.FooterMain .Wrapper p.Copyright{font-size: 12px;line-height: 1;}
	.FooterMain .Wrapper .FtBtm ul li{line-height: 12px;margin-left: 21px;position: relative;}
	.FooterMain .Wrapper .FtBtm ul li::before{content: "/";position: absolute;left: -13px;top: 3px;font-size: 12px;}
	.FooterMain .Wrapper .FtBtm ul li:first-of-type::before{content: none;}
	.FooterMain .Wrapper .FtBtm ul li a{font-size: 12px;text-decoration: underline;}



    .AreaOrder h2{-webkit-border-radius: 5px 5px 0 0;border-radius: 5px 5px 0 0;height: 60px;font-size: 22px;line-height: 60px;text-align: center;}
    .AreaOrder h2 span{ position: relative;padding-left: 53px;}   
    .AreaOrder h2 span::before{content: "";display: inline-block;width: 42px;height: 35px;background: url(../images/IconOrderTitle.png) no-repeat;position: absolute;left: 0;top: -2px;}
    .AreaOrder ul{max-width: 1080px;margin: 0 auto;display: flex;}
	.AreaOrder ul li{width: 33.33333%;position: relative;}
	.AreaOrder ul li:nth-of-type(2)::before,.AreaOrder ul li:nth-of-type(2)::after{content: "";display: block;width: 1px;height: 60px;background: #8f92a2;position: absolute;top: 4px;}
	.AreaOrder ul li:nth-of-type(2)::before{left: 0;}
	.AreaOrder ul li:nth-of-type(2)::after{right: 0;}

	.AreaOrder ul li a{pointer-events: none;}
	.AreaOrder ul li a span.TelNumber{position: relative;font-size: 38px;margin-top: 10px;}
	.AreaOrder ul li a span.TelNumber::before{content: "";display: inline-block;width: 20px;height: 29px;margin-right: 3px;background: url(../images/IconOrderTel.png) no-repeat;}
    .AreaOrder >div{padding: 30px 0 26px;}
    .AreaOrder >div p{max-width: 570px;margin: 26px auto 0;line-height: 1;padding: 18px 0 21px;}
    .AreaOrder >div p span.TelNumber{font-size: 24px;margin-top: 7px;display: inline-block;}

	ul.Sns{margin-left: 20px;}
	ul.Sns li{margin-right: 10px;}
	ul.Sns li.Insta a{background-image: url(../images/BtnInstagram.png);background-repeat: no-repeat;background-position: center;}
	ul.Sns li.YouTube a{background-image: url(../images/BtnYouTube.png);background-repeat: no-repeat;background-position: center;}

	ul.ComeTable > li,dl.ComeTable > div{display: flex;}


}

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


	.AreaHeader .Header .Data .Name span{font-size: 20px;}
	.AreaHeader .Wrapper nav ul.MainNavi li a{
		width: 100%;
		height: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 20px;
		font-weight: bold;
		padding: 18px 0;
	}

	.AreaHeader.OnScroll{
		position: fixed;
		top: 0;
		width: 100%;
		z-index: 10;
		background: #fff;
	}


	.BtnMenu {
		position: absolute;
		display: flex;
		justify-content: center;
		align-items: center;
		right: 0;
	}


	

	.BtnMenu p span::before{top: -3px;}
	.BtnMenu p span::after{bottom: -3px;}







.BtnMenu.Active p {
    width: 50px;
    height: 20px;
}
.BtnMenu.Active p span, .BtnMenu.Active p span::before, .BtnMenu.Active p span::after {
	width: 50px;
}

.BtnMenu.Active p span{
    background: #fff;
}
.BtnMenu.Active p span::before {
    top: 9px;
    left: 0;
    transform: rotate(45deg);
}
.BtnMenu.Active p span::after {
    bottom: 0;
    transform: rotate(-45deg);
    top: 8px;
}


}

@media screen and (min-width:768px) and (max-width:1280px) {
	.BtnMenu {width: 100px;height: 90px;}
	.BtnMenu p {width: 60px;height: 30px;}
	.BtnMenu p span, .BtnMenu p span::before, .BtnMenu p span::after{width: 60px;}
	.AreaHeader .Wrapper nav ul.MainNavi {transition: all 0.3s linear;opacity: 0;height: 0;overflow: hidden;}
	.AreaHeader .Wrapper nav ul.MainNavi {top: 90px;width: 50%;height: 0;background: rgba(255, 255, 255, .9);
		margin-right: 0;display: flex;position: absolute;right: 0;z-index: 1;/* align-items: center; */justify-content: flex-end;}
	.AreaHeader .Wrapper .Menu.Active nav ul.MainNavi {opacity: 1;overflow: visible;height: 90px;}
	.AreaHeader .Wrapper nav ul.MainNavi li {line-height: 1;padding-left: 0;padding-bottom: 0;width: 33.3333%;height: 100%;}
	.Wrapper{padding-right: 30px;padding-left: 30px;max-width: 980px;}
	header .Menu{padding-right: 100px;}
	.AreaHeader .Wrapper nav ul.MainNavi li a:hover{background: rgba(20, 26, 58,.2);}
	.BtnMenu:hover{cursor: pointer;}
	.FooterMain{background-size: contain;}

}

@media screen and (min-width:768px) and (max-width:1080px) {
	.FooterOrder .Wrapper,.FooterMain .Wrapper {padding-right: 30px;padding-left: 30px;}
	.AreaOrder ul li a span.TelNumber{letter-spacing: 0;}
	.FooterMain .Wrapper .FtTop .Company p{line-height: 1.25;}
}


@media screen and (min-width:768px) and (max-width:980px) {
	.AreaHeader .Header{padding-left: 20px;}
	.AreaHeader .Header .Data .Name{font-size: 0;}
	.AreaHeader .Header .Data .Name span{font-size: 20px;}
	.OrderBtn a {width: 140px;font-size: 15px;}
	.RecruitBtn a {width: 150px;font-size: 20px;}
	.RecruitBtn a::after {right: 13px;bottom: 20px;}
	.RecruitBtn a span.Inner > span{font-size: 10px;}
	.FooterMain{background-size: cover;background-position: center top;}
	.AreaOrder ul li a span.Box{font-size: 15px;}
	.AreaOrder ul li a span.TelNumber{font-size: 30px;}
	.AreaOrder ul li a span.TelNumber::before{width: 17px;background-size: contain;height: 26px;margin-right: 3px;margin-bottom: -3px;}
	.FooterMain .Wrapper .FtTop ul.Sns{margin-top: 20px;margin-left: 0;}

}

@media screen and (min-width:1280px) {
	.BtnMenu{display: none;}
	.AreaHeader .Wrapper nav ul.MainNavi li a:hover{text-decoration: underline;}
}