@charset "utf-8";

html{
  scroll-behavior: smooth; // スムーススクロール
}

label, input[type='checkbox'] {
    cursor: pointer;
}

br.sp_br {
	display: none;
}

/* override elmc@202603 */
@media screen and (max-width: 576px) {
	.modal_merchantsearch {
		max-height: unset;
		min-height: unset;
		max-width: 90%;
		min-width: 90%;
		padding:1em;
	}
	.modal_merchantsearch .cargo_text_center{
		margin:3em .5em;
		font-size:105%;
	}
	.modal_buttonline{
		margin:1em auto;
	}
}



@media screen and (max-width: 959px) {
	.wrapper {
	width: 100%;
	margin: 0 auto 100px;
	padding: 20px 20px;
	}
	.wrapper.fixed {
	}
	br.sp_br {
	display: inline;
	}
	br.pc_br {
	display: none;
	}
}


/*フッタ　未使用*/
.cargo_footer {
	background-color:#f0f0f0;
	text-align:center;
	padding:50px;
	color:#ccc;
}
.cargo_footer p{
	font-size:1.2rem;
}


/*トップページ*/
h2.cargo_title {
	margin: 0 0 20px 0;
	color: #fff;
	padding: 18px 15px 16px 75px;
	font-size: 2rem;
	/*background-color: #0A83DE;*/
	background-color: #9ed154;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	-ms-border-radius: 2px;
	border-radius: 2px;
/*	background-image: url(../img/icon_pc.png), url(../boarding_info/img/icon_minus.png);*/
	background-image: url(../img/icon_pc.png);
	background-repeat: no-repeat;
	background-size: 40px 34px, 20px 20px;
	background-position: 20px 50%, 97% 50%;
}


/*同意チェックボックス、予約ボタン　ここから*/
.cargo_agree_checkbox {
	text-align:center;
	border:1px solid #ccc;
}
.cargo_agree_checkbox label {
	margin:20px 0 0 0; 
	font-weight:bold;
}
.cargo_reservation_btn {
	text-align:center; 
	margin:40px 0 40px 0;
}

.button_agree_blue {
	margin:0 10px 40px 10px; 
	background-color:#115eb3;  
	border-color:#115eb3;
	cursor: pointer;
}
.button_agree_skyblue {
	font-size:1.7rem;
	margin:0 10px 10px 10px; 
	background-color:#54c3f1;  
	border-color:#54c3f1;
	cursor: pointer;
}
.button_agree_green{
	margin:0 10px 40px 10px; 
	background-color:#83b449;  
	border-color:#83b449;
	cursor: pointer;
}
.button_agree_gray{
	font-size:1.7rem;
	margin:0 10px 10px 10px; 
	background-color:#9ed154;  
	border-color:#9ed154;
	cursor: pointer;
}

.disabled {
	/*display:none;*/
	pointer-events: none; /* クリック無効化 */
	color: #999;  /* 無効化した状態での色 */
	background-color:#f0f0f0; 
	border-color:#f0f0f0;
	text-decoration: none;
}
/*同意チェックボックス、予約ボタン　ここまで*/


/*トップページ　テキストエリア*/

.cargo_toppage_textarea h3 {
	margin: 0 0 20px 0;
	color: #fff;
	padding: 5px 5px 4px 15px;
	font-size: 1.6rem;
	/*background-color: #0A83DE;
	background-color: #54c3f1;*/
	background-color: #9ed154;
}

.cargo_toppage_textarea h4 {
	font-size: 1.6rem;
	line-height:1.5;
	position: relative;
	padding-left: 25px;
	color: #000;
}
.cargo_toppage_textarea h4:before {
	position: absolute;
	content: "";
	top: 10px;
	left: 0;
	margin: auto;
	background-image: url(../img/icon_2tones_green.png);
	background-repeat: no-repeat;
	background-position: 0;
	background-size: 16px 4px;
	width: 16px;
	height: 4px;
}

.redText {
	color: #dd0000;
	font-family:sans-serif;
	font-weight:bold;
}

.cargo_caption_gray_box {
	background-color:#f0f0f0; 
	margin:10px 0 0 0; 
	padding:15px 30px; 
	line-height:1.5;
}

ul.cargo_document li {
	display: inline-block;
	margin:10px 0;
}
@media screen and (max-width: 959px) {
	ul.cargo_document li {
	display: block;
	}

	ul.cargo_document li img {
	width:100%;
	}

	p.numberImage img {
	width:100%;
	}
}

