/* CSS Document */
@media screen and (max-width:850px){
	
	html {
		font-size: 8px;
	}
	body {
		max-width: 850px;
	}
	.pc-only {
		display: none;
	}
	.tab-sp-nav {
		display: block;
	}
	
	/*ヘッダー*/
	.head-logo {
		width: 35rem;
	}
	#header .nav {
		width: 40%;
		font-size: 1.8rem;
	}
	#header .nav ul {
		align-items: center;
		justify-content: space-between;

	}
	.nav-bnr {
		width: 30rem;
		
	}
	.nav-bnr .tel-link {
		width: 100%;
		margin: auto;
	}
	.nav-bnr .contact-link {
		width: 100%;
		margin: auto;
		background: #fff;
		padding: 2px;
	}
	.contact-link a {
		display: block;
		color: #333;
		text-align: center;
	}
	
	/*メインビジュアル*/
	.mainvisual {
		width: 100%;
		height: 40vh;
		padding-top: 16rem;
		position: relative;
	}
	
	/*ＳＮＳリンク*/
	.sns-wrapper {
		width: 80%;
		margin: 5rem auto 0 auto;
		justify-content: space-between;
		align-items: center;
	}
	.sns-wrapper a {
		width: 30%;
	}
	
	/*ご挨拶*/
	#greeting {
		width: 100%;
		background: url("../img/greeting-img-tabsp.png");
		background-size: cover;
		border-bottom: solid 10px #0F8814;
	}
	#greeting .inner {
		width: 700px;
		margin: auto;
		padding: 5rem 0;
	}
	.greeting-message {
		text-align: center;
		font-size: 2rem;
		line-height: 2;
		margin-top: 5rem;
	}
	#greeting .point {
		margin-top: 7rem;
	}
	.point-wrapper {
		width: 90%;
		margin: auto;
		justify-content: space-between;
	}
	
	/*取り扱い商品*/
	#lineup .inner {
		width: 90%;
		margin: auto;
	}
	.lineup-wrapper .item .item-ttl p {
		text-align: center;
		font-size: 4rem;
		color: #4B4B4B;
	}
	.lineup-wrapper .item .item-ttl p span {
		font-size: 2.4rem;
	}
	
	
	/*買取の流れ*/
	.flow-wrapper {
		width: 90%;
		margin: 5rem auto;
		flex-direction: column;
		gap:5rem;
	}
	.flow-item {
		border: 5px solid rgba(166,243,169,0.8);
		border-radius: 5rem;
		padding-top: 5rem;
		box-sizing: border-box;
		width: 100%;
		height: 55rem;
	}
	.flow-txt {
		font-size: 2.4rem;
	}
	.flow-01 p {
		font-size: 2.4rem;
	}
	.link-wrapper {
		width: 70%;
		margin: 2rem auto 0 auto;
		justify-content: space-between;
		align-items: center;
	}
	.link-wrapper a {
		width: 20%;
	}
	.flow-02 {
		width: 80%;
		margin: 3rem auto 0 auto;
		justify-content: center;
		gap:3rem;
	}
	.flow-02 img {
		width: 20%;
	}
	.flow-03 {
		width: 20%;
		margin: 3rem auto 0 auto;
	}
	
	/*よくあるご質問*/
	.qa-box {
		width: 95%;
		margin: auto;
		background: #fff;
		border-radius: 5rem;
		box-shadow: 2px 2px 5px #ccc;
		padding: 3rem 0;
	}
	.qa-item {
		width: 98%;
		margin: auto;
		gap:2rem;
		align-items: center;
	}
	.q-item {
		padding-bottom: 1rem;
		border-bottom: 1px solid #CDCDCD;
	}
	.a-item {
		margin-top: 2rem;
	}
	.qa-icon {
		width: 30px;
		height: 30px;
		border-radius: 50%;
	}
	.qa-icon p {
		line-height: 30px;
		font-size: 3rem;
		text-align: center;
	}
	.q-icon {
		background: #6AD7F9;
	}
	.a-icon {
		background: #F96AC0;
	}
	.qa-txt {
		width: 90%;
		margin: auto;
	}
	.qa-txt p {
		font-size: 2rem;
	}
	#qa .contact-btn {
		margin-top: 8rem;
	}
	
	/*対応エリア*/
	#area .inner {
		width: 95%;
		margin: 5rem auto 8rem auto;
		justify-content: space-between;
		align-items: center;
	}
	
	
	/*店舗紹介*/
	.store-flex01 {
		margin: 8rem auto;
		gap: 5rem;
		flex-direction: column;
	}
	.store-flex01 .store-box {
		width: 700px;
		height: 500px;
		margin: auto;
	}
	.store-name {
		width: 85%;
		margin: auto;
		border-bottom: solid 1px #0F8814;
	}
	.store-flex01 .store-box .store-name p {
		font-size: 3rem;
	}
	.store-item {
		width: 85%;
		margin: 2rem auto;
		justify-content: space-between;
		align-items: center;
	}
	.store-img {
		width: 40%;
	}
	.store-info {
		width: 55%;
	}
	.store-info dl {
		justify-content: space-between;
		align-items: center;
		font-size: 1.6rem;
	}
	.store-info dl dt {
		width: 25%;
	}
	.store-info dl dd {
		width: 73%;
	}
	.store-info .mb2 {
		margin-bottom: 2rem;
	}
	.store-map {
		width: 90%;
		margin: auto;
	}
	.store-flex01 .store-map iframe {
		width: 100%;
		height: 30rem;
	}

	.store-flex02 {
		justify-content: center;
		gap: 5rem;
	}
	.store-flex02 .store-box {
		width: 55rem;
		height: 40rem;
		background: #fff;
		box-shadow: 3px 3px 6px #ccc;
		padding: 2rem 0;
	}
	.store-flex02 .store-box .store-name p {
		font-size: 2.4rem;
	}
	.store-flex02 .store-info {
		width: 75%;
		margin: 3rem auto;
	}
	.store-flex02 .store-info dl dt {
		width: 20%;
	}
	.store-flex02 .store-info dl dd {
		width: 78%;
	}
	.store-flex02 .store-map iframe {
		width: 100%;
		height: 24rem;
	}
	
	/*ヤフオクバナー*/
	.yahuoku-bnr {
		width: 95%;
	}
	.yahuoku-bnr .bnr-ttl {
		width: 70%;
		margin: auto;
	}
	.yahuoku-link-wrapper {
		width: 95%;
		margin: 3rem auto 0 auto;
		justify-content: space-between;
		align-items: center;
	}
	.yahuoku-link {
		width: 12%;
		background: #fff;
		padding: 2rem 0;
		border-radius: 3rem;
	}
	.yahuoku-link a {
		display: block;
		font-size: 2rem;
		text-align: center;
		color: #333;
	}

	/*会社情報*/
	#company {
		padding: 8rem 0;
		border-bottom: 1rem solid #0F8814;
	}
	#company .inner {
		width: 90%;
		margin: 5rem auto;
		justify-content: space-between;
		align-items: center;
	}
	.company-img {
		width: 45%;
	}
	.company-info {
		width: 48%;
	}
	.company-info dl {
		justify-content: space-between;
		font-size: 1.8rem;
	}
	.company-info dl dt {
		width: 30%;
		padding: 2rem 0;
		border-bottom: 1px solid #ccc;
	}
	.company-info dl dd {
		width: 70%;
		padding: 2rem 0;
		border-bottom: 1px solid #ccc;
	}
	.company-sns {
		width: 50%;
		margin: 5rem auto;
		justify-content: center;
		gap: 2rem;
		flex-direction: column;
	}
	.company-sns iframe {
		width: 100%;
	}
	
	/*お問い合わせフォーム*/
	#contact-form .inner {
		width: 85%;
	}
	.form {
		width: 95%;
	}
}


