@charset "utf-8";
@media screen and (max-width:767px) {
/*=============
　　ログイン画面	
=============*/
.user_login {
	padding-top: 50px;
	padding-bottom: 100px;
	margin-top: 70px;
}
.login {
	padding-left: 5.3334%;
	padding-right: 5.3334%;
	margin-top: 0;
}
.logo {
	max-width: 100px;
	margin-bottom: 30px;
}
.form-signin {
	padding: 30px 30px 20px;
}
.login .txt_box {
	margin-bottom: 30px;
}

/*=============
News	
=============*/
/*== News・運営News（同様のスタイル） ==*/
.news,
.ope_news {
	padding-left: 5.3334%;
	padding-right: 5.3334%;
	margin-top: 30px;
	margin-bottom: 50px;
}

.news .news_list li a,
.news .news_list li .news_list_item_inner,
.ope_news .news_list li a {
	padding-left: 12px;
	padding-right: 12px;
}


/*=============
出品する	
=============*/
/*== 車の登録 ==*/
.user_sell_form {
	padding-left: 5.3334%;
	padding-right: 5.3334%;
}

/*== 売却方法 ==*/
.user_sell_form fieldset > .comment_box.how_to_sell {
	margin-bottom: 30px;
	padding-bottom: 0;
	border-bottom: none;
}

/*== 委託サービス：入力省略ブロック非表示 ==*/
.user_sell_form:has(.sale-type-consignment:checked) .js-sale-target-section {
	display: none !important;
}

/* == 自動車検査証記録事項（画像）・オドメーター（SP）== */
.detail_box02 .deta_list:has(> li.shaken.clm_1) {
	margin-bottom: 20px;
}
.detail_box02 .odometer-area {
	flex-direction: column;
	gap: 20px;
	align-items: stretch;
}
.detail_box02 .odometer-area__field-row--image {
	max-width: none;
	margin-top: 0;
}
.detail_box02 .odometer-area__field-row--image,
.detail_box02 .odometer-area__field-row--value {
	width: 100%;
	padding-left: 0;
	padding-right: 0;
}
.detail_box02 .odometer-area__field-row--value {
	padding-top: 0;
}
.detail_box02 .deta_list li.clm_1 {
	max-width: none;
}
.detail_box02 .odometer-area__image-list {
	max-width: none;
}
.detail_box02 .deta_list li.shaken.clm_1,
.detail_box02 .odometer-area__image-list li.shaken {
	display: flex;
	max-width: none;
	width: 100%;
	min-height: auto;
	height: auto;
}
.detail_box02 .deta_list li.shaken.clm_1 dt,
.detail_box02 .odometer-area__image-list li.shaken dt {
	flex: 0 0 46%;
	width: 46%;
	max-width: 46%;
	box-sizing: border-box;
	font-size: 13px;
	line-height: 1.4;
	padding: 10px 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}
.detail_box02 .odometer-area__image-list li.shaken {
	border-top: 1px solid #999;
}
.detail_box02 .deta_list li.shaken.clm_1 dd,
.detail_box02 .odometer-area__image-list li.shaken dd {
	width: auto;
	max-width: none;
	flex: 1 1 auto;
	min-width: 0;
	min-height: 120px;
	border-left: 1px solid #999;
	border-right: 1px solid #999;
	padding: 10px;
	align-items: center;
	justify-content: center;
}
/* オドメーター数値：car_input と同じくラベル改行＋入力 */
.detail_box02 .odometer-area__field-row--value {
	flex-wrap: wrap;
	align-items: flex-start;
	margin-bottom: 0;
}
.detail_box02 .odometer-area__label--value {
	width: 100%;
	margin-bottom: 8px;
}
.detail_box02 .odometer-area__label--value:before {
	top: 2px;
}
.detail_box02 .odometer-area__value-body.odometer-value-dd {
	width: 85%;
	flex: none;
	min-width: 0;
}
.detail_box02 .odometer-area .odometer-value-input {
	width: 100%;
	max-width: none;
	flex: none;
}

.detail_box02 .deta_list li.shaken.clm_1 dd button span,
.detail_box02 .odometer-area__image-list li.shaken dd button span {
	height: auto;
	line-height: 35px;
}
.detail_box02 .deta_list li.shaken.clm_1 dd button span.has-image img,
.detail_box02 .odometer-area__image-list li.shaken dd button span.has-image img {
	max-width: 100%;
	max-height: 120px;
	object-fit: contain;
}

.detail_box01 .slider_main .img_photo {
	height: 250px;
}
.car_upload .upload_box {
	margin-top: 10px;
}
.car_imgBox .img_photo:before {
    top: 2px;
    right: 2px;
   /* background-size: 18px;
    width: 18px;
    height: 18px;*/
}

/*スライド*/
.detail_box01 .slider_main .img_photo {
	height: 250px;
}
.slider_thumb .slide .img_photo {
	height: 45px;
}
.detail_box01 .slider_main .slick-next,
.detail_box01 .slider_main .slick-prev {
	display: block;
	z-index: 999;
	width: 50px;
	height: 50px;
	background-color: rgba(0,0,0,0.3);
	border-radius: 50px;
}
.detail_box01 .slider_main .slick-next:before,
.detail_box01 .slider_main .slick-prev:before {
	content: "";
	position: absolute;
	top: 16px;
	background-repeat: no-repeat;
	background-size: 15px;
	width: 15px;
	height: 18px;
	opacity: 1;
}
.detail_box01 .slider_main .slick-next:before {
	background-image: url(../../img/user/car/pc/arrow_s_right.svg);
	right: 14px;
}
.detail_box01 .slider_main .slick-prev:before {
	background-image: url(../../img/user/car/pc/arrow_s_left.svg);
	left: 14px;
}

/*== car_input ==*/
.car_input {
	margin-top: 0;
	padding: 30px 20px;
}
.car_input li > label {
	width: 100%;
}
.car_input li > label:before {
	top: 2px;
}
.car_input li > input,
.car_input li > select,
.car_input li > div {
	width: 85%;
}
.car_input li.clm_1 > input {
    width: 170px;
    width: 60%;
}

/*== 基本情報（詳細）==*/
.detail_box02 {
	margin-top: 30px;
}
.detail_box02 .deta_list li {
	display: block;
	height: auto;
    line-height: initial;
}
.detail_box02 .deta_list li:nth-child(even) dt {
	border-left: 1px solid #999;
}
.detail_box02 .deta_list li:nth-child(2) {
	border-top: none;
}
.detail_box02 .deta_list li dt,
.detail_box02 .deta_list li dd {
	width: 100%;
	border-left: 1px solid #999;
	border-right: 1px solid #999;
	padding-left: 10px;
}
.detail_box02 .deta_list li dt {
	padding-top: 10px;
	padding-bottom: 10px;
}
.detail_box02 .deta_list li dd {
	padding-top: 15px;
	padding-bottom: 15px;
}
.detail_box02 .deta_list li.clm_1 dd {
	max-width: 767px;
	width: 100%;
	line-height: 1.5;
}

/*== 装備仕様 ==*/
.detail_box03 {
	margin-top: 30px;
}
.detail_box03 .soubi_list li:nth-child(3n+1) {
	margin-left: 0;
}
.detail_box03 .soubi_list li {
	max-width: 115px;
	width: 31.3%;
}
.detail_box03 .soubi_list li span {
	font-size: 13px;
}
.detail_box03 .soubi_list li:nth-child(4n+1),
.detail_box03 .soubi_list li:nth-child(5n+1) {
	margin-left: 2.353%;
}
.detail_box03 .soubi_list li+li {
	margin-left: 2.353%;
}
.detail_box03 .soubi_list li:nth-child(3n+1) {
	margin-left: 0;
}

/*== 出品者のコメント ==*/
.comment_box .comment_ran {
	padding: 15px;
}

.user_sell_form .send_btn .back {
	margin-top: 30px;
}


/*=============
購入する	
=============*/
/*== 各種書類ダウンロード ==*/
.template_box {
	width: 89.3332%;
	padding: 20px 20px 30px;
	margin-bottom: 50px;
}

/*=============
商品管理	
=============*/
/*== 出品車・取引中・売却済一覧 ==*/
/* 取引一覧：タブ（SP）5列1行・高さ揃え・縦中央 */
.product_management_01 .car_list .search_form .kensaku {
  max-width: none;
  margin-bottom: 24px;
}
.product_management_01 .car_list > .nav-tabs {
	display: flex;
	flex-wrap: nowrap;
	align-items: stretch;
}
.product_management_01 .car_list > .nav-tabs .nav-item {
	flex: 1 1 0;
	min-width: 0;
	max-width: none;
	width: auto;
	font-size: 12px;
	display: flex;
	align-items: stretch;
}
.product_management_01 .car_list > .nav-tabs .nav-item + .nav-item {
	margin-left: 1%;
}
.product_management_01 .car_list > .nav-tabs .nav-link {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 1 1 auto;
	width: 100%;
	height: 100%;
	min-height: 100%;
	padding: 6px 2px;
	line-height: 1.25;
	white-space: normal;
	text-align: center;
}

.car_list {
	padding-left: 5.3334%;
	padding-right: 5.3334%;
	margin-top: 50px;
}
.car_units .number {
	font-size: 24px;
}
.car_units .units {
	font-size: 12px;
	margin-left: 5px;
}

.car_list .box_list li a .contents {
	display: block;
}

/* 取引一覧：車両カード 3段レイアウト（SP） */
.product_management_01 .car_list .box > .contents {
	display: block;
}
.product_management_01 .car_list .block01 {
	display: flex;
	align-items: flex-start;
	width: 100%;
}
.product_management_01 .car_list .block01 .img_box {
	flex: 0 0 40%;
	max-width: 40%;
	width: 40%;
}
.product_management_01 .car_list .block01 .txt_box {
	flex: 1;
	min-width: 0;
	margin-left: 10px;
	margin-top: 0;
	max-width: none;
	width: auto;
	border-bottom: none;
}
.product_management_01 .car_list .block01 .main_box {
	display: block;
	border-bottom: none;
}
.product_management_01 .car_list .block01 .main_box .car_name .status span {
	font-size: 12px;
}
.product_management_01 .car_list .block01 .main_box .car_name {
	border-bottom: 1px solid #444;
	padding-bottom: 10px;
}
.product_management_01 .car_list .block02 {
	width: 100%;
}
.product_management_01 .car_list .block02 .car_price {
	padding-top: 10px;
	display: flex;
	justify-content: flex-end;
	border-bottom: none;
}
.product_management_01 .car_list .block03 {
	width: 100%;
}
.product_management_01 .car_list .block03 .pr_box {
	padding-bottom: 10px;
	font-size: 14px;
}

.car_list .img_box {
	max-width: 599px;
	width: 100%;
}
.car_list .img_box .img_photo {
	height: 200px;
}
.product_management_01 .car_list .img_box {
	position: static;
}
/* お気に入りカウント：画像ラッパー（.img_photo）基準で左上に配置（img_box は static のまま） */
.product_management_01 .car_list .img_box .img_photo {
	position: relative;
}
.product_management_01 .car_list .img_box .fav_heart {
	top: 8px;
	left: 8px;
}
.car_list .txt_box {
	margin-left: 0;
	margin-top: 10px;
	max-width: initial;
	width: 100%;
}
.car_name .f18 {
	font-size: 16px;
}
.car_name .f24 {
	margin-top: 5px;
}
.car_name .f14 {
	margin-top: 5px;
}
.car_price .kakaku {
	font-size: 13px;
}
.car_price .price {
	font-size: 15px;
	height: 75px;
}
.car_price .price .price-main {
	font-size: 48px;
}
.car_price .price .price-decimal {
	font-size: 31.2px;
	vertical-align: baseline;
}
.car_list .txt_box .main_box {
	display: block;
}
.car_list .txt_box .main_box .car_name {
	border-bottom: 1px solid #444;
	padding-bottom: 10px;
}
.car_list .txt_box .main_box .car_name .status span {
	font-size: 12px;
}
.car_list .txt_box .main_box .car_name .car_trading_partner {
	font-size: 13px;
	margin-top: 6px;
}
.car_list .txt_box .main_box .car_price {
	padding-top: 10px;
}
.car_list .txt_box .main_box .car_price {
	padding-top: 10px;
	display: flex;
	justify-content: flex-end;
}
.car_list .txt_box .pr_box {
	padding-bottom: 10px;
	font-size: 14px;
}
.car_list .txt_box .pr_box p {
	-webkit-line-clamp: 2;
	line-clamp: 2;
}
.car_list .detail_list li {
	max-width: 115px;
	width: 31.3%;
}
.car_list .detail_list li + li {
	margin-left: 10px;
}
.car_list .detail_list li:nth-child(3n+1) {
	margin-left: 0;
}
.car_list .detail_list li:nth-child(6) {
	margin-left: 10px;
}
.product_management_01 .car_list .box .car_card_actions{
	/* justify-content: center; */
}

/*== 車両到着連絡 ==*/
.user_product_management_form {
	width: 89.3332%;
	padding: 20px 20px 30px;
}
.product_management_txt {
	text-align: left;
}
.user_product_management_form .btn_box {
	margin-top: 30px;
}
.user_product_management_form .notes_box {
	width: 100%;
	padding: 30px 20px;
	margin-top: 30px;
}
.user_product_management_form .notes_box p {
	text-align: justify;
	margin-top: 15px;
}


/*== 取引画面 ==*/
.transaction_info .inner_box {
	padding-left: 5.3334%;
	padding-right: 5.3334%;
}
.transaction_info .modal_box .modal-content .btn_box {
	margin-top: 0;
	top: 10px;
	right: 10px;
}
.transaction_info .table-container.deals_list tbody tr {
	padding: 14px;
}
.transaction_info .comment_area .inner {
	padding-left: 0;
    padding-right: 0;
}
.transaction_info .chat_transaction {
	padding-left: 0;
    padding-right: 0;
}
.transaction_info .left_box .detail_list li + li {
	    margin-top: 10px;
}

.transaction_info .left_box .detail_list li dl {
	flex-wrap: wrap;
}
.transaction_info .left_box .detail_list li dl dt {
	flex: 0 0 45%;
	width: auto;
	font-size: 16px;
	white-space: normal;
}
.transaction_info .left_box .detail_list li dl dd {
	flex: 0 0 55%;
	width: auto;
	white-space: normal;
}



/*=============
チャット歴	
=============*/
.chat_list li {
	padding-left: 5.3334%;
	padding-right: 5.3334%;
	padding-top: 20px;
	padding-bottom: 20px;
}
.chat_list li .inner .icon {
	width: 30px;
	height: 30px;
}
.chat_list li .inner .right {
	max-width: 599px;
	width: 90%;
}
.chat_list li .inner .right .chat_box {
	padding-left: 0;
	margin-top: 0;
}
.comment_area .inner .textarea textarea {
	/*min-height: auto;*/
}
.comment_area .inner {
	padding-left: 5.3334%;
	padding-right: 5.3334%;
	padding-top: 15px;
	padding-bottom: 15px;
}

/*=============
各種設定	
=============*/
/*== プロフィール編集 ==*/
.user_setting_01_form {
	padding-left: 5.3334%;
	padding-right: 5.3334%;
}
.user_setting_01_form .content_box {
	padding-left: 5.3334%;
	padding-right: 5.3334%;
}
.user_setting_01_form .form_table dl + dl {
	margin-top: 20px;
}
.user_setting_01_form .form_table dl.d_license dd .license_img {
	display: block;
}
.user_setting_01_form .form_table dl.d_license dd .license_img > div {
	width: 100%;
}
.user_setting_01_form .form_table dl.d_license dd .license_img > .img_ura {
	margin-top: 10px;
}
.user_setting_01_form .form_table dl.d_license dd .license_box {
	display: block;
}
.user_setting_01_form .form_table dl.d_license dd .license_box .license_upload {
	width: 100%;
}
.user_setting_01_form .form_table dl.d_license dd .license_box .license_upload.ura {
	margin-top: 10px;
}
.user_setting_01_form .form_table dl.d_license dd .license_box .license_upload .upload_ttl {
	padding-bottom: 5px;
}


/*== 通知・ログイン設定 ==*/
.user_setting_02_form {
	width: 89.3332%;
	padding: 0 20px;
}
.user_setting_02_form .form_table {
	padding-top: 20px;
	padding-bottom: 30px;
}
.user_setting_02_form .form_table dl + dl {
	margin-top: 20px;
}


/*== 退会申請 ==*/
.user_setting_03_form {
	width: 89.3332%;
	padding: 20px 20px 30px;
}
.user_setting_03_form .notes_box {
	padding: 20px;
}
.user_setting_03_form .btn_box {
	margin-top: 30px;
}
.user_setting_03_form .notes_txt {
	text-align: left;
}


/*=============
購入リクエスト画面	
=============*/
.user_purchase_request_form {
	width: 89.3332%;
	padding: 20px 20px 30px;
    margin-bottom: 30px;
}
.user_purchase_request_form .mmc-buyrequest-questions {
	margin-top: 24px;
}
.user_purchase_request_form .mmc-buyrequest-question {
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
	padding: 18px 0;
}
.user_purchase_request_form .mmc-buyrequest-question__label {
	flex: none;
	width: 100%;
}
.user_purchase_request_form .mmc-buyrequest-question__options {
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
	width: 100%;
}
.user_purchase_request_form .mmc-buyrequest-question__options .form-check {
	width: 100%;
	min-height: 28px;
	padding-left: 0;
}
.user_purchase_request_form .sentaku {
	margin-top: 30px;
	display: block;
}
.user_purchase_request_form .sentaku .form-check {
	padding-left: 0;
}
.user_purchase_request_form .sentaku .form-check + .form-check {
	margin-left: 0;
	margin-top: 30px;
}
.user_purchase_request_form .sentaku.is-delegated-only {
	max-width: 210px;
	width: 210px;
	margin-left: auto;
	margin-right: auto;
}
.user_purchase_request_form .sentaku.is-delegated-only .form-check {
	max-width: 210px;
	width: 210px;
}
.user_purchase_request_form .btn_box {
	margin-top: 30px;
}
.user_purchase_request .mmc-buyrequest-guide {
	width: 89.3332%;
	margin-left: auto;
	margin-right: auto;
}
/* 購入リクエスト確認ポップアップ：閉じるを狭め、送信ボタン文言を1行表示 */
.user_purchase_request .deal_purchase_modal_btns .deal_detail_link_btn {
	flex: 0 0 auto;
	min-width: 0;
}
.user_purchase_request .deal_purchase_modal_btns .deal_detail_purchase_btn {
	flex: 1 1 auto;
	min-width: 0;
	white-space: nowrap;
}

/* 下部固定メニュー：取引一覧ポップアップ（checkbox開閉） */
.shortcut_btn {
	overflow: visible;
}
.shortcut_list .sp-trade-menu {
	position: relative;
	overflow: visible;
}
.sp-trade-menu__toggle {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
.sp-trade-menu__trigger {
	display: block;
	color: inherit;
	cursor: pointer;
}
.sp-trade-menu__popup {
	display: none;
	position: absolute;
	bottom: calc(100% + 8px);
	right: 0;
	min-width: 120px;
	background-color: #fff;
	border: 1px solid #ccc;
	border-radius: 6px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
	z-index: 110;
}
.sp-trade-menu__toggle:checked + .sp-trade-menu__popup {
	display: block;
}
.sp-trade-menu__list {
	list-style: none;
	margin: 0;
	padding: 6px 0;
	width: 100%;
	box-sizing: border-box;
}
.sp-trade-menu__list li {
	width: 100%;
	text-align: left;
	box-sizing: border-box;
}
.sp-trade-menu__list li + li {
	border-top: 1px solid #eee;
}
.sp-trade-menu__list a {
	display: block;
	width: 100%;
	padding: 10px 16px;
	box-sizing: border-box;
	font-size: 14px;
	color: #333;
	text-decoration: none;
	line-height: 1.4;
	text-align: center;
}
.sp-trade-menu__list a:active {
	background-color: #f5f5f5;
}

}