@charset "utf-8";

/*----------------------------------------------------
	コンテンツ共通設定
----------------------------------------------------*/

.cen {
	text-align: center;
}

.right {
	text-align: right;
}

.mt {
	margin-top: 20px;
}

.mb {
	margin-bottom: 20px;
}

.mbm {
	margin-bottom: 10px;
}

.mbx2 {
	margin-bottom: 40px;
}

.mbx4 {
	margin-bottom: 60px;
}

.mbxl {
	margin-bottom: 140px;
}

.pt {
	padding-top: 20px;
}

.ptxl {
	padding-top: 100px;
}

.pb {
	padding-bottom: 20px;
}

.pinner {
	padding: 10px;
	box-sizing: border-box;
}

#container {
	margin: 0 auto;
	background-color: #000;
	max-width: 767px;
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

#container.gb_off {
	background-color: #fff;
	color: #000;
}

table td {
	word-break: break-all;
}

strong {
	font-weight: bold;
}

/*ヘッダー*/

#header .to_back {
	float: none;
	line-height: 50px;
}

#header .h_logo {
	background: #212329;
	text-align: center;
	line-height: 50px;
	min-height: 70px;
}

#header .logo {
	font-size: 16px;
	font-size: 1.6rem;
}

::placeholder {
	color: #cfcfcf;
}

/*ナビ*/

#gnav {
	background: linear-gradient(#162c56, #153a88);
	padding: 7px 0;
	text-align: center;
}

#gnav .inner {
	padding: 0;
}

#gnav .nav_list {
	display: -webkit-flex;
	display: flex;
	justify-content: center;
	align-items: center;
}

#gnav .nav_list li {
	width: 20%;
	text-align: center;
}

#gnav .nav_list li a {
	display: inline-block;
	height: 50px;
	line-height: 1.1em;
	font-size: 10px;
}
@media screen and (min-width: 1220px) {
	#gnav .nav_list li a {
		font-size: 16px;
	}
}

#gnav .nav_list li img {
	margin-bottom: 2px;
}

#gnav .nav_list li.col2 img {
	margin-bottom: 0px;
}

.h_logo .inner {
	width: 100%;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

#header .logo {
	width: 40%;
	margin: 0 auto;
}

.h_logo .inner .to_back {
	width: 15%;
	line-height: 50px;
	display: inline-block;
	text-align: center;
	float: none;
}

.h_logo .inner .to_back img {
	max-width: 15px;
}

.h_logo .inner .logout {
	float: none;
	width: 15%;
}

.h_logo .inner .right_icon {
	/*margin-left: auto;*/
	width: 15%;
	display: flex;
	justify-content: flex-end;
	margin-right: 3%;
	align-items: center;
}

.h_logo .inner .help {
	float: none;
}

@media screen and (min-width: 1220px) {
	.h_logo .inner .help {
		margin-right: 20px;
	}
}

.h_logo .inner .help img {
	width: 26px;
}

.h_logo .inner .member {
	float: none;
}

.h_logo .inner .member img {
	width: 43px;
	padding-top: 10px;
}

.top .h_logo .inner .to_back img {
	display: none;
}

.top .h_logo .inner .logout {
	display: none;
}

.index_login_button a {
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 200px;
	font-size: 1.8rem;
}

/*ページタイトル*/

.page_title01 {
	padding: 5px 10px;
	text-align: center;
	background-color: #0070c0;
	color: #ffffff;
	font-size: 20px;
	font-size: 2rem;
}

.page_title02 {
	padding: 5px 10px;
	text-align: center;
	background-color: #0070c0;
	color: #ffffff;
	font-size: 1.4rem;
}

.boxcolor01 {
	background: #ffffff;
	color: #000;
}

.button01 {
	text-align: center;
	font-size: 20px;
	padding: 10px;
	position: relative;
	background: #0070c0;
	border-radius: 5px;
	width: 100%;
	display: inline-block;
	box-shadow: 1px 1px 4px 0px #000000;
}

.button01:after {
	position: absolute;
	content: '';
	background-image: url(/img/common/arrow-right.png);
	width: 12px;
	top: 13px;
	right: 12px;
	height: 20px;
	background-size: cover;
	background-repeat: no-repeat;
}

.button01.l02:after {
	top: 28px;
}

.button02 {
	text-align: center;
	font-size: 20px;
	padding: 10px 30px;
	position: relative;
	background: #919191;
	color: #ffffff;
	border-radius: 5px;
	display: inline-block;
}

.button03 {
	width: 40%;
	max-width: 200px;
	display: inline-block;
	background-color: #0070c0;
	text-align: center;
	padding: 8px;
	color: #ffffff;
	border-radius: 5px;
}

.button04 {
	width: 40%;
	max-width: 200px;
	display: inline-block;
	background-color: #ff3333;
	color: #ffffff;
	text-align: center;
	padding: 8px;
	font-size: 16px;
	border-radius: 5px;
}

.button05 {
	text-align: center;
	font-size: 28px;
	padding: 30px 10px;
	position: relative;
	background: #0070c0;
	border-radius: 5px;
	width: 100%;
	display: inline-block;
	box-shadow: 1px 1px 4px 0px #000000;
}