ul.cargo_dial li {
	display: inline-block;
}


.boarding_info_inner__block__box__truckDial dt {
	font-weight: bold;
}
.boarding_info_inner__block__box__truckDial dd li {
	display: inline-block;
}
ul.cargo_dial li:before {
	content: "/";
	padding: 0 5px;
}
ul.cargo_dial li:first-child:before {
	content: "";
}


ul.cargo_list {
	margin-top:8px;
}
ul.cargo_list li {
	background:url(../img/triangle-right.png) no-repeat 3px 8px; 
	background-size:6px; 
	line-height:1.5; 
	padding-left:1em; 
	padding-bottom:0.75em;
}



@media screen and (max-width: 959px) {
	ul.cargo_dial li {
	display: block;
	}
	ul.cargo_dial li:before {
	content: "";
	padding: 0;
	}
}

p.cargo_more-link {
	border:1px solid #54c3f1;
	margin:0 0 30px 0;
	width:320px;
	text-align:center;
	font-weight:bold;
	background-image: url(../img/triangle-right-blue.png);
	background-repeat: no-repeat;
	background-position: 10px center;
	background-size: 8px auto;
}
a.cargo_more-link {
	display:block;
	padding:8px;
	text-decoration:none;
}
@media screen and (max-width: 959px) {
	p.cargo_more-link {
	width:100%;
	}
}

table.cargo_carsize {
	border-top:1px solid #ccc;
	width:auto; margin:15px 0 0 0;
}
table.cargo_carsize th {
	border-top:0px solid #ccc;
	padding:10px 15px;
	font-size:1.5rem;
	line-height:1.2;
}
table.cargo_carsize td {
	padding:10px 15px;
	line-height:1.2;
}
table.cargo_carsize td.center {
	text-align:center;
}
@media screen and (max-width: 959px) {
	table.cargo_carsize {
	width:100%;
	}
	table.cargo_carsize th {
	padding:10px 5px;
	}
	table.cargo_carsize td {
	padding:10px 5px;
	}
}


/*空席案内*/
div.cargo_calender {
	width:49%;
}
div.cargo_calender_left {
	float:left;
}
div.cargo_calender_right {
	float:right;
}
div.cargo_calender h4 {
	text-align:center;
	font-weight:bold;
	border-top:1px solid #ccc;
	border-left:1px solid #ccc;
	border-right:1px solid #ccc;
	padding:3px;
	font-size:1.7rem;
	background: #f2f2f8;
}
div.cargo_calender th {
	text-align:center;
	font-weight:bold;
	border-right:1px solid #ccc;
	border-bottom:3px double #ccc;
	padding:3px;
}
div.cargo_calender td.sunday,
div.cargo_calender td.saturday,
div.cargo_calender td.weekdays {
	text-align:center;
	font-weight:bold;
	padding:8px 6px 5px 6px;
	line-height:1.3;
}
div.cargo_calender th.saturday,
div.cargo_calender td.saturday {
	color:#3399ff;
}
div.cargo_calender th.sunday,
div.cargo_calender td.sunday {
	color:#ff6666;
}
div.cargo_calender button.cargo_day_select {
	width:100%;
	font-size:1.3rem;
	margin:0;
	padding:0;
	border:1px solid #999;
	border-radius:3px;
	background-color:#f9f9f9;
}
div.cargo_calender button.cargo_day_select_none {
	color:#ccc;
	border:1px solid #ddd;
	border-radius:3px;
	background-color:#f9f9f9;
	pointer-events: none;
}
@media screen and (max-width: 959px) {
	div.cargo_calender {
	width:100%; 
	}
	div.cargo_calender_left {
	float:none;
	}
	div.cargo_calender_right {
	float:none;
	}
	table.cargo_calender th,
	table.cargo_calender td {
	}

	div.cargo_calender td.day {
	padding:5px 2px 2px 2px;
	}
	div.cargo_calender button.cargo_day_select {
	width:100%;
	font-size:1.2rem;
	}
}



