@charset 'utf-8';

html.scroll {
	scroll-behavior: smooth;
	scroll-padding-top: 6.5rem;
}

@media screen and (min-width: 1440px) {
	html.scroll {
		scroll-padding-top: 65px;
	}
}

@media screen and (max-width: 768px) {
	html.scroll {
		scroll-padding-top: 8.5em;
	}
	.back_to_top {
		padding: 5px;
	}
}

/* pc-sp */
.main_contents .pc-inline,
.main_contents .sp-inline,
.main_contents .pc-flx,
.main_contents .sp-flx {
	display: none !important;
}

@media screen and (min-width: 769px) {
	.main_contents .pc-inline {
		display: inline !important;
	}

	.main_contents .pc-flx {
		display: flex !important;
	}
}

@media screen and (max-width: 768px) {
	.main_contents .sp-inline {
		display: inline !important;
	}

	.main_contents .sp-flx {
		display: flex !important;
	}
}


/* main_contents style */
.main_contents {
	position: relative;
	padding: 30px 0 0 0;
}

@media screen and (max-width: 1200px) {
	.main_contents {
		padding: 50px 0 0 0;
	}
}

@media screen and (max-width: 900px) {
	.main_contents {
		padding: 50px 0 0 0;
	}
}

@media screen and (max-width: 768px) {
	.main_contents {
		overflow-x: hidden;
		word-break: normal;
		padding: 55px 0 0 0;
	}
}

.main_contents .content {
	position: relative;
	width: 115.2rem;
	margin: 0 auto
}

@media screen and (min-width: 1440px) {
	.main_contents .content {
		width: 1152px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents .content {
		width: 32.4rem;
		margin: 4rem auto 0;
	}
}

.main_contents h2 {
	margin: 5.6rem 0 2.7rem;
	font-size: 3.8rem;
	font-weight: 400;
	line-height: 1.5;
	text-align: center;
	letter-spacing: .04em;
}

@media screen and (min-width: 1440px) {
	.main_contents h2 {
		margin: 56px 0 27px;
		font-size: 38px;
		letter-spacing: .04em;
	}
}

@media screen and (max-width: 768px) {
	.main_contents h2 {
		margin: 5rem 0 2rem;
		font-size: 2.8rem;
		letter-spacing: .12rem;
	}
}

.main_contents h3 {
	font-size: 3.2rem;
	font-weight: 400;
	line-height: 1.6;
	letter-spacing: .128rem;
	margin-bottom: 1.5rem;
}

@media screen and (min-width: 1440px) {
	.main_contents h3 {
		font-size: 32px;
		letter-spacing: 1.28px;
		margin-bottom: 15px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents h3 {
		font-size: 2rem;
		line-height: 1.5;
		letter-spacing: .088rem;
	}
}

.main_contents h4 {
	margin: 1.6rem 0 0;
	font-size: 2.2rem;
	font-weight: 400;
	line-height: 3rem;
}

@media screen and (min-width: 1440px) {
	.main_contents h4 {
		margin: 16px 0 0;
		font-size: 22px;
		line-height: 30px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents h4 {
		margin: 1.2rem 0 0;
		font-size: 2rem;
		line-height: 1.5;
		letter-spacing: .072rem;
	}
}

.main_contents section {
	margin: 16rem 0 0;
	max-width: 1440px;
}

@media screen and (min-width: 1440px) {
	.main_contents section {
		margin: 160px auto 0;
	}
}

@media screen and (max-width: 768px) {
	.main_contents section {
		margin: 9rem 0 0
	}
}

.main_contents p {
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 2;
	letter-spacing: .02em;
}

@media screen and (min-width: 1440px) {
	.main_contents p {
		font-size: 16px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents p {
		font-size: 1.5rem;
		line-height: 1.6;
		text-align: left;
	}
}


.main_contents a {
	color: inherit;
	text-decoration: inherit;
	background-color: transparent;
}

.main_contents img {
	display: block;
	width: 100%;
	max-width: 100%;
	height: 100%;
	object-fit: cover;
	pointer-events: none;
}

.main_contents svg {
	display: block;
	width: 100%;
	height: auto;
}

.main_contents video {
	display: block;
	width: 100%;
	height: auto;
	vertical-align: middle;
}

.main_contents .annotation {
	margin-top: 2rem;
}

@media screen and (min-width: 1440px) {
	.main_contents .annotation {
		margin-top: 20px;
	}
}

.main_contents .annotationText {
	display: flex;
	flex-direction: column;
	gap: .6rem;
	font-size: 1.3rem;
	line-height: 1.6;
	letter-spacing: .026rem;
	opacity: .64;
}

@media screen and (min-width: 1440px) {
	.main_contents .annotationText {
		gap: 6px;
		font-size: 13px;
	}
}

.main_contents .annotationText > div > span {
	margin: 0 .5rem 0 0;
	font-size: 100%;
}

@media screen and (min-width: 1440px) {
	.main_contents .annotationText > div > span {
		margin: 0 5px 0 0;
	}
}

.main_contents .small {
	font-size: 0.7em;
}

.main_contents .justify-center {
	justify-content: center;
}

.main_contents .items-centerf {
	align-items: center;
}

/* flex, flex-order */

.main_contents .flex {
	display: flex;
}

.main_contents .flex_b-60 {
	flex-basis: 60%;
}

.main_contents .flex_b-50 {
	flex-basis: 50%;
}

.main_contents .order0 {
	order: 0;
}

.main_contents .order1 {
	order: 1;
}

.main_contents .order2 {
	order: 2;
}

.main_contents .order3 {
	order: 3;
}


.main_contents .flex_b-40 {
	flex-basis: 40%;
}

@media screen and (max-width: 768px) {
	.main_contents .sp-flex-column {
		display: flex;
		flex-direction: column;
	}

		.main_contents .sp-flex-column .order0 {
			order: 0;
		}

		.main_contents .sp-flex-column .order1 {
			order: 1;
		}

		.main_contents .sp-flex-column .order2 {
			order: 2;
		}
}

@media screen and (max-width: 768px) {
	.main_contents .sp_mb0 {
		margin-bottom: 0 !important;
	}

	.main_contents .sp_mt4 {
		margin-top: 4rem !important;
	}
}

/* pointer-event */
.main_contents .p_none {
	pointer-events: none;
}

/* text-aling */
.main_contents .taL {
	text-align: left;
}

.main_contents .taR {
	text-align: right;
}

.main_contents .taR-L {
	text-align: right;
}

@media screen and (max-width: 768px) {
	.main_contents .taR-L {
		text-align: left;
	}
}

.main_contents .taC {
	text-align: center;
}

.main_contents .m0a {
	margin: 0 auto;
}

/* sp-100vw */
@media screen and (max-width: 768px) {
	.main_contents .sp100vw {
		width: 100vw;
		max-width: unset;
		margin-left: calc(-50vw + 50%);
		margin-right: calc(-50vw + 50%);
	}
}

/*MV*/
.main_contents #mv {
	width: 115.2rem;
	height: 51.2rem;
	margin: 0 auto;
}

@media screen and (min-width: 1440px) {
	.main_contents #mv {
		width: 1152px;
		height: 512px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #mv {
		width: 100%;
		height: auto;
	}
}

.main_contents .mv_swiper .swiper-wrapper {
	padding: 0 0 40px;
	overflow: hidden;
}

.main_contents .mv_swiper .swiper-pagination {
	text-align: right
}

.main_contents .mv_swiper .swiper-pagination-bullets.swiper-pagination-horizontal {
	bottom: 0;
	padding: .3px 7rem 0 0;
	line-height: 1;
}

@media screen and (max-width: 768px) {
	.main_contents .mv_swiper .swiper-pagination-bullets.swiper-pagination-horizontal {
		padding: .3rem 4rem 0 0;
	}
}

.main_contents .mv_swiper .swiper-pagination-bullets .swiper-pagination-bullet {
	margin: 0;
}

.main_contents .mv_swiper .circle-pagination {
	position: relative;
	display: inline-block;
	width: 25px;
	height: inherit;
	text-align: center;
	cursor: pointer;
	background-color: #fff;
	outline: none;
	opacity: 1;
}

	.main_contents .mv_swiper .circle-pagination .circle-pagination__inner {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 13px;
	}

		.main_contents .mv_swiper .circle-pagination .circle-pagination__inner:before {
			position: absolute;
			top: 50%;
			left: 50%;
			width: 5px;
			height: 5px;
			content: "";
			background-color: #9d9d8f;
			border-radius: 50%;
			transform: translate(-50%, -50%);
		}

	.main_contents .mv_swiper .circle-pagination.swiper-pagination-bullet-active .circle-pagination__inner:before {
		background-color: #000;
	}

.main_contents .mv_swiper .circle-pagination__inner svg {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: rotate(-90deg);
	transform: translate(-50%, -50%) rotate(-90deg);
}

.main_contents .mv_swiper .circle-pagination__inner circle {
	fill: transparent;
	stroke: #9d9d8f;
	stroke-width: 1.5;
	animation: circle 5s linear forwards;
}

.main_contents .mv_swiper .circle-pagination:not(.swiper-pagination-bullet-active) .circle-pagination__inner svg {
	display: none;
}

@keyframes circle {
	0% {
		stroke-dasharray: 0 69
	}

	99.9%, to {
		stroke-dasharray: 69 69
	}
}

.main_contents .mv_swiper .button-auto-play {
	position: absolute;
	right: 1.7rem;
	bottom: 5px;
	z-index: 11;
	display: block;
	width: 15px;
	margin: 0 4rem 0 auto;
}

@media screen and (max-width: 768px) {
	.main_contents .mv_swiper .button-auto-play {
		right: 0;
		margin: 0 2rem 0 auto;
	}
}

.main_contents .mv_swiper .button-auto-play {
	margin: 0 2rem 0 0;
}

@media screen and (max-width: 768px) {
	.main_contents .mv_swiper .button-auto-play {
		bottom: 0.4rem;
	}
}

.stop .main_contents .mv_swiper .button-auto-play {
	bottom: 7px;
}

.stop .swiper-pagination-bullet-active > .circle-pagination__inner > svg {
	display: none;
}


.main_contents .mv_swiper .button-auto-play img.stop,
.main_contents .mv_swiper .button-auto-play.stop img.play {
	display: block;
}

.main_contents .mv_swiper .button-auto-play.stop img.stop,
.main_contents .mv_swiper .button-auto-play img.play {
	display: none;
}

/*.main_contents .mv_swiper .swiper-pagination-bullets .swiper-pagination-bullet {
	display: inline-block;
	margin: 13px;
	cursor: pointer;
	outline: none;
	opacity: 1;
	background-color: #9d9d8f;
}

.main_contents .mv_swiper .swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active {
	background-color: #000;
}*/

/* Toc */
.main_contents #toc {
}

	.main_contents #toc .content {
		text-align: center;
	}

