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

/*========= ナビゲーションのためのCSS ===============*/

@media screen and (min-width: 651px) {

	.sp_only {
		display: none !important;
	}

	.l-header .wrap {
		max-width: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0;
	}

	.header-btn {
		max-width: 100%;
		display: flex;
		align-items: center;
		flex-direction: column;
		justify-content: center;
	}

	.header-btn ul {
		width: 100%;
		overflow: hidden;
		display: flex;
		justify-content: flex-end;
	}

	ul.header_announcement {
		margin-bottom: 3px;
	}

	ul.header_announcement li {
		font-size: 15px;
		color: #fff;
		float: left;
	}

	ul.tell-number li {
		font-size: 15px;
		background: #e78003;
		color: #fff;
		float: left;
		padding: 2px 8px;
		font-weight: 600;
	}

	.header-btn ul li:first-child {
		margin-right: 10px;
	}

	.header-btn ul li:last-child {
		margin-right: 0;
	}

	.header_arrow {
		position: relative;
		padding: 0 0 0 16px;
		margin-left: 4px;
	}

	.header_arrow::after {
		content: "";
		position: absolute;
		top: 50%;
		/* 縦軸をセンタリングする */
		left: 0;
		transform: translateY(-50%);
		/* 縦軸をセンタリングする */
		border: 5px solid transparent;
		border-left: 8px solid #fff;
		/* 好みで色を変えてください */
	}

	/*ハック*/
	.l-header .header-logo {
		margin: 0 !important;
	}
}