table.cargo_calender {
	width:49%; 
	display:inline-block; 
	margin:0; 
	padding:0;
}
table.cargo_calender_left {
	float:left;
}
table.cargo_calender_right {
	float:right;
}
table.cargo_calender th.month {
	text-align:center;
	font-weight:bold;
	border-right:1px solid #ccc;
	border-bottom:1px solid #ccc;
	padding:3px;
	font-size:1.6rem;
}
table.cargo_calender th.week {
	text-align:center;
	font-weight:bold;
	border-right:1px solid #ccc;
	border-bottom:3px double #ccc;
	padding:3px;
}
table.cargo_calender td.day {
	text-align:center;
	font-weight:bold;
	padding:8px 6px 5px 6px;
	line-height:1.3;
}
table.cargo_calender th.sat,
table.cargo_calender td.sat {
	color:#3399ff;
}
table.cargo_calender th.sun,
table.cargo_calender td.sun {
	color:#ff6666;
}
button.cargo_day_select {
	width:100%;
	font-size:1.3rem;
	margin:0;
	padding:0;
	border:1px solid #999;
	border-radius:3px;
	background-color:#f9f9f9;
}
button.cargo_day_select_none {
	color:#ccc;
	border:1px solid #ddd;
	border-radius:3px;
	background-color:#f9f9f9;
	pointer-events: none;
}
@media screen and (max-width: 959px) {
	div.cargo_calender td.sunday,
	div.cargo_calender td.saturday,
	div.cargo_calender td.weekdays {
	padding:5px 2px 2px 2px;
	}
	button.cargo_day_select {
	width:100%;
	font-size:1.2rem;
	}
}



button.cargo_day_select span.size {
	float:left;
}
button.cargo_day_select span.seat {
	float:right;
}

@media screen and (max-width: 959px) {
	div.cargo_calender {
	width:100%; 
	}
	div.cargo_calender_left {
	float:none;
	}
	div.cargo_calender_right {
	float:none;
	}
	table.cargo_calender th,
	table.cargo_calender td {
	}

}

.cargo_nextmonth {
	margin:0 0 20px 0;
}

/*空席案内 タブ切り替え全体のスタイル*/
.tabs {
	margin-top: 50px;
	padding: 0;
	width: 100%;
	margin: 0 auto;
}

/*空席案内 タブのスタイル*/
.tabs .tab_item {
	display: block;
	margin:0 0.5%;
	padding:10px;
	width:24%;
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	/*border-bottom: 1px solid #ccc;*/
	border-radius:4px 4px 0 0;
	font-size: 1.5rem;
	line-height: 1.3;
	text-align: center;
	color: #666;
	float: left;
	text-align: center;
	/*font-weight: bold;
	transition: all 0.2s ease;*/
}
@media screen and (max-width: 959px) {
	.tabs .tab_item {
	font-size: 1.4rem;
	width:98%;
	margin:0 1% 5px 1%;
	}
	.tabs .tab_item:last-of-type {
	margin-bottom:0;
	}
}

.tab_item:hover {
	/*opacity: 0.75;*/
}

/*空席案内 ラジオボタンを全て消す*/
input[name="tab_item"] {
	display: none;
}


/*空席案内 タブ切り替えの中身のスタイル*/
.tab_content {
	display: none;
	padding: 40px 0 0 0;
	clear: both;
	overflow: hidden;
	border-top:1px solid #ccc;
}

/*空席案内 選択されているタブのコンテンツのみを表示*/
#port01:checked ~ #port01_content,
#port02:checked ~ #port02_content,
#port03:checked ~ #port03_content,
#port04:checked ~ #port04_content {
	display: block;
}
#all:checked ~ #all_content,
#programming:checked ~ #programming_content,
#design:checked ~ #design_content {
	display: block;
}

/*空席案内 選択されているタブのスタイルを変える*/
.tabs input:checked + .tab_item {
	border-top: 1px solid #9ed154;
	border-left: 1px solid #9ed154;
	border-right: 1px solid #9ed154;
	border-radius:4px 4px 0 0;
	background-color: #9ed154;
	color: #fff;
	font-weight: bold;
}


/*画面フロー*/
.navigation_wrapper{
	width: 100%;
	margin: auto;
	overflow: hidden;
	border-bottom: 1px solid #ccc;
}

ul.navigation{
	list-style: none;
	display:flex;
	justify-content: center;
	color:#666;
	margin:13px auto;
}

ul.navigation li{
	margin:0 15px;
	position: relative;
}

ul.navigation li::after{
	position: absolute;
	width:12px;
	height:1px;
	content:"";
	background:#999;
	top:45%;
	right:-20px;
}

