@charset "UTF-8";

/* Top
------------------------- */
#top {
	position: relative;
	height: 670px;
	background-image: url("../img/page/home/main.webp");
	background-repeat: no-repeat;
	background-position: left center;
	background-size: cover;
}

/* Face
------------------------- */
#face {
	position: absolute;
	left: 0;
	top: 64px;
	width: 100%;
}
#face__inner {
	display: flex;
	justify-content: center;
	width: 1600px;
	height: 606px;
	margin: auto;
}
#faceCatchphrase {
	flex: 0 0 658px;
	height: 100%;
	display: flex;
	align-items: center;
}
#facePanel {
	flex: 0 0 942px;
	height: 100%;
	display: flex;
	align-items: center;
}

#faceCatchphrase__core {
	color: #fff;
}
#mainCatch {
	text-shadow:
		1px  1px 1px rgba( 0, 10, 61, 0.3 ),
		1px -1px 1px rgba( 0, 10, 61, 0.3 ),
	   -1px  1px 1px rgba( 0, 10, 61, 0.3 ),
	   -1px -1px 1px rgba( 0, 10, 61, 0.3 ),
		1px  2px 2px rgba( 0, 10, 61, 0.3 ),
		1px -2px 2px rgba( 0, 10, 61, 0.3 ),
	   -1px  2px 2px rgba( 0, 10, 61, 0.3 ),
	   -1px -2px 2px rgba( 0, 10, 61, 0.3 ),
		2px  1px 3px rgba( 0, 10, 61, 0.3 ),
		2px -1px 3px rgba( 0, 10, 61, 0.3 ),
	   -2px  1px 3px rgba( 0, 10, 61, 0.3 ),
	   -2px -1px 3px rgba( 0, 10, 61, 0.3 ),
		2px  3px 5px rgba( 0, 10, 61, 0.3 ),
		2px -3px 5px rgba( 0, 10, 61, 0.3 ),
	   -2px  3px 5px rgba( 0, 10, 61, 0.3 ),
	   -2px -3px 5px rgba( 0, 10, 61, 0.3 ),
		7px  6px 7px rgba( 0, 10, 61, 0.3 ),
		7px -6px 7px rgba( 0, 10, 61, 0.3 ),
	   -7px  6px 7px rgba( 0, 10, 61, 0.3 ),
	   -7px -6px 7px rgba( 0, 10, 61, 0.3 );
	font-weight: 500;
	font-size: 45px;
}
#mainCatch .notoSans {
	letter-spacing: 4px;
}
#mainCatch .notoSans .thin {
	font-weight: 500;
	font-size: 80%;
}
#subCatch {
	text-shadow:
		1px  1px 1px rgba( 0, 10, 61, 0.3 ),
		1px -1px 1px rgba( 0, 10, 61, 0.3 ),
	   -1px  1px 1px rgba( 0, 10, 61, 0.3 ),
	   -1px -1px 1px rgba( 0, 10, 61, 0.3 ),
		1px  2px 2px rgba( 0, 10, 61, 0.3 ),
		1px -2px 2px rgba( 0, 10, 61, 0.3 ),
	   -1px  2px 2px rgba( 0, 10, 61, 0.3 ),
	   -1px -2px 2px rgba( 0, 10, 61, 0.3 ),
		2px  1px 3px rgba( 0, 10, 61, 0.3 ),
		2px -1px 3px rgba( 0, 10, 61, 0.3 ),
	   -2px  1px 3px rgba( 0, 10, 61, 0.3 ),
	   -2px -1px 3px rgba( 0, 10, 61, 0.3 ),
		2px  3px 5px rgba( 0, 10, 61, 0.3 ),
		2px -3px 5px rgba( 0, 10, 61, 0.3 ),
	   -2px  3px 5px rgba( 0, 10, 61, 0.3 ),
	   -2px -3px 5px rgba( 0, 10, 61, 0.3 );
}
#subCatch .outfit {
	display: inline-block;
	letter-spacing: 3px;
	font-weight: 700;
	font-size: 36px;
}
#subCatch .notoSans {
	display: inline-block;
	margin: 0 0 0 12px;
	vertical-align: 1px;
	letter-spacing: 3px;
	font-weight: 800;
	font-size: 21px;
}