@media screen and (max-width:420px) {
	html {
		font-size: 7px;
	}
	body {
		max-width: 420px;
	}
	
	/*ヘッダー*/
	.head-logo {
		width: 22rem;
	}
	#header .nav {
		width: 40%;
		font-size: 1.8rem;
		margin-right: 8rem;
	}
	#header .nav ul {
		align-items: center;
		justify-content: space-between;

	}
	.nav-bnr {
		width: 20rem;
	}
	
	/*メインビジュアル*/
	.mainvisual {
		width: 100%;
		height: 18vh;
		padding-top: 16rem;
		position: relative;
	}
	/*スライドショー*/
	.top-ss {
		padding: 2rem 0;
		background: #EDF192;
	}
	.sns-wrapper {
		margin: 2rem auto 0 auto;
	}
	
	/*ご挨拶*/
	#greeting {
		width: 100%;
		background: url("../img/greeting-img-tabsp.png");
		background-size: cover;
		border-bottom: solid 10px #0F8814;
	}
	#greeting .inner {
		width: 360px;
		margin: auto;
		padding: 5rem 0;
	}
	.greeting-message {
		text-align: center;
		font-size: 2rem;
		line-height: 2;
		margin-top: 5rem;
	}
	#greeting .point {
		margin-top: 7rem;
	}
	.point-wrapper {
		width: 90%;
		margin: auto;
		justify-content: space-between;
	}
	#greeting .inner h3 {
		font-size: 2.6rem;
	}
	#greeting .inner h3 .green {
		color: #9DCA40;
		font-size: 3.6rem;
	}
	#greeting .inner h3 .green .small {
		font-size: 2.6rem;
	}
	#greeting .point h4 {
		font-size: 2.8rem;
	}
	#greeting .point h4 .green {
		font-size: 3.6rem;
	}
	#greeting .point h4 .green .small {
		font-size: 2.8rem;
	}
	.point-wrapper {
		width: 90%;
	}
	.point-wrapper .item {
		width: 20%;
	}
	
	/*取り扱い商品*/
	#lineup .inner {
		width: 90%;
	}
	.lineup-wrapper {
		flex-direction: column;
		gap: 5rem;
	}
	.lineup-wrapper .item {
		width: 100%;
		position: relative;
		margin-bottom: 3rem;
	}
	
	/*買取の流れ*/
	#flow {
		padding: 5rem 0 0 0;
	}
	.flow-02 img {
		width: 40%;
	}
	.flow-03 {
		width: 30%;
	}
	
	/*対応エリア*/
	#area .inner {
		width: 90%;
		margin: 5rem auto 8rem auto;
		flex-direction: column-reverse;
		gap:2rem;
	}
	.area-img {
		width: 100%;
	}
	.area-txt {
		width: 100%;
	}
	.area-txt p {
		font-size: 2rem;
		line-height: 1.5;
	}
	
	/*店舗紹介*/
	.store-flex01 {
		margin: 8rem auto;
		gap: 5rem;
		flex-direction: column;
	}
	.store-flex01 .store-box {
		width: 360px;
		height: 580px;
		margin: auto;
	}
	.store-flex01 .store-box .store-name p {
		font-size: 2.4rem;
	}
	.store-item {
		width: 85%;
		margin: 2rem auto;
		flex-direction: column;
		gap:2rem;
	}
	.store-img {
		width: 100%;
	}
	.store-info {
		width: 100%;
	}
	.store-info dl {
		justify-content: space-between;
		align-items: center;
		font-size: 2rem;
	}
	.store-info dl dt {
		width: 25%;
	}
	.store-info dl dd {
		width: 73%;
	}
	.store-info .mb2 {
		margin-bottom: 2rem;
	}
	.store-map {
		width: 90%;
		margin: auto;
	}
	.store-flex01 .store-map iframe {
		width: 100%;
		height: 24rem;
	}

	.store-flex02 {
		justify-content: center;
		gap: 5rem;
	}
	.store-flex02 .store-box {
		width: 360px;
		height: 40rem;
		background: #fff;
		box-shadow: 3px 3px 6px #ccc;
		padding: 2rem 0;
	}
	.store-flex02 .store-box .store-name p {
		font-size: 2.4rem;
	}
	.store-flex02 .store-info {
		width: 75%;
		margin: 3rem auto;
	}
	.store-flex02 .store-info dl dt {
		width: 20%;
	}
	.store-flex02 .store-info dl dd {
		width: 78%;
	}
	.store-flex02 .store-map iframe {
		width: 100%;
		height: 24rem;
	}
	
	/*ヤフオクバナー*/
	.yahuoku-bnr {
		width: 95%;
	}
	.yahuoku-bnr .bnr-ttl {
		width: 90%;
		margin: auto;
	}
	.yahuoku-link-wrapper {
		width: 95%;
		margin: 3rem auto 0 auto;
		justify-content: center;
		gap:2rem;
		align-items: center;
		flex-wrap: wrap;
	}
	.yahuoku-link {
		width: 30%;
		background: #fff;
		padding: 2rem 0;
		border-radius: 3rem;
	}
	.yahuoku-link a {
		display: block;
		font-size: 2rem;
		text-align: center;
		color: #333;
	}

	/*会社情報*/
	#company {
		padding: 8rem 0;
		border-bottom: 1rem solid #0F8814;
	}
	#company .inner {
		width: 90%;
		margin: 5rem auto;
		flex-direction: column;
		gap:3rem;
	}
	.company-img {
		width: 100%;
	}
	.company-info {
		width: 100%;
	}
	.company-info dl {
		justify-content: space-between;
		font-size: 2rem;
	}
	.company-sns {
		width: 80%;
		margin: 5rem auto;
		justify-content: center;
		gap: 2rem;
		flex-direction: column;
	}
	.company-sns iframe {
		width: 100%;
	}
	
	/*お問い合わせフォーム*/
	#contact-form .inner {
		width: 85%;
	}
	.form {
		width: 95%;
	}
	.form-item ul {
		flex-direction: column;
	}
	.form-item ul .form-label {
		width: 100%;
		margin: auto;
		text-align: center;
		line-height: 2.5;
	}
	.form-item ul .form-input {
		width: 100%;
		margin: auto;
	}
	.input_box {
		width: 100%;
	}
	.input_txtarea {
		width: 100%;
	}
	.submit-btn {
		width: 60%;
	}

	
}