.button06 {
	text-align: center;
	font-size: 28px;
	padding: 30px 10px;
	position: relative;
	background: #0070c0;
	border-radius: 5px;
	width: 90%;
	max-width: 460px;
	margin-left: auto;
	margin-right: auto;
	display: inline-block;
	box-shadow: 1px 1px 4px 0px #000000;
}

.button06_dis {
	text-align: center;
	font-size: 28px;
	padding: 30px 10px;
	position: relative;
	background: #666666;
	border-radius: 5px;
	width: 90%;
	max-width: 460px;
	margin-left: auto;
	margin-right: auto;
	display: inline-block;
	box-shadow: 1px 1px 4px 0px #000000;
}

.big_button01 {
	border-radius: 20px;
	background-image: -moz-linear-gradient(90deg, rgb(22, 44, 86) 0%, rgb(21, 58, 136) 100%);
	background-image: -webkit-linear-gradient(90deg, rgb(22, 44, 86) 0%, rgb(21, 58, 136) 100%);
	background-image: -ms-linear-gradient(90deg, rgb(22, 44, 86) 0%, rgb(21, 58, 136) 100%);
	display: flex;
	justify-content: space-between;
	padding: 20px;
	min-height: 110px;
}

.big_button01 .label {
	width: 65%;
	font-size: 20px;
	line-height: 1.2em;
	display: flex;
	align-items: center;
}

.big_button01 .icon {
	width: 30%;
}

.big_button_wrap .big_button01 .icon img {
	opacity: 0.5;
}

.view_timeline_button {
	margin-top: 20px;
	display: inline-block;
	text-decoration: underline;
}

#main_contents {
	font-size: 1.2rem;
}

.member .name {
	margin-top: 15px;
	color: #000000;
	background: #bed3ff;
	font-size: 20px;
	border-radius: 5px;
	padding: 10px;
	display: inline-block;
	width: 100%;
	text-align: center;
	padding: 5px 10px;
	text-align: center;
	font-size: 2rem;
}

/*フッター*/

#footer {
	margin-top: auto;
	padding: 30px 0;
	background-color: #212329;
	color: #fff;
	width: 100%;
}

#footer a {
	color: #fff;
}

#foot_nav .f_nav_list {
	text-align: center;
	font-size: 1.2rem;
}

#foot_nav .f_nav_list li {
	padding: 0 10px;
	display: inline-block;
}

#foot_nav .f_nav_list li a:hover {
	text-decoration: underline;
}

.copyright {
	margin-top: 10px;
	text-align: center;
	font-size: 15px;
}

/*共通部分ー*/

#wrapper {
	width: 100%;
	margin: 0 auto;
	padding: 0;
}

.err input[type='text'],
.err input[type='number'],
.err select {
	border: 1px solid #ff0000 !important;
}

/*----------------------------------------------------
	メインビジュアル
----------------------------------------------------*/

#main_visual {
	margin: 10px auto;
	/*background-color: #9a9a9a;*/
	text-align: center;
}

#main_visual img {
	max-width: 700px;
	width: 100%;
	max-height: 400px;
	object-fit: contain;
}

#main_visual img.noimage {
	max-width: 260px;
	width: 100%;
}

.sign_up_btn {
	display: block;
	width: 80%;
	padding: 5px 0;
	text-align: center;
	background-color: #0070c0;
	font-size: 20px;
	font-size: 2rem;
	border-radius: 5px;
	margin: 0 auto;
}

.sign_up_btn span {
	background: url('../img/common/plus-circle.png') no-repeat left center;
	background-size: 20px;
	padding-left: 35px;
	line-height: 20px;
	display: inline-block;
	height: 20px;
}

.tab-area {
	margin-top: 10px;
	display: -webkit-flex;
	display: flex;
	justify-content: space-between;
	cursor: pointer;
}