@media screen and (max-width: 768px) {
	.main_contents #toc p {
		line-height: 2;
	}
}

.main_contents .movieLink_wrap {
	display: inline-flex;
	gap: 1.6rem;
	margin: 4rem 0 0;
}

@media screen and (min-width: 1440px) {
	.main_contents .movieLink_wrap {
		gap: 16px;
		margin: 40px 0 0;
	}
}

@media screen and (max-width: 768px) {
	.main_contents .movieLink_wrap {
		margin: 5.8rem 0 0;
	}
}

.main_contents a.movieLink_wrap circle {
	fill: #FFF;
	fill-opacity: .2;
	transition: fill .3s;
}

.main_contents a.movieLink_wrap:hover circle {
	fill: #000;
}


.main_contents .movieLink {
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 3.52rem;
	letter-spacing: .02em;
	border-bottom: 1px solid #403d33;
}

@media screen and (min-width: 1440px) {
	.main_contents .movieLink {
		font-size: 16px;
		line-height: 35px;
	}
}

.main_contents div.textLink_wrap {
	margin: 2rem auto;
	font-size: 1.6rem;
	position: relative;
	padding-right: 5rem;
}

@media screen and (min-width: 1440px) {
	.main_contents div.textLink_wrap {
		margin: 20px auto;
		font-size: 16px;
		padding-right: 50px;
	}
}

.main_contents div.textLink_wrap > a {
	position: relative;
}

	.main_contents div.textLink_wrap > a > span {
		display: inline-block;
		border-bottom: 1px solid #000;
		margin-left: 1rem;
	}

@media screen and (min-width: 1440px) {
	.main_contents div.textLink_wrap > a > span {
		margin-left: 10px;
	}
}