/* Panel
------------------------- */
#facePanel--inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	width: 942px;
}
.facePanel__card {
	width: 465px;
	height: 184px;
	margin: 0 0 12px;
}
.facePanel__anchor {
	display: flex;
	flex: 0 0 465px;
	width: 100%;
	height: 100%;
	padding: 25px 17px;
	background-color: #fff;
	text-decoration: none;
	color: #000;
}
.facePanel__thumb {
	flex: 0 0 100px;
}
.facePanel__contents {
	flex: 1 1 301px;
	padding: 0 15px;
}
.facePanel__title {
	margin: 0 0 20px;
	letter-spacing: 2px;
	font-weight: 700;
	font-size: 21px;
}
.facePanel__navi {
	display: flex;
	align-items: center;
	flex: 0 0 30px;
}
.facePanel__button {
	transition: 0.4s;
	cursor: pointer;
	display: block;
	width: 30px;
	height: 30px;
	border: 0;
	background-color: var(--navy);
	background-image: url("../img/icon/gt_white.svg");
	background-repeat: no-repeat;
	background-position: 60% 50%;
	background-size: 13px 19px;
}
.facePanel__button span {
	overflow: hidden;
	white-space: nowrap;
	display: block;
	width: 30px;
	height: 30px;
	text-indent: -2000px;
}
.facePanel__card:hover .facePanel__button {
	background-color: var(--sky);
}
.facePanel__title:before { 
	display: inline-block;
	content: "";
	width: 16px;
	height: 16px;
	border-radius: 50vh;
	background-color: var(--pink);
	vertical-align: -1px;
}
#microbus-lease .facePanel__title:before {
	background-color: var(--green);
}
#microbus-rental .facePanel__title:before {
	background-color: var(--mint-green);
}
#microbus-kaitori .facePanel__title:before {
	background-color: var(--canary);
}

/* Section
------------------------- */
.basicSection {
	padding: 100px 0;
}

/* section title */
.textHeading__alphabet {
	line-height: 1.1;
	font-weight: 600;
	font-size: 72px;
	color: var(--navy);
}
.textHeading__japanese {
	line-height: 1.3;
	letter-spacing: 3px;
	text-indent: 2px;
	font-weight: 600;
	font-size: 21px;
	color: var(--blue);
}
.roundHeading {
	width: 100%;
	text-align: center;
}
.roundHeading__title {
	display: inline-block;
	margin: 0 auto 30px;
	padding: 5px 25px;
	background-color: #fff;
	border: solid 1px var(--sky);
	border-radius: 50vh;
	font-weight: 700;
}

.flexboxOuterPost {
	display: flex;
	margin: 0 0 30px;
}
.flexboxOuterPost__title {
	display: flex;
	justify-content: center;
	align-items: center;
	flex: 0 0 700px;
}
.flexboxOuterPost__contents {
	flex: 1 1 1200px;
	overflow: hidden;
	padding: 10px 0 10px 10px;
}

/* button */
.postNavi {
	text-align: center;
}
.postNavi .postNavi_button {
	transition: 0.4s;
	display: flex;
	justify-content: space-between;
	width: 250px;
	height: 40px;
	margin: auto;
	border: solid 2px var(--navy);
	letter-spacing: 2px;
	text-decoration: none;
	font-weight: 700;
	color: var(--navy);
}
.postNavi .postNavi_button:hover {
	/*border: solid 2px var(--sky);
	color: var(--sky);*/
}
.postNavi .postNavi__inner {
	display: block;
	flex: 0 0 211px;
	height: 36px;
}
.postNavi .postNavi__label {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 211px;
	height: 36px;
	background-color: #fff;
}
.postNavi .postNavi_button:after {
	transition: 0.4s;
	display: block;
	content: "";
	flex: 0 0 35px;
	width: 35px;
	height: 36px;
	background-color: var(--navy);
	background-image: url("../img/icon/arrow_right_white.svg");
	background-repeat: no-repeat;
	background-position: 63% 50%;
	background-size: 17px 17px;
}