@media screen and (max-width: 650px) {


	.pc_only {
		display: none !important;
	}

	header#header {
		/* background: #0a76b4; */
		height: 70px;
		width: 100%;
		z-index: 999;
	}

	.header_fix {
		top: 0 !important;
	}

	.header-wrap {
		width: 100%;
		height: 70px;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.header-wrap .header-logo {
		width: 40%;
		margin-left: 10px;
	}

	.header-wrap .header-logo img {
		width: 100%;
	}

	.header_tel_area {
		width: 70px;
		height: 70px;
	}

	.header_tel_area--new {
		width: 124px;
	}

	.header_tel_area--new a {
		height: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		color: #fff !important;
		font-weight: bold;
		background: url(https://www.kaitori-ginza.com/assets/img/page/repurchase/header-tel_bg.jpg) no-repeat center / cover;
	}

	.header_tel_area--new a:hover {
		opacity: 1 !important;
	}


	.header_tel_area img {
		width: 100%;
	}

	.header-nav_wrap {
		display: flex;
	}


	#g-nav {
		/*position:fixed;にし、z-indexの数値を小さくして最背面へ*/
		position: fixed;
		z-index: -1;
		display: none;
		/*ナビの位置と形状*/
		top: 70px;
		width: 100%;
		height: 100vh;
		/*ナビの高さ*/
		background-color: rgba(0, 0, 0, 0.7);
		/*動き*/
		transition: all 0.3s;
	}

	/*アクティブクラスがついたら透過なしにして最前面へ*/
	#g-nav.panelactive {
		display: block;
		z-index: 999;
		transition: all 0.3s;
	}

	/*ナビゲーションの縦スクロール*/
	#g-nav.panelactive #g-nav-list {
		/*ナビの数が増えた場合縦スクロール*/
		position: fixed;
		z-index: 999;
		width: 100%;
		height: 100vh;
		/*表示する高さ*/
		overflow: auto;
		-webkit-overflow-scrolling: touch;
	}

	/*========= ボタンのためのCSS ===============*/
	header#header .header-wrap .openbtn {
		position: relative;
		z-index: 9999;
		/*ボタンを最前面に*/
		cursor: pointer;
		width: 70px;
		height: 70px;
		background: #fff;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 10px;
	}

	/*×に変化*/
	header#header .header-wrap .openbtn span {
		display: inline-block;
		transition: all .4s;
		/* position: absolute; */
		left: 19px;
		height: 3px;
		border-radius: 2px;
		background-color: #666;
		width: 45%;
	}

	/* header#header .header-wrap .openbtn span:nth-of-type(1) {
		top: 15px;
	}

	header#header .header-wrap .openbtn span:nth-of-type(2) {
		top: 23px;
	}

	header#header .header-wrap .openbtn span:nth-of-type(3) {
		top: 31px;
	} */


	header#header .header-wrap .openbtn p {
		position: absolute;
		top: 40px;
		left: 15px;
	}

	header#header .header-wrap .openbtn.active span:nth-of-type(1) {
		position: absolute;
		top: 50%;
		/* left: 25px; */
		transform: translateY(-50%) rotate(-45deg);
		/* width: 30%; */
	}

	header#header .header-wrap .openbtn.active span:nth-of-type(2) {
		opacity: 0;
	}

	header#header .header-wrap .openbtn.active span:nth-of-type(3) {
		position: absolute;
		top: 50%;
		/* left: 25px; */
		transform: translateY(-50%) rotate(45deg);
		/* width: 30%; */
	}

	header#header .header-wrap .openbtn .openbtn_close {
		opacity: 0;
	}

	header#header .header-wrap .openbtn.active .openbtn_close {
		opacity: 1;
		color: #333;
	}


	header#header .header-wrap .openbtn.active .openbtn_menu {
		opacity: 0;
	}

	header#header .header-wrap .header-nav_btn {
		display: flex;
	}

	header#header .header-wrap .header-nav_btn .header-nav a {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		gap: 8px;
		height: 100%;
		font-size: 12px;
		font-weight: bold;
		border-left: 2px solid #dad9d8;
		width: 67px;
	}

	header#header .header-wrap .header-nav_btn .header-nav:nth-child(2) a {
		border-right: 2px solid #dad9d8;
	}

	header#header .header-wrap .header-nav_btn .header-nav a::before {
		content: "";
		width: 26px;
		height: 24px;
		background: url(https://www.kaitori-ginza.com/assets/img/layout/header/icon_shop.png) no-repeat center / cover;
	}

	header#header .header-wrap .header-nav_btn .header-nav:nth-child(2) a::before {
		width: 34px;
		height: 24px;
		background: url(https://www.kaitori-ginza.com/assets/img/layout/header/icon_car.png) no-repeat center / cover;
	}

	.kaitori_form #feas-searchform-3 {
		margin: 0 !important;
	}

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

	.header_sp a:link,
	.header_sp a:visited {
		text-decoration: none;
		color: #fff;
	}

	.form_inner {
		width: 100%;
		overflow: hidden;
	}

	header#header #g-nav.panelactive .kaitori_form {
		padding: 0 !important;
		border: none !important;
		box-sizing: border-box;
		margin: 0 auto 10px;
		width: -webkit-calc(100% - 20px);
		width: 100%;
	}

	header#header #g-nav.panelactive .form_inner #feas_3_1 {
		width: 85% !important;
		margin-bottom: 5px;
		appearance: auto;
		height: 40px;
		padding-left: 10px;
		border: 1px solid #333;
		border-radius: 5px;
		margin: 0;
		-webkit-appearance: none;
		float: left;
	}

	header#header #g-nav.panelactive #feas-submit-button-3 {
		width: 13%;
		height: 40px;
		border: 0px;
		background: url(https://www.kaitori-ginza.com/image/header_icon/search_btn.jpg) no-repeat;
		background-position: center;
		background-size: contain;
	}

	header#header #g-nav.panelactive .kaitori_form #feas-searchform-3::after {
		display: none;
	}


	#header_sp_navi1 {
		width: 100%;
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}

	#header_sp_navi1 li {
		width: 49%;
		border-radius: 10px;
		margin-bottom: 10px;
	}

	#header_sp_navi1 li a {
		font-weight: 600;
		color: #fff;
		display: block;
		text-align: center;
		padding: 15px 0;
		font-size: 18px;
	}

	#header_sp_navi1 li a span img {
		width: 25px;
		height: auto;
		display: inline-block;
		margin-right: 5px;
	}

	.tel_btn {
		width: 100%;
		background: #D52326;
		border-radius: 10px;
	}


	.tel_btn a {
		font-weight: 600;
		color: #fff;
		font-size: 22px;
		text-align: center;
		padding: 10px 0;
		display: block;
	}

	.tel_btn span {
		display: block;
		font-size: 14px;
		font-weight: 300;
		line-height: 1;
	}

	#header_sp_navi2 {
		background: #fff;
		margin-top: 10px;
	}

	#header_sp_navi2 li {
		border-bottom: solid 1px #888;
		position: relative;
	}

	#header_sp_navi2 li:after {
		content: '';
		background: url("https://www.kaitori-ginza.com/image/header_icon/arrow_icon.svg?ver=0.0.1");
		position: absolute;
		top: 50%;
		right: 10px;
		margin-top: -12px;
		width: 20px;
		height: 20px;
	}

	#header_sp_navi2 li a:link,
	#header_sp_navi2 li a:visited {
		color: #888;
	}

	#header_sp_navi1 li a,
	#header_sp_navi2 li a {
		position: relative;
	}

	#header_sp_navi2 li a {
		padding: 10px 15px;
		display: block;
		color: #888;
		margin-left: 30px;
		font-size: 15px;
	}


	#header_sp_navi1 li a span::before {
		width: 25px;
		height: 25px;
		display: inline;
		position: absolute;
		top: 50%;
		padding-right: 40px;
		transform: translateY(-50%) translateX(-50%);
	}

	#header_sp_navi2 li a::before {
		width: 25px;
		height: 25px;
		display: inline;
		position: absolute;
		top: 50%;
		left: -5px;
		transform: translateY(-50%) translateX(-50%);
	}

	/*買取査定ボタン*/


	#header_sp_navi1 li:nth-child(1) {
		background: #db5353;
	}

	#header_sp_navi1 li:nth-child(2) {
		background: #e49327;
	}

	#header_sp_navi1 li:nth-child(3) {
		background: #0a76b4;
	}

	#header_sp_navi1 li:nth-child(4) {
		background: #06c655;
	}


	#header_sp_navi2 li:nth-child(1) a::before {
		content: '';
		background: url("https://www.kaitori-ginza.com/image/header_icon/hajimete_icon.svg") no-repeat;
	}

	#header_sp_navi2 li:nth-child(2) a::before {
		content: '';
		background: url("https://www.kaitori-ginza.com/image/header_icon/toriatsukai_icon.svg") no-repeat;
	}

	#header_sp_navi2 li:nth-child(3) a::before {
		content: '';
		background: url("https://www.kaitori-ginza.com/image/header_icon/teigaku_icon.svg?ver=0.0.1") no-repeat;
	}

	#header_sp_navi2 li:nth-child(4) a::before {
		content: '';
		background: url("https://www.kaitori-ginza.com/image/header_icon/kaitorijisseki_icon.svg") no-repeat;
	}

	#header_sp_navi2 li:nth-child(5) a::before {
		content: '';
		background: url("https://www.kaitori-ginza.com/image/header_icon/blog_icon.svg") no-repeat;
	}


	#header_sp_navi2 li:nth-child(6) a::before {
		content: '';
		background: url("https://www.kaitori-ginza.com/image/header_icon/shop_icon.svg?ver=0.0.1") no-repeat;
	}

	#header_sp_navi2 li:nth-child(7) a::before {
		content: '';
		background: url("https://www.kaitori-ginza.com/image/header_icon/owllar_icon.svg") no-repeat;
	}
}