.main_contents div.textLink_wrap.for_bgBlack > a > span {
	border-bottom: 1px solid #FFF;
}

.main_contents div.textLink_wrap > a:after,
.main_contents div.textLink_wrap > a:before {
	content: "";
	display: block;
	font-size: 2.4rem;
	font-weight: 400;
	width: 4rem;
	height: 4rem;
	border-radius: 9999px;
	position: absolute;
	top: 0;
	right: -5rem;
	bottom: 0;
	margin: auto;
}

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

	.main_contents div.textLink_wrap > a:after,
	.main_contents div.textLink_wrap > a:before {
		font-size: 24px;
		width: 40px;
		height: 40px;
		right: -50px;
	}
}

.main_contents div.textLink_wrap > a:after {
	content: "→";
	border: 1px solid #000;
}

.main_contents div.textLink_wrap.blank > a:after {
	content: "";
	background: url("https://aquosmobile.sharp.com.tw/resources/aquos/images/r9pro/buttonLinkBlank.png") no-repeat;
	background-size: 80%;
	background-position: center center;
}

.main_contents div.textLink_wrap.for_bgBlack > a:after {
	border: 1px solid #FFF;
}

.main_contents div.textLink_wrap > a:before {
	content: "";
	background: #000;
	opacity: 0;
	transition: opacity .3s;
}

@media screen and (min-width: 769px) {
	.main_contents div.textLink_wrap > a:hover::before {
		opacity: .2;
	}
}

@media screen and (max-width: 768px) {
	.main_contents div.textLink_wrap > a:active::before {
		background: #000;
	}
}

.main_contents a.campaignLink {
	width: 87%;
	display: block;
	margin: 7rem auto 0;
	border-radius: 16px;
	border: 1px solid #000;
	position: relative;
	background-color: #696969;
}

@media screen and (min-width: 1440px) {
	.main_contents a.campaignLink {
		margin: 70px auto 0;
	}
}

@media screen and (max-width: 768px) {
	.main_contents a.campaignLink {
		width: 100%;
		margin: 5rem auto 0;
	}
}

.main_contents a.campaignLink > img {
	border-radius: 16px;
}

.main_contents a.campaignLink:after {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	inset: 0;
	margin: auto;
	border-radius: 16px;
	background: rgba(0, 0, 0, 0);
	transition: background .3s;
}

@media screen and (min-width: 769px) {
	.main_contents a.campaignLink:hover:after {
		background: rgba(0, 0, 0, 0.2);
	}
}

@media screen and (max-width: 768px) {
	.main_contents a.campaignLink:active:after {
		background: rgba(0, 0, 0, 0.2);
	}
}

/* AnkerLinkArea */
.main_contents .ankerNav_container {
	position: relative;
	width: 114.5rem;
	margin: 8rem auto 0;
}

@media screen and (min-width: 1440px) {
	.main_contents .ankerNav_container {
		width: 1145px;
		margin: 80px auto 0;
	}
}

@media screen and (max-width: 768px) {
	.main_contents .ankerNav_container {
		width: 32.4rem;
		margin: 9rem auto 0;
	}
}

.main_contents .ankerNav_grid {
	display: grid;
	grid-template-areas: "first first first second" "first first first second" "third third forth forth";
	gap: 1rem;
}

@media screen and (max-width: 768px) {
	.main_contents .ankerNav_grid {
		grid-template-areas: "first" "second" "third" "forth";
	}
}

.main_contents .ankerNav_link {
	position: relative;
	overflow: hidden;
}


@media screen and (min-width: 769px) {
	.main_contents .ankerNav_link img {
		transition: transform .3s;
	}

	.main_contents .ankerNav_link:hover img {
		transform: scale(1.05);
	}
}

.main_contents .ankerNav_link[data-gridnum="0"] {
	grid-area: first;
	width: 68rem;
	height: 43rem;
}

@media screen and (min-width: 1440px) {
	.main_contents .ankerNav_link[data-gridnum="0"] {
		width: 680px;
		height: 430px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents .ankerNav_link[data-gridnum="0"] {
		width: auto;
		height: 14em;
	}
}

.main_contents .ankerNav_link[data-gridnum="1"] {
	grid-area: second;
	width: 45.5rem;
	height: 43rem;
}

@media screen and (min-width: 1440px) {
	.main_contents .ankerNav_link[data-gridnum="1"] {
		width: 455px;
		height: 430px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents .ankerNav_link[data-gridnum="1"] {
		width: auto;
		height: 14rem;
	}
}

.main_contents .ankerNav_link[data-gridnum="2"] {
	grid-area: third;
	width: 55.5rem;
	height: 25rem;
}

@media screen and (min-width: 1440px) {
	.main_contents .ankerNav_link[data-gridnum="2"] {
		width: 555px;
		height: 250px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents .ankerNav_link[data-gridnum="2"] {
		width: auto;
		height: 14rem;
	}
}

.main_contents .ankerNav_link[data-gridnum="3"] {
	grid-area: forth;
	width: 58em;
	height: 25rem;
}

@media screen and (min-width: 1440px) {
	.main_contents .ankerNav_link[data-gridnum="3"] {
		width: 580px;
		height: 250px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents .ankerNav_link[data-gridnum="3"] {
		width: auto;
		height: 14rem;
	}
}

.main_contents .ankerNavTxt_wrap {
	position: absolute;
	bottom: 2.4rem;
	left: 3rem;
	color: #FFF;
}

@media screen and (min-width: 1440px) {
	.main_contents .ankerNavTxt_wrap {
		bottom: 24px;
		left: 30px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents .ankerNavTxt_wrap {
		bottom: 1.6rem;
		left: 1.6rem;
		text-shadow: 0 0 5px #000;
	}

	.main_contents #toc .ankerNavTxt_wrap p {
		line-height: 1.5;
	}
}

.main_contents .ankerNavTxt_sub {
	font-size: 1.4rem;
	font-weight: 400;
	line-height: 2.1rem;
}

@media screen and (min-width: 1440px) {
	.main_contents .ankerNavTxt_sub {
		font-size: 14px;
		line-height: 21px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents .ankerNavTxt_sub {
		font-size: 1.1rem;
		line-height: 1.65rem;
	}
}

.main_contents .ankerNavTxt_main {
	font-size: 2rem;
	font-weight: 500;
	line-height: 3.2rem;
}

@media screen and (min-width: 1440px) {
	.main_contents .ankerNavTxt_main {
		font-size: 20px;
		line-height: 32px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents .ankerNavTxt_main {
		font-size: 1.4rem;
		line-height: 2.1rem;
	}
}

.main_contents .ankerNav_link[data-gridnum="4"] .ankerNavTxt_sub,
.main_contents .ankerNav_link[data-gridnum="4"] .ankerNavTxt_main {
	color: #FFF;
}



/* section */
.main_contents .hidden-x {
	overflow-x: hidden;
}

@media screen and (min-width: 1440px) {
	.main_contents .cover-maxwidth {
		max-width: 1440px;
		margin-left: auto;
		margin-right: auto;
	}
}


/* #camera */
.main_contents #camera {
	background: #020203;
	color: #FFF;
}

	.main_contents #camera h2.cameraHead {
		padding: 13rem 0 0;
		margin: 0 auto;
	}

@media screen and (min-width: 1440px) {
	.main_contents #camera h2.cameraHead {
		padding: 130px 0 0;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #camera h2.cameraHead {
		background: #191919;
		padding: 5rem 0 0;
		background-size: cover;
	}
}

.main_contents #camera .cameraHead_wrap {
	background: #000
}

@media screen and (max-width: 768px) {
	.main_contents #camera .cameraHead_wrap {
		background: #191919
	}
}

.main_contents #camera .cameraImg {
	margin-bottom: 22rem;
}