.postNavi.colorInversion .postNavi_button {
	border: solid 2px #fff;
	color: #fff;
}
.postNavi.colorInversion .postNavi__label {
	background-color: var(--navy);
}
.postNavi.colorInversion .postNavi_button:after {
	background-color: #fff;
	background-image: url("../img/icon/arrow_right_navy.svg");
}

/* News
------------------------- */
#newsItems__outer {
	margin: 50px auto 0;
	padding: 0px 80px;
}
.newsItems {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin: 0 0 15px;
	padding: 0 0 15px;
	border-bottom: dotted 1px #999;
}
.newsItems dt {
	display: flex;
	flex: 0 0 280px;
	padding: 0 10px;
	letter-spacing: 2px;
	font-weight: 400;
}
.newsItems dd {
	flex: 0 0 calc( 100% - 280px );
	padding: 0 10px;
	font-weight: 400;
}
.newsItems a {
	text-decoration: none;
	color: var(--navy);
}
.newsItem--line-date {
	flex: 0 0 120px;
	display: block;
	line-height: 1.6;
	font-weight: 400;
	font-size: 18px;
}
.newsItem--line-cate {
	flex: 0 0 120px;
	display: block;
	padding: 4px 0;
	background-color: var(--navy);
	letter-spacing: 1px;
	text-align: center;
	font-size: 14px;
	color: #fff;
}

/* Full Stock Info
------------------------- */
#fullStockInfo {
	background-color: var(--pale-blue);
}
#fullStockInfo .textHeading__alphabet {
	margin: 0 0 5px;
}
#fullStockInfo .roundHeading__title {
	border: 0;
}
#roundHeading__title--1:before {
	content: "";
	display: inline-block;
	width: 20px;
	height: 22px;
	margin: 0 4px 0 0;
	background-color: var(--sky);
	mask: url("../img/icon/icon_bus.svg") no-repeat 50% 50% / contain;
	-webkit-mask: url("../img/icon/icon_bus.svg") no-repeat 50% 50% / contain;
	vertical-align: -5px;
}

/* slide */
.stocksWrapper {
	position: relative;
	overflow: hidden;
	width: calc( 300px * 4 + 10px * 3 );
	margin: 0;
}
#Stocks {
	display: flex;
	transition: transform 0.6s ease;
	will-change: transform;
}
#Stocks .slide {
	flex: 0 0 300px;
	width: 300px;
	margin: 0 10px 0 0;
}


/* Reason For Choosing
------------------------- */
#reasonForChoosing {
	background-color: #000215;
	background-image: url("../img/page/home/cosmos.webp");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}
.sectionHeadText {
	margin: 0 0 20px;
	text-align: center;
	font-size: 32px;
}
.sectionHeadText strong {
	font-weight: 700;
}
#reasonForChoosing .sectionHeadText {
	color: #fff;
}
#reasonForChoosing .sectionHeadText strong:before {
	display: inline-block;
	content: "";
	width: 25px;
	height: 25px;
	margin: 0 10px 0 0;
	background-image: url("../img/icon/rect9_white.svg");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	vertical-align: -2px;
}
#reasonForChoosing .roundHeading__title {
	display: inline-block;
	margin: 0 auto 30px;
	padding: 5px 25px;
	border: 0;
	background-color: #fff;
}
#roundHeading__title--2:before {
	content: "";
	display: inline-block;
	width: 20px;
	height: 17px;
	margin: 0 4px 0 0;
	background-color: #d6b97c;
	mask: url("../img/icon/icon_crown.svg") no-repeat 50% 50% / contain;
	-webkit-mask: url("../img/icon/icon_crown.svg") no-repeat 50% 50% / contain;
	vertical-align: -2px;
}

.reasonCard {
	color: #fff;
}
.reasonCards__inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding: 0 60px;
}
.reasonCard {
	flex: 0 0 510px;
	padding: 15px;
	margin: 0 0 20px;
	background-color:rgba(3, 37, 115, 0.7);
}