.tab-area .tab {
	width: 23%;
	height: 36px;
	line-height: 36px;
	text-align: center;
	color: #474747;
	background-color: #9a9a9a;
	border-radius: 5px;
	font-size: 13px;
	font-size: 1.3rem;
	-webkit-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

.tab-area .tab:hover {
	background-color: #eee;
}

.tab-area .tab.active {
	background-color: #0070c0;
	color: #fff;
	border: 1px solid #fff;
}

.content-area {
}

.content-area .content {
	display: none;
}

.content-area .content.show {
	margin-top: 10px;
	display: block;
}

.timeline_button_wrap {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 20px;
}

.timeline_button_wrap a {
	width: 30%;
	font-size: 1.6rem;
	display: block;
}

.timeline_data .date {
	font-size: 20px;
	font-size: 2rem;
	font-weight: 600;
}

.timeline_data .data {
	margin: 10px 0 10px 20px;
	padding-left: 30px;
	border-left: 4px solid #fff;
}

.timeline_data .data table {
	border-radius: 10px;
	overflow: hidden;
}

.timeline_data .data table th {
	border-bottom: none;
	width: 80px;
	min-width: 80px;
	padding: 10px 5px;
	text-align: center;
	line-height: 2;
	font-size: 1rem;
}

.timeline_data .data table th.refueling {
	font-size: 1.2rem;
}

.timeline_data .data table th img {
}

.timeline_data .data table td {
	padding: 5px 10px;
	border-bottom: 2px solid #9a9a9a;
	border-right: 2px solid #9a9a9a;
}

.timeline_data .data table td.bb_none {
	border-bottom: none;
}

.timeline_data .data table td.br_none {
	border-right: none;
}

.mylist_data_pc {
	display: none;
	margin-top: 20px;
}

.mylist_data_pc li {
	margin-bottom: 20px;
	background-color: #002565;
}

.mylist_data_pc li .img {
	float: left;
	width: 50%;
	background-color: #9a9a9a;
}

.mylist_data_pc li .data {
	float: right;
	width: 50%;
	padding: 25px 15px;
}

.mylist_data_pc li .data .title {
	padding-bottom: 10px;
	border-bottom: solid 2px #fff;
	font-size: 18px;
	font-size: 1.8rem;
}

.mylist_data_pc li .data dl {
	padding: 15px 0;
	border-bottom: solid 2px #fff;
}

.mylist_data_pc li .data dl.refueling dt {
	padding: 5px 0 5px 45px;
	margin-bottom: 5px;
	background: url('../img/common/gas-station.png') no-repeat left center;
	background-size: contain;
	font-weight: 600;
}

.mylist_data_pc li .data dl.maintenance dt {
	padding: 5px 0 5px 45px;
	margin-bottom: 5px;
	background: url('../img/common/wrench.png') no-repeat left center;
	background-size: contain;
	font-weight: 600;
}

.mylist_data_pc li .data dl dd {
	padding-left: 40px;
}

.mylist_data_pc li .data .more_btn {
	display: inline-block;
	padding: 8px;
}

.mylist_data_sp {
	position: relative;
}

.mylist_data_sp li {
	margin-bottom: 10px;
	background-color: #002565;
	position: relative;
}

.mylist_data_sp li .title {
	padding: 10px;
	font-size: 14px;
	font-size: 1.4rem;
	font-weight: 600;
}

.mylist_data_sp li .data {
	margin-top: 10px;
}

.mylist_data_sp li .data dl {
	font-size: 14px;
	font-size: 1.4rem;
}

.mylist_data_sp li .data dl dt {
	float: left;
}

.mylist_data_sp li .data dl dd {
	padding-left: 80px;
}

.mylist_data_sp li .data_wrap .img.noimage {
	background-color: #cccccc;
}

.mylist_data_sp li .data_wrap .img a img {
	max-height: 240px;
	object-fit: contain;
}

.mylist_data_sp li .favorite_btn {
	position: absolute;
	width: 40px;
	height: 40px;
	right: 5px;
	bottom: 5px;
}

span.required {
	color: #ff0000;
}

input[type='text'] {
	outline: none;
	background: none;
}

input[type='text'],
input[type='email'],
input[type='tel'],
input[type='number'],
textarea {
	border-radius: 0;
	border: 1px solid #919191;
	padding: 6px 1.2%;
	width: 100%;
	outline: none;
}

input[type='number']::-webkit-outer-spin-button,
input[type='number']::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

input[type='number'] {
	-moz-appearance: textfield;
}

.register_table dt {
	margin-bottom: 5px;
	font-weight: 600;
	font-size: 13px;
	font-size: 1.3rem;
}

.register_table dd {
	margin-bottom: 10px;
}

.register_table dd.date_wrap {
	display: -webkit-flex;
	display: flex;
	justify-content: flex-start;
	align-items: center;
}

.register_table dd.date_wrap span {
	padding: 0 15px 0 5px;
}

.register_table dd .other_imput {
	margin-top: 8px;
}

.cp_ipselect {
	overflow: hidden;
	width: 100%;
	text-align: center;
}

.cp_ipselect.year {
	width: 45%;
}

.cp_ipselect.month,
.cp_ipselect.date {
	width: 25%;
}

.cp_ipselect select {
	width: 100%;
	padding-right: 1em;
	cursor: pointer;
	text-indent: 0.01px;
	text-overflow: ellipsis;
	border: none;
	outline: none;
	background: transparent;
	background-image: none;
	box-shadow: none;
	-webkit-appearance: none;
	appearance: none;
}

.cp_ipselect select::-ms-expand {
	display: none;
}

.cp_ipselect.cp_sl01 {
	position: relative;
	border: 1px solid #707070;
	background: #ffffff;
}

.cp_ipselect.cp_sl01::before {
	position: absolute;
	top: 1em;
	right: 0.9em;
	content: '';
	width: 8px;
	height: 8px;
	border-top: 2px solid #000;
	border-right: 2px solid #000;
	-webkit-transform: rotate(135deg);
	transform: rotate(135deg);
}

.cp_ipselect.cp_sl01 select {
	padding: 8px 38px 8px 8px;
	color: #666666;
}

.form_section_header {
	margin-bottom: 10px;
	box-shadow: 0 2px 4px gray;
}

.step .progress {
	max-width: 500px;
	margin: 10px 0;
}

.step .progress img {
	display: inline-block;
	max-width: 88%;
	margin-right: 12px;
}

.step .progress span {
	color: #003bb3;
	font-weight: 600;
}

.form_section.disappear {
	display: none;
}

.form_section.page-enter {
	-webkit-animation: fadein 1.5s ease-out;
}

.form_section.page-leave {
	-webkit-animation: fadeout 0.4s ease-out;
}

.form_section .form_section__btn ul {
	text-align: center;
}

.form_section .form_section__btn ul li {
	display: inline-block;
	width: 48%;
	max-width: 240px;
}

.form_section .fas a {
	width: 100%;
	display: inline-block;
	background-color: #003bb3;
	text-align: center;
	padding: 8px;
	border-radius: 5px;
	box-shadow: 0 1px 4px grey;
	font-size: 16px;
}

.form_section .fas.back_button a {
	background-color: #0070c0;
}

@-webkit-keyframes fadein {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@-webkit-keyframes fadeout {
	0% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

.file_wrap {
	max-width: 375px;
	display: -webkit-flex;
	display: flex;
	justify-content: space-between;
}

label.file {
	background: url('../img/common/plus_img.png') no-repeat center;
	background-size: 30px;
	background-color: #efefef;
	border: solid 1px #707070;
	color: #fff;
	cursor: pointer;
	display: inline-block;
	width: 96px;
	height: 98px;
}

label.file img {
	width: 96px;
	height: 96px;
	object-fit: cover;
	font-family: 'object-fit: cover;';
}

label.file input {
	display: none;
}

label.file div {
	position: relative;
}

label.file div .img_del_btn {
	position: absolute;
	top: 2px;
	right: 5px;
}

.main_visual {
	margin: 0 auto;
	margin-top: 10px;
	max-height: 500px;
}

.slick-slide img {
	display: block;
	margin: 0 auto;
	max-height: 500px;
}

.slick-track {
	/* 追加 */
	display: flex;
	align-items: center;
}

.slick-dots li button:before {
	opacity: 1;
	color: #606060;
}

.slick-dots li.slick-active button:before {
	opacity: 1;
	color: #ffffff;
}

.slick-dotted.slick-slider {
	margin-bottom: 40px;
}

.slick-prev {
	left: 0px;
	z-index: 2;
}

.slick-next {
	right: 2px;
}

.members_btn {
	position: fixed;
	bottom: 60px;
	right: 10px;
	z-index: 99;
	width: 18%;
}

#ex1 {
	padding: 0;
}

/**Members Card*/

.members_card {
	padding-bottom: 40px;
}

.members_card .title {
	background: #9a9a9a;
	color: #000000;
	font-size: 20px;
	font-weight: bold;
	padding: 10px 0px;
	text-align: center;
	border-radius: 8px 8px 0 0;
}

.members_card .head {
	background: #0070c0;
	color: #ffffff;
	font-size: 20px;
	font-weight: bold;
	padding: 0px 0px;
	text-align: left;
	min-height: 150px;
}

.members_card .head img {
	width: 140px;
}

.members_card .qr {
	border: 0px solid #0070c0;
	margin-top: -80px;
	width: 160px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 0px;
	min-height: 180px;
	background: #ffffff;
}

.members_card .qr canvas {
	max-width: 100%;
}

.members_card .qr_time {
	color: #000000;
	margin-bottom: 20px;
	font-size: 16px;
}

.members_card .name {
	color: #000000;
	background: #bed3ff;
	text-align: center;
	margin-bottom: 20px;
	border-radius: 5px;
	padding: 5px 0;
}

.members_card .name span {
	font-size: 20px;
}

.members_card .pw {
	padding: 0 20px;
	box-sizing: border-box;
}

.members_card .pw .link {
	padding: 0 2px;
	box-sizing: border-box;
}

.members_card .status {
	background: #183074;
	text-align: center;
	margin-bottom: 10px;
	border-radius: 5px;
	font-size: 19px;
	color: #ffffff;
	padding: 5px 0;
}

.status_link {
	margin-bottom: 10px;
}

.status_link a {
	color: #333333;
	text-decoration: underline;
}

.stamp_button {
	text-align: center;
	font-size: 15px;
	padding: 10px;
	position: relative;
	background: #bed3ff;
	border-radius: 5px;
	width: 100%;
	display: inline-block;
	box-shadow: 1px 1px 4px 0px #000000;
	color: #000000;
}

.stamp_button:after {
	position: absolute;
	content: '';
	background-image: url(/img/common/arrow-right_b.png);
	width: 12px;
	top: 13px;
	right: 12px;
	height: 20px;
	background-size: cover;
	background-repeat: no-repeat;
}

.stamp_button.nonlink:after {
	position: absolute;
	content: '';
	background-image: none;
}

.stamp_button img {
	width: 24px;
	vertical-align: text-bottom;
}

.stamp_button span {
	font-size: 20px;
	margin-left: 10px;
}

.loyalty_div .status {
	background: #183074;
	text-align: center;
	margin-bottom: 20px;
	border-radius: 5px;
	font-size: 19px;
	color: #ffffff;
	padding: 5px 0;
}

.shopstatus .status {
	padding: 5px 15px;
	border-radius: 5px;
	margin-left: 15px;
}

.shopstatus .status img {
	max-width: 100px;
}

.members_card.Blue .head,
.members_card.Blue .status,
.loyalty_div.Blue .status {
}

.shopstatus .status.Blue {
	background: url('../img/common/bg_blue.png');
	background-size: 100% 100%;
}

.members_card.Gold .head,
.members_card.Gold .status,
.loyalty_div.Gold .status,
.shopstatus .status.Gold {
	background: url('../img/common/bg_gold.png');
	background-size: 100% 100%;
}

.members_card.Bronze .head,
.members_card.Bronze .status,
.loyalty_div.Bronze .status,
.shopstatus .status.Bronze {
	background: url('../img/common/bg_bronze.png');
	background-size: 100% 100%;
}

.members_card.Silver .head,
.members_card.Silver .status,
.loyalty_div.Silver .status,
.shopstatus .status.Silver {
	background: url('../img/common/bg_silver.png');
	background-size: 100% 100%;
}

.members_card.Platinum .head,
.members_card.Platinum .status,
.loyalty_div.Platinum .status,
.shopstatus .status.Platinum {
	background: url('../img/common/bg_platinum.png');
	background-size: 100% 100%;
}

/*Members Card**/

.home_data {
}

.home_data .title {
	background-color: #002565;
	color: #ffffff;
	padding: 5px 5px;
	text-align: left;
	font-size: 15px;
}

.home_data .body {
	position: relative;
	background-size: contain;
	min-height: 240px;
	background-position: center;
	background-repeat: no-repeat;
}

.home_data .body.noimage {
	position: relative;
	background-size: contain;
	min-height: 240px;
	background-color: #cccccc;
	background-position: center -45px;
	background-repeat: no-repeat;
}

.home_data .body .data {
	background-color: #000000b8;
	bottom: 0px;
	position: absolute;
	width: 100%;
	left: 0px;
	display: flex;
	justify-content: flex-start;
	padding: 5px 0;
}

.home_data .body .data dl {
	border-right: 1px solid #ffffff;
	padding: 5px 10px;
}

.home_data .body .data dl:last-child {
	border-right: 0px solid #ffffff;
	margin-bottom: 0;
}

.home_data .body .data span {
	font-size: 22px;
	font-weight: bold;
}

.register_table dd.mileage {
	position: relative;
}

.register_table dd.mileage input {
	padding-right: 30px;
}

.register_table dd .km {
	position: absolute;
	right: 10px;
	top: 7px;
	font-size: 12px;
	font-size: 1.2rem;
}

.toggleButton {
	position: relative;
	text-align: left;
	padding: 10px 72px 10px 10px;
	background-color: #002565;
	font-size: 13px;
	font-size: 1.3rem;
	word-break: break-all;
}

.toggleContent {
	display: none;
	text-align: center;
	background: #cccccc;
}

.toggleButton:before {
	display: block;
	content: '';
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	width: 0;
	height: 0;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
	border-top: 8px solid #fff;
}

.toggleButton.open:before {
	top: 43%;
	transform: rotate(180deg);
}

.toggleButton:after {
	display: block;
	content: 'Photo';
	position: absolute;
	top: 25%;
	color: #ffffff;
	right: 32px;
}

.membertoggleButton {
	position: relative;
	text-align: left;
	padding: 10px 72px 10px 10px;
	background-color: #002565;
	font-size: 13px;
	font-size: 1.3rem;
	word-break: break-all;
	cursor: pointer;
}

.membertoggleButton:before {
	display: block;
	content: '';
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	width: 0;
	height: 0;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
	border-top: 8px solid #000;
}

.membertoggleButton.open:before {
	top: 43%;
	transform: rotate(180deg);
}

.membertoggleContent {
}

.h3_01 {
	background-color: #002565;
	color: #ffffff;
	font-size: 4rem;
	text-align: center;
	padding: 20px 0;
}

/*refueling_register*/

.flexb {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.flexa {
	display: flex;
	justify-content: space-around;
	align-items: center;
}

.bike_title {
	background-color: #002565;
	color: #ffffff;
	font-weight: bold;
	padding: 7px 10px;
	margin: 15px 0;
}

.dl_box {
	background-color: #ebf2ff;
	margin: 0 -10px;
	padding: 10px;
}

.dl_box input {
	background: #ffffff;
}

.register_table .border {
	margin-left: 50px;
	position: relative;
}

.register_table .border:before {
	content: '';
	border-left: 4px solid #002565;
	position: absolute;
	width: 4px;
	height: 100%;
	left: -25px;
}

.register_table label {
	font-size: 1.4rem;
}

.register_table table.data_table {
	font-size: 1.4rem;
	background: #ffffff;
}

.register_table table.data_table th {
	font-size: 1.4rem;
	background: #ffffff;
	color: #000000;
	vertical-align: middle;
	width: 33%;
	border-right: 1px solid #cccccc;
	border-bottom: 1px solid #cccccc;
}

.register_table table.data_table td {
	font-size: 1.4rem;
	background: #ffffff;
	border-bottom: 1px solid #cccccc;
}

.register_table table.data_table .bg02 th,
.register_table table.data_table .bg02 td {
	background: #ebf2ff;
}

.register_table table.data_table .photo a {
	display: block;
	width: 29vw;
	height: 29vw;
	max-width: 30%;
}

.register_table table.data_table .photo a img {
	object-fit: cover;
	width: 100%;
	height: 100%;
}

.migration_wrap .button02 {
	text-align: center;
	font-size: 1.4rem;
	padding: 10px 30px;
	position: relative;
	background: #919191;
	color: #ffffff;
	border-radius: 5px;
	display: inline-block;
}

.modal .migrate {
	color: #333333;
	font-size: 1.4rem;
}

.modal .migrate .title {
	border: solid 1px #0e3084;
	outline: solid 5px #0e3084;
	outline-offset: 3px;
	width: 95%;
	margin-left: auto;
	margin-right: auto;
	padding: 5px;
	font-size: 1.6rem;
	text-align: center;
	color: #333333;
	font-weight: bold;
}

.modal .migrate .title img {
	width: 60%;
}

.modal .migrate strong {
	font-weight: bold;
}

.blocker {
	z-index: 100 !important;
}

.faq_title {
	font-size: 2rem;
	font-weight: bold;
}

.faq {
	margin-bottom: 20px;
	font-size: 1.6rem;
	padding-left: 10px;
	padding-right: 10px;
}

.faq dt {
	color: #002565;
	margin-bottom: 0px;
	font-weight: bold;
}

.faq dd {
	color: #000000;
	font-size: 1.4rem;
	padding-left: 2em;
	text-indent: -2em;
	margin-left: 3px;
}

.faq dt:before {
	content: 'Q：';
	margin-right: 5px;
}

.faq dd:before {
	content: 'A：';
	margin-right: 5px;
}

.memberinfo {
	width: 100%;
	margin: 20px auto;
}

.memberinfo dl {
	display: flex;
	justify-content: space-between;
	font-size: 1.6rem;
	margin-bottom: 10px;
	padding: 0 20px;
	box-sizing: border-box;
}

.memberinfo dl dt {
	text-align: left;
	width: 50%;
	font-weight: bold;
}

.memberinfo dl dd {
	text-align: left;
	width: 50%;
	word-break: break-all;
}

.loading {
	width: 100vw;
	height: 100vh;
	display: flex;
	justify-content: center;
	align-items: center;
	background: #000000;
	transition: all 0.1s;
	top: -100vh;
	left: 0;
	z-index: 999;
	position: fixed;
}

.loading.active {
	top: 0;
}

.form_section__body {
	margin-bottom: 40px;
}

.register_table {
	margin-bottom: 40px;
}

.loyalty_wrap {
	max-width: 640px;
	margin-left: auto;
	margin-right: auto;
}

.loyalty_wrap article {
	max-width: 640px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 10px;
	padding: 5px;
}

.loyalty_wrap article:nth-child(odd) {
	background: #cccccc;
}

.loyalty_wrap article .flexbox {
	display: flex;
	justify-content: space-between;
}

.loyalty_wrap article .flexbox div {
	font-size: 16px;
	padding: 5px;
	box-sizing: border-box;
}

.loyalty_wrap article .dat {
	width: 50%;
	border-right: 1px solid #999999;
}

.loyalty_wrap article.nodata {
	max-width: 640px;
	background: #ffffff;
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 440px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 10px;
	padding: 5px;
}

.loyalty_wrap article .point {
	width: 50%;
	display: flex;
	justify-content: flex-end;
	align-items: center;
}

.loyalty_wrap article .point img {
	width: 14px;
	margin-right: 3px;
}

.loyalty_wrap article .detail {
	width: 100%;
}

@media screen and (max-width: 1220px) {
	.pc-only {
		display: none !important;
	}

	.inner02 {
		max-width: 1200px;
		padding: 0;
		margin: 0 auto;
	}

	.h_logo .inner .member img {
		width: 36px;
		padding-top: 8px;
		margin-left: 4px;
	}

	.index .mbxl,
	.index.mbxl {
		margin-bottom: 60px;
	}

	.index .mbx2 {
		margin-bottom: 20px;
	}

	.index .flexb {
		display: flex;
		justify-content: space-between;
		align-items: center;
		flex-direction: column;
	}

	.index .flexb.spflexb {
		display: flex;
		justify-content: space-between;
		align-items: center;
		flex-direction: column-reverse;
	}

	.index .flexb .box {
		width: 80%;
		margin-bottom: 60px;
	}

	.index .flexb .box img {
		width: 100%;
	}

	.index .flexb .box.bigtxt p {
		font-size: 16px;
		color: #212329;
		margin-bottom: 20px;
		text-align: center;
	}

	.index .button05 {
		text-align: center;
		font-size: 18px;
		padding: 14px 12px;
		position: relative;
		background: #0070c0;
		border-radius: 5px;
		width: 86%;
		display: inline-block;
		box-shadow: 1px 1px 4px 0px #000000;
		margin: 0px auto;
		display: block;
	}

	.h3_01 {
		background-color: #002565;
		color: #ffffff;
		font-size: 2rem;
		text-align: center;
		padding: 10px 0;
	}

	.h3_01.mbx4 {
		margin-bottom: 20px;
	}

	.timeline_data .data table th {
		width: 94px;
		min-width: 94px;
	}

	.timeline_data .data table td.w5 {
		width: 35%;
		display: block;
		width: 100%;
		border-right: none;
	}

	.timeline_data .data table td.w10 {
		width: 70%;
	}

	.spfs {
		align-items: center !important;
	}

	.spfs10 {
		font-size: 16px;
	}

	.button06 {
		text-align: center;
		font-size: 18px;
		padding: 13px 4px;
		position: relative;
		background: #0070c0;
		border-radius: 5px;
		width: 84%;
		max-width: 460px;
		margin-left: 10px;
		margin-right: 10px;
		display: inline-block;
		box-shadow: 1px 1px 4px 0px #000000;
	}

	#main_contents.campaign div,
	#main_contents.campaign p {
		font-size: 15px;
	}

	.sign_up_btn span {
		padding-left: 24px;
		font-size: 13px;
	}

	#gnav {
		display: none;
	}

	#home #gnav {
		display: block;
	}

	#home #gnav.pc-only {
		display: none;
	}

	.home_data .body {
		min-height: auto;
		background: none !important;
		display: flex;
		justify-content: space-between;
		align-items: center;
		flex-direction: row;
		flex-wrap: nowrap;
	}

	.home_data .body.noimage {
		min-height: 200px;
	}

	.home_data .body .img {
		width: 48%;
		background-color: #cccccc;
	}

	.home_data .body .data {
		position: relative;
		width: 50%;
		flex-direction: column;
	}

	.home_data .body .data dl {
		border-right: 0px solid #ffffff;
	}

	.mylist_data_sp li .data_wrap {
		padding-top: 10px;
		background-color: #000000;
		display: flex;
		justify-content: space-between;
	}

	.mylist_data_sp li .data_wrap .img {
		width: 48%;
	}

	.mylist_data_sp li .data_wrap .data {
		width: 49%;
	}

	.mylist_data_sp li .data_wrap .data .view_timeline_dl dt {
		display: none;
	}

	.mylist_data_sp li .data_wrap .data .view_timeline_dl dd {
		padding-left: 0px;
	}

	.membercard_btn {
		width: 96% !important;
	}

	#header .h_logo {
		min-height: 60px;
	}

	.main_visual {
		margin: 0 auto;
		margin-top: 8px;
		max-height: 500px;
	}

	.slick-slide img {
		display: block;
		margin: 0 auto;
		max-height: 500px;
	}

	.slick-track {
		/* 追加 */
		display: flex;
		align-items: center;
	}

	.slick-dots {
		bottom: -20px;
	}

	.slick-dots li button:before {
		opacity: 1;
		color: #606060;
	}

	.slick-dots li.slick-active button:before {
		opacity: 1;
		color: #ffffff;
	}

	.slick-dotted.slick-slider {
		margin-bottom: 20px;
	}

	.slick-prev {
		left: 0px;
		z-index: 2;
	}

	.slick-next {
		right: 2px;
	}
}