ul.navigation li:last-child::after{content:none;}

ul.navigation li.active{
	font-weight: bold;
	background-color:#2875ee;
	color:#fff;
	padding:0 8px;
}

@media screen and (max-width: 769px) { 
	ul.navigation{
	list-style: none;
	display:flex;
	justify-content: center;
	margin:13px auto;
	font-size:1rem;
	}

	ul.navigation li{
	margin:0 10px 0 10px;
	}

	ul.navigation li::after{
	position: absolute;
	width:8px;
	height:1px;
	content:"";
	top:50%;
	right:-15px;
	}
}
/*画面フロー*/

/*予約番号表示*/
.cargo_reservenumber_area {
	border:2px solid #51ac23; 
	text-align:center; 
	padding:2em; 
	margin:0 0 2em 0; 
	font-size:2rem; 
	font-weight:bold; 
	color:#51ac23;
}


/*テキストエリア*/
.cargo_text_area {
	margin:0 0 2em 0;
}
/* over-ride ELMC */
.cargo_text_area.border{
	border:2px solid #4D4D4D;
	text-align:center; 
	padding:2em;
	font-size:2rem;
	font-weight:bold; 
	color:#4D4D4D;
}
.cargo_text_area hr {
	border:none;
	background-color:#ccc;
	width:100%;
	height:1px;
	margin:0 0 1.25em 0;
}
p.cargo_text_normal {
	margin:0 0 1.25em 0; 
	padding:0 0 0 0; 
	line-height:1.4;
}
p.cargo_text_triangle {
	background:url(../img/triangle-right.png) no-repeat 0 7px; 
	background-size:10px 10px; 
	margin:0 0 1.25em 0; 
	padding:0 0 0 1em; 
	line-height:1.4;
}
p.cargo_text_center {
	text-align:center; 
	margin:80px 0;
}
.cargo_text_area span.red {
	color:#e00;
}
@media screen and (max-width: 959px) {
	p.cargo_text_normal,
	p.cargo_text_triangle,
	p.cargo_text_center {
	font-size:1.5rem;
	line-height:1.4;
	}

	p.cargo_text_triangle {
	background:url(../img/triangle-right.png) no-repeat 0 5px; 
	background-size:10px 10px; 
	}
}


/*ボタン*/
div.cargo_button_area_center {
	text-align:center;
}

.cargo_button_b {
	display: inline-block;
	max-width: 250px;
	width:100%;
	text-align: center;
	text-decoration: none;
	outline: none;
	position: relative;
	z-index: 1;
	border: 2px solid  #2875ee;
	border-radius:40px;
	background: #2875ee;
	color: #fff;
	overflow: hidden;
	margin:0 auto 20px;
	padding:  10px 0;
	font-size:2rem;
}
.cargo_button_w300 {
	max-width: 300px;
}

.button_b:hover {
	color: #0000ad;
	text-decoration:none;
	background-color: #fff;
	border: 2px solid #0000ad;
	cursor: pointer;/*0802追加*/
}

.cargo_footer_button {
	background-color:#fff;
	padding:0;
}

.side_table table input.mb5 {
	margin-bottom: 5px;
	}



@media screen and (max-width: 959px) {
	.cargo_form table {
	border-collapse: collapse;
	border:none;
	}
	.cargo_form table th {
	display: block;
	width: 100%;
	height:auto;
	padding: 25px 0 1px 0;
	background-color:#fff;
	border:none;
	font-weight:bold;
	font-size:1.5rem;
	color:#444;
	}
	.cargo_form table td {
	display: block;
	width: 100%;
	height:auto;
	padding:0;
	border:none;
	}
}

th.cargo_table_th {
	line-height:1.54;
}

th.center,
td.center {
	text-align:center;
}

.cargo_textarea {
	height:auto;
}
.cargo_select {
}
.cargo_roomselect {
	width:50%;
}

label.checkbox {
	background: none;
	border: none;
	padding: 0;
	margin: 0;
}
label.radio {
	background: none;
	border: none;
	padding: 0;
	margin: 0;
}
label.radio input.cargo_radio {
	width:13px;
	height:13px;
}

img.cargo_credit {
	width:auto;
	height:20px;
	display:inline;
	margin:0 5px;
}
@media screen and (max-width: 959px) {
	img.cargo_credit {
	height:30px;
	}
}