@media screen and (min-width: 1440px) {
	.main_contents #camera .cameraImg {
		margin-bottom: 220px;
	}
}



.main_contents #camera .camera_slide02 {
	position: relative;
	height: 100vh;
}

	.main_contents #camera .camera_slide02 img {
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		height: auto;
		object-fit: contain;
	}

	.main_contents #camera .camera_slide02 .op-black {
		background-color: #000;
		opacity: 1;
		position: absolute;
		inset: 0;
		margin: auto;
	}

	.main_contents #camera .camera_slide02 .camera_slide02_txt {
		position: absolute;
		inset: 0;
		margin: auto;
		display: flex;
		justify-content: center;
		align-items: center;
		text-shadow: 0 0 8px #000;
	}

/*.main_contents #camera .camera_slide02.pc-only .camera_slide02_txt {
	/*transition: opacity 0.4s;
	opacity: 0;
}

.main_contents #camera .camera_slide02.pc-only .camera_slide02_txt.on {
	opacity: 1;
}*/

.main_contents #camera .camera_intro .itro_head {
	position: relative;
	margin: 25rem auto 4rem;
}

@media screen and (min-width: 1440px) {
	.main_contents #camera .camera_intro .itro_head {
		margin: 250px auto 40px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #camera .camera_intro .itro_head {
		margin: 23rem auto 4rem;
	}
}

.main_contents #camera .camera_intro h3 {
	font-size: 3.8rem;
}

@media screen and (min-width: 1440px) {
	.main_contents #camera .camera_intro h3 {
		font-size: 38px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #camera .camera_intro h3 {
		font-size: 2rem;
		line-height: 1.7;
	}
}

.main_contents #camera .camera_intro h3 > span {
	font-size: 2.4rem;
}

@media screen and (min-width: 1440px) {
	.main_contents #camera .camera_intro h3 > span {
		font-size: 24px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #camera .camera_intro h3 > span {
		font-size: 1.2rem;
	}
}


.main_contents #camera .camera_intro.basic .intro_txt {
	position: absolute;
	inset: 0;
	margin: auto;
	display: flex;
	align-items: center;
}

@media screen and (max-width: 768px) {
	.main_contents #camera .camera_intro.basic .intro_txt {
		position: unset;
		display: block;
		margin-top: -6rem;
	}
}

.main_contents #camera .camera_intro.wide .intro_txt {
	margin-top: -10rem;
}

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

	.main_contents #camera .camera_intro.wide .intro_txt,
	.main_contents #camera .camera_intro.telephoto .intro_txt {
		margin-top: -7rem;
	}
}


@media screen and (min-width: 1440px) {
	.main_contents #camera .camera_intro.wide .intro_txt {
		margin-top: -100px;
	}
}

@media screen and (min-width: 769px) {
	.main_contents #camera .camera_intro.telephoto .intro_txt {
		margin-top: 2rem;
	}
}

@media screen and (min-width: 1440px) {
	.main_contents #camera .camera_intro.telephoto .intro_txt {
		margin-top: 20px;
	}
}

.main_contents #camera .camera_intro.basic .intro_txt .content > p {
	width: 53rem;
}

@media screen and (min-width: 1440px) {
	.main_contents #camera .camera_intro.basic .intro_txt .content > p {
		width: 530px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #camera .camera_intro.basic .intro_txt .content > p {
		width: unset;
	}
}

.main_contents #camera .camera_intro .introImg_wrap {
	display: flex;
}

@media screen and (max-width: 768px) {
	.main_contents #camera .camera_intro .introImg_wrap {
		flex-direction: column;
		margin: 4rem 0 0;
		width: 100%;
	}
}

.main_contents #camera .camera_intro .introImg_wrap.gap {
	gap: 1.5rem;
}

@media screen and (min-width: 1440px) {
	.main_contents #camera .camera_intro .introImg_wrap.gap {
		gap: 15px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #camera .camera_intro .introImg_wrap.sp_row {
		flex-direction: row;
		gap: 0;
		margin: 0;
	}
}

.main_contents #camera .camera_intro .telephoto_img_wrap {
	display: flex;
	flex-direction: column;
	gap: 4rem;
}

@media screen and (min-width: 1440px) {
	.main_contents #camera .camera_intro .telephoto_img_wrap {
		gap: 40px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #camera .camera_intro .telephoto_img_wrap {
		width: 100%;
		gap: 2rem;
	}
}


.main_contents #camera .camera_intro .telephoto_img_wrap .introImg_wrap {
	gap: .5rem;
}

@media screen and (min-width: 1440px) {
	.main_contents #camera .camera_intro .telephoto_img_wrap .introImg_wrap.sp_row {
		gap: 5px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #camera .camera_intro .telephoto_img_wrap .introImg_wrap {
		gap: 0;
		margin-top: 0;
	}

		.main_contents #camera .camera_intro .telephoto_img_wrap .introImg_wrap.sp_row {
			gap: .3rem;
		}
}

.main_contents #camera .camera_intro .telephoto_img_wrap .introImg_wrap.sp_row div {
	position: relative;
}