.reasonCard__title {
	display: flex;
}
.reasonCard__title .point {
	flex: 0 0 66px;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 66px;
	height: 66px;
	border: solid 1px #fff;
	line-height: 1;
	text-align: center;
}
.reasonCard__title .point .big {
	font-size: 36px;
}
.reasonCard__title .h3Core {
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0 0 0 12px;
	font-size: 24px;
}
.reasonCard__title .color {
	display: inline-block;
	margin: 0 5px 0 0;
	vertical-align: 1px;
	font-size: 17px;
}
.pointEyecatchIcon {
	margin: 10px auto 10px;
	text-align: center;
}
#point1 .color {
	color: #ffcbda;
}
#point2 .color {
	color: #e7c7fe;
}
#point3 .color {
	color: #bafffb;
}
#point4 .color {
	color: #fffeae;
}

/* voice
------------------------- */
#feedback .roundHeading__title {
	width: 378px;
}
#roundHeading__title--3:before {
	content: "";
	display: inline-block;
	width: 20px;
	height: 20px;
	margin: 0 4px 0 0;
	background-color: var(--sky);
	mask: url("../img/icon/icon_talk.svg") no-repeat 50% 50% / contain;
	-webkit-mask: url("../img/icon/icon_talk.svg") no-repeat 50% 50% / contain;
	vertical-align: -5px;
}
#feedback .postNavi .postNavi_button {
	letter-spacing: 1px;
}
.leadText {
	text-align: center;
	font-weight: 700;
}
.card__eyecatch {
	object-fit: cover;
	aspect-ratio: 16 / 9;
	width: 100%;
	height: auto;
}

/* Post Card */
.postCards {
	display: flex;
	justify-content: space-between;
	width: 1603px;
	margin: 30px auto;
}
.postCards .card {
	position: relative;
	flex: 0 0 400px;
	height: 406px;
}
.postCards .card__core {
	position: absolute;
	left: 0;
	bottom: 0;
	padding: 60px 15px 20px;
}
.postCards .card figure {
	margin: 0;
	line-height: 0;
}
.postCards .card__title {
	min-height: 70px;
	font-size: 18px;
}
.postCards .card__desc {
	margin: 0 0 10px;
	font-size: 12px;
}
.whiteButton {
	display: block;
	width: 180px;
	margin: auto;
	padding: 8px 0;
	background-color: #fff;
	line-height: 1;
	text-decoration: none;
	text-align: center;
	font-weight: 700;
	font-size: 13px;
	color: var(--navy);
}
.whiteButton span {
	display: block;
	padding: 0 0 0 20px;
}
.whiteButton span:after {
	display: inline-block;
	content: "";
	width: 9px;
	height: 13px;
	margin: 0 0 0 20px;
	background-color: var(--navy);
	mask: url("../img/icon/gt_white.svg") no-repeat 50% 50% / contain;
	-webkit-mask: url("../img/icon/gt_white.svg") no-repeat 50% 50% / contain;
	vertical-align: -2px;
}

.postCards .card__core.feedback__core {
	background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(0,10,61,1) 20%,rgba(0,10,61,1) 100%);
	color: #fff;
}
.postCards .card.feedbackCard {
	background-color: var(--navy);
}

/* Top Message
------------------------- */
.center__title .textHeading__alphabet {
	margin: 0 0 10px;
	text-align: center;
	font-weight: 500;
	font-size: 48px;
}
.center__title .textHeading__japanese {
	text-align: center;
	font-weight: 500;
	font-size: 18px;
}
#greeting__core {
	margin: 50px auto 0;
}
#greeting__header {
	display: flex;
	margin: 0 0 70px;
}

#president__photo {
	flex: 0 0 calc( 50% - 10px );
	display: flex;
	align-items: center;
	height: 430px;
	/*background-image: url("../img/page/home/abstract.webp");
	background-image: url("../img/page/home/message/H0A5673_rect.webp");
	background-repeat: no-repeat;
	background-position: left center;
	background-size: contain;*/
}
#president__photo figure {
	margin: 5px 0 0 50px;
}
#president__photo img {
	object-fit: cover;
	/*width: 480px;
	height: 300px;*/
	width: 430px;
	height: 430px;
}

