@charset "utf-8";
/* CSS Document */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
common
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.join__cont {margin: 0 -5vw;}
.join__cont .join__inrCont {padding: 20px 5vw;}
.join__cont .join__inrCont .btn_customer {margin: 20px auto;}

.bicycle_body {border: 2px solid var(--c-base); background: #fff; padding: 20px 15px; border-radius: 10px; font-weight: 600; color: #555; font-size: 15px; text-align: center; margin: 30px auto 0;}
.join__strong {color: var(--c-red); font-size: 18px; margin: 8px 0;}
.join__strong span{display: inline-block;  background:linear-gradient(transparent 60%, #ff6 60%);}
.tel_request {margin-top:20px;}

@media (min-width: 768px) {
 .join__flex{display: flex; display: -webkit-flex; column-gap: 30px; }
 .join__cont {flex: 1; margin: 0; background: #fff;}
 .join__cont .join__inrCont {padding: 40px;}
 .join__cont .join__inrCont .btn_customer li {width: 100%; margin: 0;}
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

print

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.bgOrange {background: var(--c-base); color: #fff; text-align: center; position: relative; padding: 20px 20px 0; font-size: 18px; margin-bottom: 60px;}
.bgOrange::before { content: ""; position: absolute; left: 0; bottom: 1px; width: 100%; height: 40px;  background: var(--c-base); clip-path: polygon(0 0, 100% 0%, 50% 100%); transform: translateY(100%);}

.entry_exp_det { padding:20px; border: 1px solid #F77C00; background-color: #fff; border-radius: 6px; color: #444; font-size: 13px; line-height: 18px;}
.entry_exp_det h5 {font-weight: 600; font-size: 16px; margin-bottom: 10px;}
.entry_exp_det h5:not(:first-child) {margin-top: 20px;}
.entry_exp_det h6 {margin: 15px auto 5px; font-weight: 600; font-size: 14px;}
.entry_exp_det p, .entry_exp_det ul {margin-bottom: 1em;}
.entry_exp_det a {text-decoration: underline;}

.exp_entry_det3 {display: none;}
.exp_entry_next{	font-weight:bold;	font-size:16px;	color:#444;		width:200px;	padding:10px;	background:#fff;	border-radius:5px;	text-align:center;		border:1px solid var(--c-base);		margin:20px auto 6px;	box-shadow: 0 0px 5px 0 #999999; cursor: pointer;}

.privacy_check {margin: 30px auto 0; text-align: center; font-weight: 600;}

label.checkbox {position: relative;}
.fire_checkbox .request_check {appearance:none; width: 20px; height: 20px; border: 1px solid var(--c-base);	 background: #fff; border-radius: 3px; transform: translateY(4px); margin-right: 5px;}

.check_indent {padding-left: 2em; text-indent: -2em; margin: 5px 0;}
.fire_checkbox .request_check:checked:before {
 content: '';
 position: absolute;
 top: 47%;
 left: 5px;
 display: block;
 margin-top: -8px;
 width: 8px;
 height: 12px;
 border-right: 3px solid var(--c-base);
 border-bottom: 3px solid var(--c-base);
 transform: rotate(45deg);
 z-index: 1;
}

.submit_btn_form {margin: 20px auto;}
.submit_btn_form li {margin: 10px auto;}
.submit_btn_form li button {display: block; width: 100%; border-radius: 5px; color: #fff; font-weight: bold; font-size: 15px; text-align: center;
 border-style: none; padding: 13px 5px;
 background: linear-gradient(to bottom, #bbb 0%, #999999 56%, #969696 100%);
 box-shadow: 0 0 0 1px #797979 inset, 0 0 0 2px #eee inset, 0 0px 5px 0px #999999;
}
.submit_btn_form li button.active {
  background:linear-gradient(to bottom, #82D2E1 0%, #3C8CA5 56%, #3C8CA5 100%);
  box-shadow: 0 0 0 1px #3C8CA5 inset, 0 0 0 2px #B1CED7 inset, 0 0px 5px 0px #999999;
}

@media (min-width: 768px) {
.bgOrange {width: 100%; max-width: 1000px; margin: 0 auto 70px; padding: 30px 10px 10px; font-size: 22px;}
.submit_btn_form {display: flex; display: -webkit-flex; justify-content: space-between; flex-wrap: wrap;}
.submit_btn_form li {width: 48%; margin: 10px 0;}

}