.main_contents #camera .camera_intro .telephoto_img_wrap .zoom_x1:after,
.main_contents #camera .camera_intro .telephoto_img_wrap .zoom_x20:after {
	content: "";
	position: absolute;
	bottom: 4rem;
	left: 0;
	right: 0;
	margin: auto;
	height: 4.5rem;
	width: 6.2rem;
	background-image: url(https://aquosmobile.sharp.com.tw/resources/aquos/images/r9pro/img_camera_02_x1.png);
	background-repeat: no-repeat;
	background-size: contain;
}

.main_contents #camera .camera_intro .telephoto_img_wrap .zoom_x20:after {
	width: 7.2rem;
	background-image: url(https://aquosmobile.sharp.com.tw/resources/aquos/images/r9pro/img_camera_02_x20.png);
}

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

	.main_contents #camera .camera_intro .telephoto_img_wrap .zoom_x1:after,
	.main_contents #camera .camera_intro .telephoto_img_wrap .zoom_x20:after {
		bottom: 40px;
		height: 45px;
		width: 62px;
	}

	.main_contents #camera .camera_intro .telephoto_img_wrap .zoom_x20:after {
		width: 72px;
	}
}

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

	.main_contents #camera .camera_intro .telephoto_img_wrap .zoom_x1:after,
	.main_contents #camera .camera_intro .telephoto_img_wrap .zoom_x20:after {
		bottom: 1rem;
		height: 2.2rem;
		width: 3rem;
		background-image: url(https://aquosmobile.sharp.com.tw/resources/aquos/images/r9pro/img_camera_02_x1_sp.png);
	}

	.main_contents #camera .camera_intro .telephoto_img_wrap .zoom_x20:after {
		width: 3.6rem;
		background-image: url(https://aquosmobile.sharp.com.tw/resources/aquos/images/r9pro/img_camera_02_x20_sp.png);
	}
}

.main_contents #camera .camera_intro.commonFunc .commonFunc_flx {
	display: flex;
	gap: 3rem;
}

@media screen and (min-width: 1440px) {
	.main_contents #camera .camera_intro.commonFunc .commonFunc_flx {
		gap: 30px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #camera .camera_intro.commonFunc .commonFunc_flx {
		flex-direction: column;
		gap: 0;
	}
}

.main_contents #camera .camera_intro.commonFunc .commonFunc_flx > div:first-child {
	width: 17rem;
}

@media screen and (min-width: 1440px) {
	.main_contents #camera .camera_intro.commonFunc .commonFunc_flx > div:first-child {
		width: 170px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #camera .camera_intro.commonFunc .commonFunc_flx > div:first-child {
		width: 10rem;
	}
}

.main_contents #camera .camera_intro.commonFunc .commonFunc_flx > div:first-child > img {
	height: auto;
}

.main_contents #camera .camera_intro.commonFunc .commonFunc_flx > div:last-child {
	flex: 1;
}


.main_contents #camera .camera_intro.commonFunc > .content {
	margin: 25rem auto;
}

@media screen and (min-width: 1440px) {
	.main_contents #camera .camera_intro.commonFunc > .content {
		margin: 250px auto;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #camera .camera_intro.commonFunc > .content {
		margin: 18rem auto;
	}
}

.main_contents #camera .camera_intro.commonFunc .introImg_wrap {
	margin-top: 4rem;
}

@media screen and (min-width: 1440px) {
	.main_contents #camera .camera_intro.commonFunc .introImg_wrap {
		margin-top: 40px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #camera .camera_intro.commonFunc .introImg_wrap {
		width: 36.4rem;
		margin-left: -2rem;
	}
}


.main_contents #camera .camera_intro.commonFunc .func_flex {
	gap: 10rem;
	display: flex;
}

@media screen and (min-width: 1440px) {
	.main_contents #camera .camera_intro.commonFunc .func_flex {
		gap: 100px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #camera .camera_intro.commonFunc .func_flex {
		flex-direction: column;
		gap: 8rem;
	}
}

.main_contents #camera .camera_intro.commonFunc .func_flex h4 {
	text-align: center;
}

@media screen and (max-width: 768px) {
	.main_contents #camera .camera_intro.commonFunc .func_flex h4 {
		text-align: left;
	}
}

.main_contents #camera .camera_intro.commonFunc .func_flex img {
	width: 20rem;
	height: auto;
	margin: auto;
}

@media screen and (min-width: 1440px) {
	.main_contents #camera .camera_intro.commonFunc .func_flex img {
		width: 200px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #camera .camera_intro.commonFunc .func_flex img {
		width: 13rem;
		margin-left: 0;
	}
}

.main_contents #camera h4 {
	margin: 0 0 3rem;
}

@media screen and (min-width: 1440px) {
	.main_contents #camera h4 {
		margin: 0 0 30px;
	}
}

.main_contents #camera h2.exp {
}

@media screen and (min-width: 1440px) {
	.main_contents #camera h2.exp {
	}
}

@media screen and (max-width: 768px) {
	.main_contents #camera h2.exp {
		background: unset;
		padding: 0 0 2rem;
	}
}

.main_contents #camera .cameraKey_wrap {
	position: relative;
}

@media screen and (min-width: 1440px) {
	.main_contents #camera .cameraKey_wrap {
	}
}

@media screen and (max-width: 768px) {
	.main_contents #camera .cameraKey_wrap {
		position: relative;
		margin-bottom: 2rem;
	}
}

.main_contents #camera .cameraKey_wrap > div {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	display: grid;
	align-content: flex-end;
	padding: 0 52rem 5rem 0;
}

@media screen and (min-width: 1440px) {
	.main_contents #camera .cameraKey_wrap > div {
		padding: 0 520px 50px 0;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #camera .cameraKey_wrap > div {
		position: relative;
		right: unset;
		margin: 4rem auto 5rem;
		width: 32.4rem;
		display: block;
		padding: 0;
	}
}

@media screen and (min-width: 1440px) {
	.main_contents #camera .cameraKey_wrap > div h4 {
		margin: 0 auto 20px 0;
	}
}

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

.main_contents #camera .cameraLink {
	margin: 0 auto;
	position: relative;
	cursor: pointer;
	background: url(https://aquosmobile.sharp.com.tw/resources/aquos/images/r9pro/img_camera_04-01.jpg) no-repeat;
	background-size: 100%;
	background-position: center center;
	height: 60rem;
	transition: background-size .3s;
}