#president__catch {
	flex: 0 0 calc( 50% - 10px );
	display: flex;
	align-items: center;
}

#president__catch--text {
	margin: 0 0 30px;
	line-height: 1.6;
	letter-spacing: 3px;
	font-weight: 900;
	font-size: 27px;
}
#president__catch--name {
	position: relative;
	text-align: right;
	font-weight: 800;
	font-size: 18px;
}
#president__catch--name:after {
	z-index: -1;
	content: "";
	display: block;
	position: absolute;
	bottom: 40%;
	left: 0;
	width: 100%;
	height: 1px;
	background-color: #000;
}
#president__catch--katagaki {
	display: inline-block;
	margin: 0 20px 0 0;
	padding: 0 0 0 15px;
	font-weight: 600;
	font-size: 16px;
}
#president__catch--name__core {
	z-index: 1;
	background-color: #fff;
}

#greeting__message {
	position: relative;
}
#greeting__message--core {
	overflow: hidden;
	height: 480px;
	padding: 0 130px;
	line-height: 2;
	letter-spacing: 2px;
	font-weight: 400;
	font-size: 17px;
}
#greeting__message--core p {
	margin: 0 0 35px;
}
#greeting__message--buttonArea {
	display: flex;
	align-items: center;
	position: relative;
	height: 100px;
	top: -100px;
	background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 60%,rgba(255,255,255,1) 100%);
}

#greeting__message.full #greeting__message--core {
	height: auto;
}
#greeting__message.full #greeting__message--buttonArea {
	height: 100px;
	top: 0;
	background: transparent;
}

.navyButton {
	cursor: pointer;
	display: block;
	width: 200px;
	margin: auto;
	padding: 10px 0;
	border: 0;
	background-color: var(--navy);
	line-height: 1;
	text-decoration: none;
	text-align: center;
	font-weight: 700;
	font-size: 13px;
	color: #fff;
}
.navyButton span {
	display: block;
	padding: 0 0 0 20px;
}
.navyButton span:after {
	display: inline-block;
	content: "";
	width: 9px;
	height: 13px;
	margin: 0 0 0 20px;
	background-color: #fff;
	mask: url("../img/icon/gt_white.svg") no-repeat 50% 50% / contain;
	-webkit-mask: url("../img/icon/gt_white.svg") no-repeat 50% 50% / contain;
	vertical-align: -2px;
}

/* Knowledge
------------------------- */
#knowledge {
	background-color: var(--navy);
	color: #fff;
}
#knowledge .textHeading__alphabet {
	margin: 0 0 20px;
	color: #fff;
}
#knowledge .textHeading__japanese {
	font-weight: 500;
	font-size: 17px;
	color: #fff;
}

.postCards .card__core.knowledge__core {
	background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(229,241,255,1) 20%,rgba(229,241,255,1) 100%);
	color: var(--navy);
}
.postCards .card.knowledgeCard {
	background-color: var(--pale-blue);
}

/* Post Card */
.blogSection .outerCards {
	overflow: hidden;
	position: relative;
	display: block;
	/*gap: 1px;*/
	width: 1202px;
	height: 406px;
	margin: 30px auto 0;
}
.blogSection .postCard {
	width: 400px;
	height: 406px;
	margin: 0 1px 0 0;
}
.blogSection .outerCards .track {
	width: 4010px;
	display: flex;
	transition: transform 0.6s ease;
	will-change: transform;
}

/* Navi Rect Button */
.naviRectButton__outer {
	display: flex;
	justify-content: center;
	margin: 0 0 15px;
}
.rectButton {
	cursor: pointer;
	outline: none;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	padding: 0;
	margin: 0 5px;
	border: none;
	background: none;
	background-color: #fff;
	font: inherit;
	color: inherit;
}
.rectButton img {
	display: block;
}
.rectButton__left img {
	transform: scale(-1, 1);
	margin: 0 1px 0 0;
}
.rectButton__right img {
	margin: 0 0 0 3px;
}