@media screen and (min-width: 1220px) {
	.pcmt {
		margin-top: 20px;
	}

	.pcmb {
		margin-bottom: 20px;
	}

	.w90 {
		width: 90%;
	}

	.section_box .inner {
		max-width: 90%;
		padding: 0;
	}

	.inner02 {
		max-width: 1200px;
		padding: 0;
		margin: 0 auto;
	}

	.inner02 .flexb .box {
		width: 48%;
	}

	.inner02 .flexb .box.bigtxt p {
		font-size: 28px;
		color: #212329;
		margin-bottom: 20px;
	}

	.button05 {
		text-align: center;
		font-size: 28px;
		padding: 30px 10px;
		position: relative;
		background: #0070c0;
		border-radius: 5px;
		width: 100%;
		display: inline-block;
		box-shadow: 1px 1px 4px 0px #000000;
	}

	#header .inner {
		padding-right: 10px;
		padding-left: 10px;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.rev {
		margin-right: auto;
		padding: 10px;
	}

	.rev img {
		width: 120px;
	}

	#header .to_back {
		display: none;
	}

	#header .logo {
		font-size: 18px;
		font-size: 1.8rem;
		position: absolute;
		text-align: center;
		width: 200px;
		display: block;
		z-index: 1;
		top: -7px;
		left: 50%;
		margin-left: -100px;
	}

	#header .logo img {
		max-width: 200px;
	}

	#header .h_logo .inner .logout {
		display: block;
		width: 6%;
	}

	#header .logout {
		display: block;
	}

	.h_logo .inner .help img {
		width: 35px;
	}

	#container {
		max-width: 100%;
	}

	#wrapper {
		max-width: 1920px;
		padding: 20px 50px;
		display: flex;
		flex-flow: row-reverse;
	}

	#gnav {
		padding: 0;
		background: inherit;
		width: 25%;
		margin-left: auto;
	}

	#main_contents {
		width: 72%;
		max-width: 1200px;
		padding: 20px;
	}

	#container.gb_off {
		background-color: #000000;
	}

	.gb_off #main_contents {
		background-color: #fff;
	}

	#gnav .inner {
		padding: 0;
	}

	#gnav .nav_list {
		display: block;
	}

	#gnav .nav_list li {
		width: 100%;
		margin-bottom: 10px;
	}

	#gnav .nav_list li a {
		display: block;
		padding: 20px;
		background: linear-gradient(#162c56, #153a88);
		text-align: left;
		height: auto;
	}

	#gnav .nav_list li a:hover {
		background-color: #444;
	}

	#gnav .nav_list li a img {
		margin-right: 10px;
		width: 60px;
	}

	.page_title01 {
		text-align: left;
	}

	.sign_up_btn {
		width: 60%;
	}

	.member {
		text-align: center;
	}

	.member .name {
		min-width: 100%;
		margin-left: auto;
		margin-right: auto;
		width: fit-content;
		padding: 5px 20px;
	}

	p {
		font-size: 17px;
	}

	.button01 {
		width: 640px;
	}

	.member .button01 {
		width: 60%;
		max-width: 640px;
		min-width: 200px;
	}

	.members_card .button01 {
		width: 60%;
		max-width: 640px;
		min-width: 200px;
	}

	.members_card .link {
		text-align: center;
	}

	.loyalty_div {
		max-width: 640px;
		margin-left: auto;
		margin-right: auto;
	}

	.stamp_button {
		max-width: 640px;
		margin-left: auto;
		margin-right: auto;
	}

	.mylist_data_pc {
		display: block;
	}

	.mylist_data_sp {
		/*        display: none;*/
	}

	.mylist_data_sp .data_wrap {
		display: flex;
		justify-content: flex-start;
		padding: 10px;
	}

	.mylist_data_sp .data_wrap .img {
		width: 49%;
		text-align: center;
	}

	.mylist_data_sp .data_wrap .img img {
		max-height: 270px;
	}

	.mylist_data_sp li {
		position: relative;
	}

	.mylist_data_sp li .data {
		margin-top: 0px;
		margin-left: 20px;
		width: 50%;
	}

	.mylist_data_sp li .data dl {
		font-size: 1.4rem;
		display: flex;
	}

	.mylist_data_sp li .data dl dt {
		font-size: 1.8rem;
		float: none;
		width: 30%;
	}

	.mylist_data_sp li .data dl dd {
		font-size: 1.6rem;
		width: 50%;
		padding-left: 0;
		word-break: break-all;
	}

	.timeline_data .data table th {
		width: 120px;
	}

	.form_section_header {
		box-shadow: none;
	}

	.file_wrap {
		max-width: 500px;
	}

	.form_section .fas a {
		width: 100%;
		display: inline-block;
		background-color: #003bb3;
		text-align: center;
		padding: 15px 8px;
		border-radius: 5px;
		box-shadow: 0 1px 4px grey;
	}

	label.file {
		width: 32%;
		max-width: 150px;
		height: 150px;
	}

	label.file img {
		width: 150px;
		height: 148px;
		object-fit: cover;
		font-family: 'object-fit: cover;';
	}

	.cp_ipselect.cp_sl01::before {
		top: 0.7em;
	}

	.gigya-screen-caption {
		display: none;
	}

	.pc-right {
		width: 30%;
		text-align: right;
		margin-left: auto;
		margin-right: 0;
	}

	.index_login_button a {
		width: 40%;
		margin-left: auto;
		margin-right: auto;
		margin-top: 120px;
		font-size: 1.8rem;
	}

	.home_data .body {
		background: none !important;
		display: flex;
		justify-content: space-between;
	}

	.home_data .body .img {
		width: 55%;
		text-align: center;
	}

	.home_data .body .img img {
		max-height: 297px;
	}

	.home_data .body .img.pc-only.noimage {
		width: 46%;
		background: #cccccc;
		text-align: center;
		margin-left: auto;
		margin-right: auto;
	}

	.home_data .body .data {
		width: 45%;
		position: relative;
		flex-direction: column;
		justify-content: flex-start;
		background-color: #002565;
		padding: 2%;
	}

	.home_data .body .data .title {
		font-size: 20px;
	}

	.home_data .body .data dl {
		border-right: 0px solid #ffffff;
		border-bottom: 1px solid #ffffff;
		padding: 5px 10px;
		font-size: 18px;
		margin-bottom: 30px;
	}

	.home_data .body .data dl dt {
		word-break: break-all;
	}

	.home_data .body .data span {
		font-size: 26px;
		font-weight: bold;
	}

	.home_data .body .data dl:last-child {
		border-bottom: 0px solid #ffffff;
	}

	.big_button_wrap {
		display: flex;
		justify-content: center;
	}

	.big_button_wrap .big_button01 {
		border-radius: 20px;
		background-image: -moz-linear-gradient(90deg, rgb(22, 44, 86) 0%, rgb(21, 58, 136) 100%);
		background-image: -webkit-linear-gradient(90deg, rgb(22, 44, 86) 0%, rgb(21, 58, 136) 100%);
		background-image: -ms-linear-gradient(90deg, rgb(22, 44, 86) 0%, rgb(21, 58, 136) 100%);
		display: flex;
		justify-content: space-between;
		padding: 20px;
		height: 260px;
		width: 260px;
		flex-direction: column;
		margin-right: 40px;
	}

	.big_button_wrap .big_button01 .label {
		width: 100%;
		font-size: 20px;
		line-height: 1.2em;
		display: flex;
		align-items: center;
	}

	.big_button_wrap .big_button01 .icon {
		width: 100%;
		text-align: right;
	}

	.big_button_wrap .big_button01 .icon img {
		width: 70%;
		opacity: 0.5;
	}

	.big_button_wrap .big_button01:hover .icon img {
		opacity: 1;
	}

	.register_table table.data_table .photo a {
		width: 30%;
		height: 30%;
		max-width: 30%;
	}

	.migration_wrap {
		max-width: 50%;
		margin-left: auto;
		margin-right: auto;
	}

	.migration_wrap .register_table dt {
		text-align: left;
	}

	.modal .migrate .title {
		width: 60%;
	}

	.timeline_data .data table td.w5 {
		width: 41%;
	}

	.timeline_data .data table td.w10 {
		width: 82%;
	}

	.memberinfo {
		width: 60%;
		margin: 20px auto;
		border: 1px solid #002565;
		padding: 20px 40px;
	}

	.memberinfo dl {
		display: flex;
		justify-content: space-between;
		font-size: 1.6rem;
		margin-bottom: 10px;
	}

	.memberinfo dl dt {
		text-align: left;
		width: 30%;
		font-weight: bold;
	}

	.memberinfo dl dd {
		text-align: left;
		width: 69%;
	}

	#main_contents.campaign div,
	#main_contents.campaign p {
		font-size: 17px;
	}
}