@media screen and (min-width: 1440px) {
	.main_contents #camera .cameraLink {
		margin: 0 auto;
		height: 600px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #camera .cameraLink {
		cursor: unset;
		margin: 10rem 0 0;
		background: unset;
	}
}

.main_contents #camera .cameraLink:hover {
	background-size: 105%;
}

.main_contents #camera .cameraLink::before {
	content: "";
	display: block;
	position: absolute;
	inset: 0;
	margin: auto;
	background-color: #000;
	opacity: 0;
	pointer-events: none;
	transition: opacity .3s;
}

@media screen and (max-width: 768px) {
	.main_contents #camera .cameraLink::before {
		content: unset;
	}
}

.main_contents #camera .cameraLink:hover::before {
	opacity: .3;
}

@media screen and (min-width: 769px) {
	.main_contents #camera .cameraLink a.imgLink {
		display: block;
		position: absolute;
		inset: 0;
		margin: auto;
		z-index: 2;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #camera .cameraLink .textLink_wrap {
		text-align: center;
		margin-top: 5rem;
	}
}

.main_contents #camera .cameraLink .cameraLinkTxt_wrap {
	position: absolute;
	right: 0;
	left: 0;
	bottom: 13rem;
	margin: auto;
	z-index: 1;
}


@media screen and (min-width: 1440px) {
	.main_contents #camera .cameraLink .cameraLinkTxt_wrap {
		bottom: 130px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #camera .cameraLink .cameraLinkTxt_wrap {
		position: relative;
		bottom: unset;
		padding-bottom: 3rem;
	}
}

.main_contents #camera .cameraLink .cameraLinkTxt_wrap .content {
	position: relative;
}

	.main_contents #camera .cameraLink .cameraLinkTxt_wrap .content::after {
		content: "";
		display: block;
		width: 8rem;
		height: 8rem;
		background: url('https://aquosmobile.sharp.com.tw/resources/aquos/images/r9pro/arrow_link.png') no-repeat;
		background-size: contain;
		position: absolute;
		right: 0;
		top: 0;
		bottom: 0;
		margin: auto;
	}

@media screen and (min-width: 1440px) {
	.main_contents #camera .cameraLink .cameraLinkTxt_wrap .content::after {
		width: 80px;
		height: 80px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #camera .cameraLink .cameraLinkTxt_wrap .content::after {
		content: unset;
	}
}

/* #design */
.main_contents section#design .headImg_wrap {
	text-align: center;
	background: url(https://aquosmobile.sharp.com.tw/resources/aquos/images/r9pro/img_index_mv_02_1.jpg) no-repeat;
	background-size: cover;
	background-position: center;
	height: 83.2rem;
}

@media screen and (min-width: 1440px) {
	.main_contents section#design .headImg_wrap {
		height: 832px;
		background-size: contain;
	}
}

@media screen and (max-width: 768px) {
	.main_contents section#design .headImg_wrap {
		background: url(unset);
		height: auto;
		margin-top: 6rem;
	}

	.main_contents section#design .content {
		margin-bottom: 4rem;
	}
}

.main_contents section#design p {
	text-align: center;
}

@media screen and (max-width: 768px) {
	.main_contents section#design div.textLink_wrap .attention_text:after {
		content: "";
		position: absolute;
		bottom: -2.2rem;
		right: 0;
		display: inline-block;
		border-bottom: 0;
		font-size: 1.2rem;
	}
}

.main_contents  .buttonMore_wrap {
	width: 100%;
	height: 5rem;
	position: relative;
}

@media screen and (min-width: 1440px) {
	.main_contents  .buttonMore_wrap {
		height: 50px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents  .buttonMore_wrap {
		height: unset;
	}
}


.main_contents  .buttonMore {
	display: block;
	position: absolute;
	inset: 0;
	margin: auto;
	font-size: 1.6rem;
	position: relative;
	border: 1px solid #000;
	border-radius: 9999px;
	padding: 1.2rem 1.2rem 1.2rem 0;
	width: 18rem;
	text-align: center;
	cursor: pointer;
}

@media screen and (min-width: 1440px) {
	.main_contents  .buttonMore {
		font-size: 16px;
		padding: 12px 12px 12px 0;
		width: 180px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents  .buttonMore {
		position: relative;
		border: unset;
		width: 13rem;
		padding: 0 5rem 0 0;
		text-align: right;
	}
}


@media screen and (min-width: 769px) {
	.main_contents  .buttonMore::before {
		content: "";
		position: absolute;
		inset: 0;
		margin: auto;
		border-radius: 9999px;
		background: #000;
		opacity: 0;
		transition: opacity .3s;
	}

	.main_contents  .buttonMore:hover:before {
		opacity: .2;
	}
}

@media screen and (max-width: 768px) {
	.main_contents  .buttonMore > span {
		border-bottom: 1px solid #000;
		;
	}
}

.main_contents  .buttonMore > span::after {
	content: "";
	display: block;
	width: 2rem;
	height: 2rem;
	background: url("https://aquosmobile.sharp.com.tw/resources/aquos/images/r9pro/buttonMore.png") no-repeat;
	background-size: contain;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 2rem;
	margin: auto;
	transition: all .3s;
}

@media screen and (min-width: 1440px) {
	.main_contents  .buttonMore > span::after {
		width: 20px;
		height: 20px;
		right: 20px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents  .buttonMore > span::after {
		width: 4rem;
		height: 4rem;
		background-size: 50%;
		background-position: center center;
		border: 1px solid #000;
		border-radius: 9999px;
		right: 0;
	}
}

.main_contents  .buttonMore.active > span::after {
	background: url("https://aquosmobile.sharp.com.tw/resources/aquos/images/r9pro/buttonMore_close.png") no-repeat;
	background-size: contain;
}

@media screen and (max-width: 768px) {
	.main_contents  .buttonMore.active > span::after {
		background-size: 50%;
		background-position: center center;
	}
}


.main_contents section#design #designMore {
	display: none;
}

	.main_contents section#design #designMore .flex {
		gap: 3rem;
		margin: 5rem auto;
	}

@media screen and (min-width: 1440px) {
	.main_contents section#design #designMore .flex {
		gap: 30px;
		margin: 50px auto;
	}
}