/* Blog
------------------------- */
#blog {
	background-color: var(--pale-blue);
	color: var(--navy);
}
#blog .textHeading__alphabet {
	margin: 0 0 20px;
	color: var(--navy);
}
#blog .textHeading__japanese {
	font-weight: 500;
	font-size: 17px;
	color: var(--blue);
}

.postCards .card__core.blog__core {
	background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(0,10,61,1) 20%,rgba(0,10,61,1) 100%);
	color: #fff;
}
.postCards .card.blogCard {
	background-color: var(--navy);
}

/* About Us
------------------------- */
#AboutUs .center__title {
	margin: 0 0 100px;
}
.AboutUs__contents {
	display: flex;
	justify-content: space-between;
}
.AboutUs__contents--1 {
	margin: 0 0 50px;
}
.AboutUs__contents--catch {
	margin: 70px 0 50px;
	font-weight: 800;
	font-size: 29px;
}
.AboutUs__contents--left {
	/*flex: 0 0 570px;*/
	flex: 0 0 calc( 50% - 20px );
}
.AboutUs__contents--right {
	/*flex: 0 0 500px;*/
	flex: 0 0 calc( 50% - 20px );
}
.aboutUs__photo {
	margin: 0 0 10px;
	line-height: 0;
}
.aboutUs__photo img {
	object-fit: cover;
	/*aspect-ratio: 2 / 1;*/
	aspect-ratio: 3 / 2;
	width: 100%;
	max-width: 500px;
	height: auto;
}
.AboutUs__contents--desc p {
	margin: 0 0 35px;
	line-height: 2;
	letter-spacing: 2px;
	font-weight: 400;
	font-size: 17px;
}
.AboutUs__contents--desc .simpleButton {
	width: 250px;
	letter-spacing: 1px;
	font-size: 14px;
}
.AboutUs__contents .googleMap {
	position: relative;
	overflow: hidden;
	height: 0;
	padding-bottom: 90%;
	margin: 0;
}
.AboutUs__contents .googleMap iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border:solid 1px var(--gold);
	padding: 0 0 1px;
}

.AboutUs__contents--subHeader__title {
	margin: 0 0 5px;
	font-size: 20px;
}
.AboutUs__contents--subHeader p {
	font-weight: 400;
}

.AboutUs__contents--subHeader {
	margin: 0 0 35px;
}
.AboutUs__contents--subTitle {
	margin: 0 0 20px;
	font-size: 18px;
}
.AboutUs__contents--subTitle:before {
	content: "";
	display: inline-block;
	width: 25px;
	height: 25px;
	margin: 0 9px 0 0;
	background-color: #000;
	vertical-align: -5px;
}
.AboutUs__contents--subTitle.byTrain:before {
	mask: url("../img/icon/icon_bus.svg") no-repeat 50% 50% / contain;
	-webkit-mask: url("../img/icon/icon_bus.svg") no-repeat 50% 50% / contain;
}
.AboutUs__contents--subTitle.byCar:before {
	mask: url("../img/icon/icon_car.svg") no-repeat 50% 50% / contain;
	-webkit-mask: url("../img/icon/icon_car.svg") no-repeat 50% 50% / contain;
}

.numberList {
	counter-reset: my-counter;
	list-style-type: none;
	margin: 0 0 35px;
}
.numberList li {
	position: relative;
	display: flex;
	margin: 0 0 20px;
	line-height: 2;
}
.numberList li:before {
	content: counter(my-counter);
	counter-increment: my-counter;
	flex: 0 0 30px;
	display: inline-block;
	position: relative;
	top: 0;
	width: 30px;
	height: 30px;
	margin: 0 10px 0 0;
	border: solid 1px #000;
	background-color: #fff;
	line-height: 30px;
	text-align: center;
	text-indent: 2px;
	font-weight: 700;
	font-size: 17px;
	color: #000;
}
/* end of file */