/*入力フォームサイズ*/
@media screen and (max-width: 959px) {

	.txt_size60,
	.txt_size120,
	.txt_size200,
	.txt_size500 {
	width:100%;
	}

	.side_table select {
	width:100%;
	}
	.cargo_txt_size100p {
	width:100%;
	}
	.cargo_txt_size90p {
	width:90%;
	}
	.cargo_txt_size75p {
	width:75%;
	}
	.cargo_txt_size50p,
	select.cargo_txt_size50p {
	width:50%;
	}
	.cargo_txt_size30p {
	width:30%;
	}
	.cargo_txt_size25p {
	width:25%;
	}
	.cargo_txt_size20p {
	width:20%;
	}
	.cargo_txt_size15p {
	width:15%;
	}
	.cargo_txt_creditnumber {
	width:20%;
	}
	.cargo_txt_creditname {
	width:80%;
	}
	.cargo_txt_expiry {
	width:20% !important;
	}

	
	.form-memo {
	font-size: 1.2rem;
	line-height: 1;
	display: block;
	margin: 5px 0 0 0;
	text-align:right;
	}

	.plate-block {
	flex-direction: none;
	}
	.plate-block div:nth-of-type(1), 
	.plate-block div:nth-of-type(2) {
	margin-bottom: 8px;
	}
	.plate-block div:nth-of-type(1) {
	width: 100%;
	}
	.plate-block div:nth-of-type(2) {
	width: 100%;
	}
	.plate-block div:nth-of-type(3) {
	width: 100%;
	}

	th.cargo_item_name, 
	th.cargo_item_name_must {
	width: auto;
	}
}

.cargo_form-memo {
	font-size: 1.2rem;
	color: #999999;
	display: inline-block;
	margin: 0;
}


/*ページトップボタン*/
#page-top {
	bottom: 80px;
	}
@media screen and (max-width: 959px) {
	#page-top {
	bottom: 80px;
	}
}

/*エラー表記*/
div.cargo_err {
	margin:0 0 1em 0;
	line-height:1.2;
}

.side_table table th.cargo_err,
.side_table table td.cargo_err,
.side_table table td.cargo_err span {
	color:#f00;
	/*background-color:#ffeded;*/
}
.side_table table td.cargo_err input,
.side_table table td.cargo_err select {
	border:1px solid #f00;
	color:#f00;
}


/*利用規約*/
#cargo_terms {
	border:1px solid #ccc; 
	padding:50px; 
	font-size:14px; 
	height:500px; 
	overflow: auto;
}
#cargo_terms pre {
	white-space: pre-wrap;
}
/*Del:20260806
#cargo_terms pre strong {
	display:block; 
	text-align:center;
}*/
@media screen and (max-width: 959px) {
	#cargo_terms {
	padding:25px; 
	height:400px; 
	}
}

/*Add:20260806*/
#cargo_terms .cargo-terms__title {
    display: block;
    text-align: center;
    font-weight: 700;
}
#cargo_terms .cargo-terms__article-title {
    font-weight: 700;
}
#cargo_terms .cargo-terms__body {
    white-space: pre-wrap;
}
#cargo_terms .cargo-terms__list {
    margin: 0;
    padding-left: 2.5em;
    list-style: decimal;
    list-style-position: outside;
    white-space: normal;
}

#cargo_terms .cargo-terms__list li {
    margin-bottom: 2px;
    padding-left: 0.3em;
    line-height: 1.5;
}
#cargo_terms .cargo-terms__sublist {
    margin: 2px 0 0;
    padding-left: 2em;
    list-style: circle;
    white-space: normal;
}

#cargo_terms .cargo-terms__sublist li {
    margin: 0;
    padding-left: 0.2em;
    line-height: 1.5;
}
#cargo_terms .cargo-terms__bullet-list {
    margin: 0;
    padding-left: 2.5em;
    list-style: none;
    white-space: normal;
}

#cargo_terms .cargo-terms__bullet-list li {
    position: relative;
    margin: 0;
    padding: 0;
    line-height: 1.5;
}

#cargo_terms .cargo-terms__bullet-list li::before {
    content: "・";
    position: absolute;
    left: -1.2em;
}
#cargo_terms .cargo-terms__note {
    margin: 0;
    line-height: 1.5;
    white-space: normal;
    margin-top: 2px;
}