@media screen and (max-width: 768px) {
	.main_contents section#design #designMore .flex {
		flex-direction: column;
		gap: 9rem;
	}
}

.main_contents section#design #designMore h4 {
	margin: 0 auto 2rem;
}

@media screen and (max-width: 768px) {
	.main_contents section#design #designMore h4 {
		font-size: 2.8rem;
		text-align: center;
	}
}

.main_contents section#design #designMore p {
	text-align: left;
	margin: 0 auto 2rem;
}

@media screen and (max-width: 768px) {
	.main_contents section#design #designMore p {
		/* text-align: center; */
	}

	.main_contents section#design #designMore .img_wrap {
		width: 36.4rem;
		margin-left: -2rem;
	}
}

/* #perfomance panel */
#performance {
	height: 100vh;
	display: flex;
	align-items: center;
	inset: 0 !important;
}

@media screen and (max-width: 768px) {
	#performance {
		height: auto;
		display: block;
	}
}

.main_contents #performance .snapdragon {
	width: 13rem;
	height: auto;
	margin: 2rem auto auto 0;
}

@media screen and (min-width: 1440px) {
	.main_contents #performance .snapdragon {
		width: 130px;
		margin: 20px auto auto 0;
	}
}

.main_contents .pfPanel_area {
	width: 100%;
}

.main_contents .pfPanel_container {
	position: relative;
}

.main_contents .pfPanel_wrapper {
	display: flex;
	gap: 3rem;
	height: 50rem;
}

@media screen and (min-width: 1440px) {
	.main_contents .pfPanel_wrapper {
		gap: 30px;
		height: 500px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents .pfPanel_wrapper {
		flex-direction: column;
		gap: 0;
		height: unset;
		margin-bottom: 3rem;
	}
}

/* PC表示ギミック */
@media screen and (min-width: 769px) {

	.main_contents .pfPanel_wrapper[name="2"],
	.main_contents .pfPanel_wrapper[name="3"],
	.main_contents .pfPanel_wrapper[name="4"] {
		position: absolute;
		top: 30%;
		width: 100%;
		opacity: 0;
		transition: top 0.2s ease-out, opacity 0.2s ease-out;
	}

	.main_contents .pfPanel_wrapper.on {
		top: 0;
		opacity: 1;
	}

	.main_contents .pfPanel_wrapper .pfPanel_txt_pc {
		position: absolute;
		top: 0;
		width: 100%;
		padding-right: 20px;
		opacity: 0;
		transition: opacity 0.3s ease-out;
	}

		.main_contents .pfPanel_wrapper .pfPanel_txt_pc.on {
			opacity: 1;
		}
}

@media screen and (max-width: 768px) {
	.main_contents .pfPanel_wrapper h3 {
		text-align: center;
		margin-top: 2rem;
	}
}

.main_contents .pfPanel_wrapper .pfPanel_img {
	flex-basis: 60%;
}

.main_contents .pfPanel_wrapper .pfPanel_txt {
	position: relative;
	flex-basis: 40%;
	padding: 2rem 2rem 5rem 0;
}

@media screen and (min-width: 1440px) {
	.main_contents .pfPanel_wrapper .pfPanel_txt {
		padding: 20px 20px 50px 0;
	}
}

@media screen and (max-width: 768px) {
	.main_contents .pfPanel_wrapper .pfPanel_txt {
		width: 32.4rem;
		padding: 0;
		margin: 1.5rem auto 2rem;
	}
}

.main_contents .indicators {
	position: absolute;
	left: 0;
	bottom: 0;
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

@media screen and (min-width: 1440px) {
	.main_contents .indicators {
		gap: 10px;
	}
}

.main_contents .indicators .indicator {
	height: 1rem;
	width: 1rem;
	border-radius: 9999px;
	background-color: #CCC;
	transition: background-color .3s;
}

@media screen and (min-width: 1440px) {
	.main_contents .indicators .indicator {
		height: 10px;
		width: 10px;
	}
}

.main_contents .indicators .indicator.active {
	background-color: #000;
}

/* オーディオ・ビジュアル */

@media screen and (max-width: 768px) {
	.main_contents #av .content {
		margin: 0 auto;
	}

	.main_contents #av h2 {
		margin: 2rem auto;
	}

	.main_contents #av h3 {
		text-align: center;
		margin: 1rem auto 40rem;
	}

	.main_contents #av .avDisplay_wrap h3 {
		text-align: left;
		margin: 1.2rem 0;
	}
}

.main_contents #av .av_wrap {
	background: #000000;
	padding-bottom: 15rem;
}

@media screen and (min-width: 1440px) {
	.main_contents #av .av_wrap {
		padding-bottom: 150px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #av .av_wrap {
		padding-bottom: 10rem;
	}
}

.main_contents #av .av_inner {
	background: url(https://aquosmobile.sharp.com.tw/resources/aquos/images/r9pro/img_av_01.jpg) no-repeat;
	background-size: contain;
	background-position: center top;
	padding-top: 3rem;
	color: #FFF;
	text-align: center;
	margin: auto;
}

@media screen and (min-width: 1440px) {
	.main_contents #av .av_inner {
		padding-top: 30px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #av .av_inner {
		background: url(https://aquosmobile.sharp.com.tw/resources/aquos/images/r9pro/img_av_01_sp.jpg) no-repeat;
		background-size: contain;
		padding-top: unset;
		overflow: hidden;
	}

		.main_contents #av .av_inner .content > img {
			margin-bottom: 3rem;
		}
}

.main_contents #av h2 {
	margin-bottom: 77rem;
}

@media screen and (min-width: 1440px) {
	.main_contents #av h2 {
		margin-bottom: 770px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #av h2 {
		margin-bottom: unset;
		margin: 3rem auto 2rem;
	}
}

.main_contents #av .cltxt_wrap {
	width: fit-content;
	text-align: left;
	margin: auto;
}

.main_contents #av .avFunc_flx {
	display: flex;
	gap: 8rem;
	margin: 20rem auto;
}

@media screen and (min-width: 1440px) {
	.main_contents #av .avFunc_flx {
		gap: 80px;
		margin: 200px auto;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #av .avFunc_flx {
		flex-direction: column;
		margin: 7rem auto 12rem;
	}
}

.main_contents #av .avFunc_flx > div {
	flex-basis: 50%;
}

@media screen and (max-width: 768px) {
	.main_contents #av .avFunc_flx > div {
		display: flex;
		flex-direction: column;
	}
}

