@charset "utf-8";
:root {
  --google-blue: #4285f4;
  --google-red: #ea4335 ;
  --google-yellow: #fbbc05;
  --google-green: #34a853;
  --dark-gray: #333333;
  --light-gray: #f0f0f0;
}
@media screen and (min-width:441px) {
	.page {
		font-size: 1.15em;
		margin: 0 auto;
		padding: 0;
		width: 940px;
	}
	.page a {
		color: var(--blue);
	}
	.page h2 {
		padding: 0;
		margin: 0;
		text-align: center;
	}
	.page h3 {
		background-color: var(--dark-gray);
		color: #FFF;
		font-size: 1.35em;
		margin: 0;
		padding: 0.35em 0 0.35em 0.5em;
		width: 100%;
	}
	.swiper-container {
		margin: 0 auto;
	}
	.wrapper .swiper-button-prev, .wrapper .swiper-button-next {
		display: none;
	}
	.page .item_list_A {
		width: 830px;
		margin: 0 auto;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	.page .item_list_A div.item {
		box-sizing: border-box;
		border: solid 1px #A3A5AC;
		height: 223px;
		text-align: left;
		margin: 0 0 10px 0;
		position: relative;
		background-repeat: no-repeat;
		background-position: top left;
	}
	.page .item_list_A div.item:hover {
		opacity: 0.85;
	}
	.page .item_list_A div.item a {
		display: block;
		width: 100%;
	}
	.page div.item_M {
		width: 400px;
	}
	.page div.item_M:nth-of-type(odd) {
	}
	.page div.item_M:nth-of-type(even) {
		float: right;
	}
	.page div.item_list_A div.item_M {
		background-image: url("/parts/contents/google-info/bg_M_green.jpg");
	}
	.page div.item div.upper {
		z-index: 2;
		position: absolute;
		top: 0;
		left: 0;
	}
	.page div.item_list_A div.item div.upper {
		color: #1C1C1C;
		text-shadow:
		2px  2px 0px rgba(255, 255, 255, 0.70),
		-2px  2px 0px rgba(255, 255, 255, 0.70),
		2px -2px 0px rgba(255, 255, 255, 0.70),
		-2px -2px 0px rgba(255, 255, 255, 0.70),
		2px  0px 0px rgba(255, 255, 255, 0.70),
		0px  2px 0px rgba(255, 255, 255, 0.70),
		-2px  0px 0px rgba(255, 255, 255, 0.70),
		0px -2px 0px rgba(255, 255, 255, 0.70);
	}
	.page div.item h4 {
		background-repeat: no-repeat;
		background-position: top left;
		box-sizing: border-box;
	}
	.page div.item_M h4 {
		padding: 10px 0 0 15px;
		margin: 1px;
		height: 70px;
		line-height: 120%;
		font-size: 1.65em;
	}
	.page div.item_M div.spec {
		width: 300px;
		padding: 10px;
	}
	.page div.item div.spec h5 {
		font-size: 1.05em;
		padding: 0;
		margin: 0;
	}
	.page div.item div.spec p{
		font-size: 0.95em;
		padding: 0;
		margin: 0;
		line-height: 125%;
	}
	.page div.item p.photo {
		z-index: 1;
		position: absolute;
		text-align: right;
		margin: 0;
		padding: 0;
	}
	.page div.item_M p.photo {
		width: 180px;
		height: 150px;
		top: 35px;
		right: 8px;
	}
	.page div.item p.photo img {
		max-width: 100%;
		max-height: 100%;
	}
	.page div.item div.bottom {
		position: absolute;
		left: 0;
		bottom: 0;
		z-index: 0;
		display: flex;
		align-items: center;
		background-repeat: no-repeat;
		background-size: 20px 20px;
		background-position: right 7px center;
		width: 100%;
		box-sizing: border-box;
		padding: 0 10px;
	}
	.page div.item div.bottom_box {
		margin: 0 auto;
	}
	.page div.item_list_A div.item div.bottom {
		background-color: #E0E6DE;
		background-image: url("/parts/contents/google-info/common/arrow_gray.svg");
	}
	.page div.item_M div.bottom {
		height: 50px;
	}
	.page div.item p.status {
		font-weight: bold;
		font-size: 0.8em;
		padding: 3px 5px;
		margin: 0 8px 0 0;
		height: 22px;
	}
	.page div.item p.new {
		color: #000;
		background-color: #FFA100;
	}
	.page div.item p.used {
		color: #FFF;
		background-color: #707B7C;
	}
	.page div.item p.price {
		font-weight: bold;
		color: #FF0000;
		margin: 0 12px 0 0;
	}
	.page div.item_M p.price {
		font-size: 2.45em;
	}
	.page div.item p.price:after {
		content: "円";
		font-size: 0.75em;
		padding: 0 0 0 3px;
	}
	.page div.item ul.function {
		display: flex;
		font-weight: bold;
	}
	.page div.item ul.function li {
		display: inline-block;
		color: #1C1C1C;
	}
	.page div.item_M ul.function li {
		margin: 0 3px 0 0;
	}
	.page div.item_M ul.function li img {
		margin: 0;
	}
	.page dl.func_icon {
		padding: 0;
		margin: 0 0 30px 0;
		color: #1C1C1C;
		text-align: left;
		display: flex;
		justify-content: space-between;
		align-items: center;
		width: 730p;
	}
	.page dl.func_icon dt {
		font-weight: bold;
		font-size: 0.85em;
		padding: 5px;
		margin: 0;
		background-color: #e7e7e7;
	}
	.page dl.func_icon dd {
		padding: 0;
		margin: 0;
		font-size: 0.85em;
	}
	.page dl.func_icon dd img {
		width: 20px;
		padding: 0 5px 0 0;
		display: inline;
	}
	.page .item_list_B * {
		text-align: center;
		text-decoration: none;
	}
	.page .item_list_B > div {
		margin: 0 0 20px 0;
		width: 32%;
	}
	.page .item_list_B > div > a {
		display: block;
		border-bottom: dotted 1px var(--google-green);
	}
	.page .item_list_B {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin-top: 1em;
	}
	.page .item_list_B h4 {
		background-color: var(--google-green);
		color: #FFF;
		font-size: 1.25em;
		padding: 0.2em 0;
		margin: 0;
	}
	.page .item_list_B h4 + p {
		margin: 0 auto;
		border: solid 1px #A6A6A6;
		border-top: none;
		transition: 0.25s;
	}
	.page .item_list_B h4 + p img {
		width: 228px;
	}
	.page .item_list_B h4 + p:hover {
		background-color: #FFFFC2;
	}
	.page .item_list_B h5 {
		color: var(--google-green);
		font-size: 1em;
		margin: 0.75em 0 0 0;
		text-align: left;
		text-decoration: underline;
	}
	.page .item_list_B .spec {
		font-size: 0.85em;
		line-height: 140%;
		text-align: left;
	}
	.page .item_list_B .price {
		margin: 0 0 0.8em;
	}
	.page .item_list_B .price::after {
		content: "";
	}
	.page .item_list_B .price p {
		color: #CC0000;
		font-size: 1.9em;
		font-weight: bold;
		width: 100%;
	}
	.page .item_list_B .price p span {
			color: #CC0000;
			font-size: 0.65em;
			padding: 0 0 0 0.1em;
	}
	.page .item_list_B .price p span:after {
			color: #000;
			content: "（税込）";
			display: inline-block;
			font-size: 0.75em;
			font-weight: normal;
	}
	.page .item_list_B .price p:after {
			background-color: var(--google-green);
			border-radius: 3px;
			color: #FFF;
			content: "詳細 ▶";
			font-size: 0.5em;
			font-weight: normal;
			padding: 0 0.3em;
	}
	.page .bn_list p {
		margin: 1em 0;
		text-align: center;
	}
	.page dl.youtube {
		background-color: var(--light-gray);
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		margin: 3em 0 0 0;
		padding: 1em;
	}
	.page dl.youtube dd p {
		background-color: var(--light-gray);
	}
	.page dl.youtube dt {
		color: var(--dark-gray);
		font-size: 1.65em;
		font-weight: bold;
		margin-bottom: 0.25em;
		text-align: center;
		width: 100%;
	}
	.page dl.youtube dd {
		background-color: var(--dark-gray);
		margin: 0 0.3em 0.7em 0.3em;
		width: 214px;
	}
	.page dl.youtube dd img {
		opacity: 0.65;
		transition: all 0.5s 0s ease;
	}
	.page dl.youtube dd:hover img {
		opacity: 1;
	}
	.page dl.youtube dd:last-of-type {
		background-color: transparent;
	}
	.page p.trademark {
		font-size: 12px;
		margin: 1em 0;
	}
	.page .logo {
		margin-top: 2em;
		text-align: center;
		display: flex;
		justify-content: center;
	}
	.page .logo img {
		display: flex;
		margin: auto 0;
		width: 300px;
	}
	.page .logo p {
		padding: 0;
		margin:  auto 0;
	}
}
@media screen and (max-width:440px) { 
	.page {
		font-size: 0.85em;
		padding: 0;
	}
	.page a {
		color: var(--blue);
	}
	.page h3 {
		background-color: var(--dark-gray);
		color: #FFF;
		font-size: 1em;
		margin: 2em 0 1em 0;
		padding: 0.5em 0 0.15em 0.5em;
		width: 100%;
	}
	.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
		margin: 0 !important;
		padding: 0;
	}
	.page div.item_list_A,
	.page dl.func_icon,
	.page dl.youtube {
		width: 92%;
		margin-right: auto;
		margin-left: auto;
	}
	.page div.item {
		box-sizing: border-box;
		border: solid 1px #A3A5AC;
		height: 200px;
		text-align: left;
		margin: 0 0 10px 0;
		position: relative;
		background-repeat: no-repeat;
		background-position: top left;
		background-size: cover;
	}
	.page div.item_list_A div.item {
		background-image: url("/parts/contents/google-info/bg_M_green.jpg");
	}
	.page div.item_list_A div.item a {
		display: block;
		width: 100%;
	}
	.page div.item_list_A div.item div.upper {
		z-index: 2;
		position: absolute;
		top: 0;
		left: 0;
		background-repeat: no-repeat;
		background-position: top 10px left 15px;
		padding: 0;
		box-sizing: border-box;
	}
	.page div.item_list_A div.item div.upper {
		color: #1C1C1C;
		text-shadow:
		2px  2px 0px rgba(255, 255, 255, 0.70),
		-2px  2px 0px rgba(255, 255, 255, 0.70),
		2px -2px 0px rgba(255, 255, 255, 0.70),
		-2px -2px 0px rgba(255, 255, 255, 0.70),
		2px  0px 0px rgba(255, 255, 255, 0.70),
		0px  2px 0px rgba(255, 255, 255, 0.70),
		-2px  0px 0px rgba(255, 255, 255, 0.70),
		0px -2px 0px rgba(255, 255, 255, 0.70);
	}
	.page div.item_list_A div.item div.upper {
		height: 165px;
	}
	.page div.item_list_A div.item h4 {
		background-repeat: no-repeat;
		background-position: top left;
		height: 60px;
		width: 80%;
		font-size: 1.2em;
		padding: 10px 0 0 10px;
		margin: 0;
		background-size: 15%;
		line-height: 130%;
	}
	.page div.item_list_A div.item div.spec {
		box-sizing: border-box;
		margin: 0 0 0 10px;
		display: inline-block;
	}
	.page div.item_list_A  div.item div.spec {
		border-top: solid 1px #1C1C1C;
	}
	.page div.item_list_A div.item div.spec h5 {
		font-size: 1em;
		padding: 7px 0 0 0;
		margin: 0;
	}
	.page div.item_list_A div.item div.spec p{
		font-size: 0.8em;
		padding: 0;
		margin: 0;
		line-height: 125%;
	}
	.page div.item_list_A div.item p.photo {
		z-index: 1;
		position: absolute;
		text-align: right;
		margin: 0;
		padding: 0;
		width: 180px;
		height: 140px;
		top: 5px;
		right: 5px;
	}
	.page div.item_list_A div.item p.photo img {
		max-width: 100%;
		max-height: 100%;
	}
	.page div.item_list_A div.item div.bottom {
		position: absolute;
		left: 0;
		bottom: 0;
		z-index: 0;
		display: flex;
		align-items: center;
		background-repeat: no-repeat;
		background-size: 20px 20px;
		background-position: right 7px center;
		width: 100%;
		height: 50px;
		box-sizing: border-box;
		padding: 0 10px;
	}
	.page div.item_list_A  div.item div.bottom {
		background-color: #E0E6DE;
		background-image: url("/parts/contents/google-info/common/arrow_gray.svg");
	}
	.page div.item_list_A div.item p.status {
		font-weight: bold;
		font-size: 0.8em;
		padding: 0 5px;
		margin: 0 8px 0 0;
		height: 22px;
	}
	.page div.item_list_A div.item p.new {
		color: #000;
		background-color: #FFA100;
	}
	.page div.item_list_A div.item p.used {
		color: #FFF;
		background-color: #707B7C;
	}
	.page div.item_list_A div.item p.price {
		font-weight: bold;
		color: #FF0000;
		margin: 0 12px 0 0;
		font-size: 2em;
	}
	.page div.item_list_A div.item p.price:after {
		content: "円";
		font-size: 0.75em;
		padding: 0 0 0 3px;
	}
	.page div.item_list_A div.item ul.function {
		display: flex;
		font-weight: bold;
		padding: 0;
		margin: 0;
		list-style: none;
	}
	.page div.item_list_A div.item ul.function li {
		width: 20px;
		display: inline-block;
		color: #1C1C1C;
		margin: 0 3px 0 0;
	}
	.page dl.func_icon {
		padding: 0;
		margin: 0 auto;
		color: #1C1C1C;
		font-size: 0.8em;
		text-align: left;
		display: flex;
		align-items: center;
		flex-wrap: wrap;
	}
	.page dl.func_icon dt {
		font-weight: bold;
		padding: 5px 3px;
		margin: 0;
		background-color: #e7e7e7;
		display: none;
	}
	.page dl.func_icon dd {
		padding: 0 5px 5px 0;
		margin: 0;
	}
	.page dl.func_icon dd img {
		width: 20px;
		padding: 0 5px 0 0;
	}
	.page .item_list_B {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin: 1em auto 0;
		width: 94%;
	}
	.page .item_list_B > div {
		margin: 0 0 2em 0;
		width: 48.5%;
	}
	.page .item_list_B > div > a {
		display: block;
		text-decoration: none;
		color: #000;
	} 
	.page .item_list_B > div > a:nth-of-type(1) {
		border-bottom: dotted 1px var(--google-green);
	}
	.page .item_list_B h4 {
		background-color: var(--google-green);
		color: #FFF;
		font-size: 1em;
		padding: 0.2em 0 0;
		margin: 0;
		text-align: center;
	}
	.page .item_list_B h4 + p {
		margin: 0 auto;
		border: solid 1px #A6A6A6;
		border-top: none;
		line-height: 1em;
	}
	.page .item_list_B h5 {
		color: var(--google-green);
		font-size: 0.7em;
		height: 1.75em;
		margin: 0.5em 0 0 0;
		text-decoration: underline;
		display: -webkit-box;
		-webkit-line-clamp: 1;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}
	.page .item_list_B .spec {
		font-size: 0.6em;
		line-height: 140%;
		text-align: left;
	}
	.page .item_list_B .price p {
		color: #CC0000;
		font-size: 1.2em;
		font-weight: bold;
		text-align: left;
	}
	.page .item_list_B .price p::after {
		background-color: var(--google-green);
		border-radius: 3px;
		color: #FFF;
		content: "詳細 ▶";
		font-size: 0.3em;
		font-weight: normal;
		padding: 0.2em 0.3em;
	}
	.page .item_list_B .price p span {
		color: #CC0000;
		font-size: 0.65em;
		padding: 0 0 0 0.1em;
	}
	.page .item_list_B .price p span::after {
		color: #000;
		content: "（税込）";
		font-size: 0.8em;
		font-weight: normal;
	}
	.page .bn_list p {
		margin: 0 0 1em;
	}
	.page dl.youtube {
		background-color: var(--light-gray);
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin: 1.25em auto 2em;
		padding: 1.25em;
	}
	.page dl.youtube dt {
		color: var(--dark-gray);
		font-size: 1.65em;
		font-weight: bold;
		margin-bottom: 0.25em;
		text-align: center;
		width: 100%;
	}
	.page dl.youtube dd {
		background-color: var(--dark-gray);
		margin: 0.65em 0 0 0;
		width: 49%;
	}
	.page dl.youtube dd p {
		background-color: var(--light-gray);
		font-size: 0.8em;
		text-align: center;
	}
	.page dl.youtube dd img {
		opacity: 0.65;
	}
	.page dl.youtube dd:last-of-type {
		display: none;
	}
	.page .logo {
		width: 92%;
		margin: 1em auto 0;
		text-align: center;
	}
	.page .logo p {
		text-align: center;
	}
	.page .logo img {
		width: 280px;
		margin: 1em auto;
		height: auto
	}
	.page p.trademark {
		font-size: 12px;
		margin: 1em;
	}
}