.main_contents #av .avFunc_flx > div h4 {
	text-align: center;
}

@media screen and (max-width: 768px) {
	.main_contents #av .avFunc_flx > div h4 {
		margin-top: 0;
	}
}

.main_contents #av .avFunc_flx > div > img {
	width: 37.4rem;
	height: auto;
	margin: 2rem auto;
}

@media screen and (min-width: 1440px) {
	.main_contents #av .avFunc_flx > div > img {
		width: 374px;
		margin: 20px auto;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #av .avFunc_flx > div > img {
		width: 25rem;
		margin: 2rem auto 1rem;
	}
}

.main_contents #av .avFunc_flx > div > p {
	text-align: left;
}

@media screen and (max-width: 768px) {
	.main_contents #av .avFunc_flx > div > p {
		margin-top: 1rem;
	}
}

.main_contents #av .avDisplay_wrap {
	text-align: left;
	background: url(https://aquosmobile.sharp.com.tw/resources/aquos/images/r9pro/img_av_02.png) no-repeat;
	background-size: 70rem auto;
	background-position: right top;
	height: 50rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin-bottom: 7rem;
}

	.main_contents #av .avDisplay_wrap .content {
		padding-right: 70rem;
	}

@media screen and (min-width: 1440px) {
	.main_contents #av .avDisplay_wrap .content {
		padding-right: 700px;
	}
}

@media screen and (min-width: 1440px) {
	.main_contents #av .avDisplay_wrap {
		background-size: 700px auto;
		height: 500px;
		margin-bottom: 70px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #av .avDisplay_wrap {
		text-align: center;
		background: url(unset);
		height: unset;
		display: flex;
		flex-direction: column;
		justify-content: center;
		margin-bottom: 7rem;
	}

		.main_contents #av .avDisplay_wrap .content {
			margin-top: 0;
			padding-right: 0;
		}
}

.main_contents #av .avDisplay_wrap h2 {
	text-align: left;
}

.main_contents #av .avDisplay_wrap .igzo {
	width: 18rem;
	height: auto;
	margin: 2rem 0;
}

@media screen and (min-width: 1440px) {
	.main_contents #av .avDisplay_wrap .igzo {
		width: 180px;
		margin: 20px 0;
	}
}

.main_contents #av .avDispFunc_flx {
	display: flex;
	gap: 10rem;
	text-align: center;
}

@media screen and (min-width: 1440px) {
	.main_contents #av .avDispFunc_flx {
		gap: 100px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #av .avDispFunc_flx {
		flex-direction: column;
		gap: 5rem;
	}
}

.main_contents #av .avDispFunc_flx > div {
	flex-basis: 50%;
}

.main_contents #av .avDispFunc_flx img {
	width: 30rem;
	height: auto;
	margin: 2rem auto;
}

@media screen and (min-width: 1440px) {
	.main_contents #av .avDispFunc_flx img {
		width: 300px;
		margin: 20px auto;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #av .avDispFunc_flx img {
		width: 20rem;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #av .avDispFunc_flx > div {
		display: flex;
		flex-direction: column;
	}

		.main_contents #av .avDispFunc_flx > div > p {
			margin-top: 1rem;
		}
}

/* #support */

.main_contents #support {
	margin: 8rem auto 10rem;
}

@media screen and (min-width: 1440px) {
	.main_contents #support {
		margin: 80px auto 100px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents #support {
		margin: 5rem auto 0;
	}
}

.main_contents #support .content .support_wrap {
	border: 1px solid #000;
}

.main_contents #support h2 {
	text-align: center;
	margin-top: 3rem;
}

@media screen and (min-width: 1440px) {
	.main_contents #support h2 {
		margin-top: 30px;
	}
}

.main_contents .supportTextWrap {
	padding: 0 0 2rem;
	text-align: center;
}

@media screen and (min-width: 1440px) {
	.main_contents .supportTextWrap {
		padding: 0 0 20px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents .supportTextWrap {
		padding: 1rem 2rem;
	}
}

.main_contents .supportText {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 38.3rem;
	margin: 0 auto;
	font-size: 2rem;
	line-height: 1.5;
	letter-spacing: .04rem;
}

@media screen and (min-width: 1440px) {
	.main_contents .supportText {
		width: 383px;
		font-size: 20px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents .supportText {
		width: 100%;
		font-size: 1.6rem;
		line-height: 6rem;
		letter-spacing: .032rem;
	}
}

.main_contents .supportText > span {
	display: flex;
	align-items: center;
}

	.main_contents .supportText > span > span {
		margin: 0 1rem 0 .8rem;
		font-size: 5.2rem;
		font-weight: 500;
		line-height: 7.8rem;
	}

@media screen and (min-width: 1440px) {
	.main_contents .supportText > span > span {
		margin: 0 10px 0 8px;
		font-size: 52px;
		line-height: 78px;
	}
}

@media screen and (max-width: 768px) {
	.main_contents .supportText > span > span {
		font-size: 3.2rem;
		font-weight: 500;
		line-height: 1.5;
		letter-spacing: .064rem;
	}
}

.main_contents .supportText + .supportText {
	margin: -1.6rem auto 0;
}

@media screen and (min-width: 1440px) {
	.main_contents .supportText + .supportText {
		margin: -16px auto 0;
	}
}

.main_contents #buy {
	margin: 8rem auto 10rem;
	text-align: center;
}

#buy .buybox{text-align: center; width:100%; margin:auto;}
.buybox .storeicon {
    display: inline-block !important;
    border: 0px !important;
    width: 180px !important;
    height: auto;
    margin-left: 10px;
}

.buybox .storeicon img {width: 150px !important; height: auto; }
#buy .buttonMore_wrap .buttonMore {
	width: 300px;
}

.back_to_top {
	box-sizing: content-box !important;
	font-size: 0.714rem !important;
	text-transform: none !important;
	color: #fff;
	text-align: center;
	text-transform: uppercase;
	display: none;
	background: #b42222;
	width: 40px !important;
	padding: 10px !important;
	cursor: pointer !important;
	position: fixed !important;
	right: 0;
	bottom: 0;
	z-index: 20;
}

.main_contents a.ButtonLink {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}
 

.main_contents .ButtonLink_text {
	font-size: 1.6rem;
	line-height: 1;
	letter-spacing: .026em;
	word-break: break-word;
}