@charset "utf-8";

/* !HTML5 elements
---------------------------------------------------------- */
header,
footer,
nav,
section,
aside,
article {
	display: block;
}

/* !Reseting
---------------------------------------------------------- */
body,
div,
pre,
p,
blockquote,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
form,
fieldset,
th,
td {
	margin: 0;
	padding: 0;
}

input,
textarea {
	margin: 0;
	font-size: 100%;
}

label {
	cursor: pointer;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
	font-size: 100%;
}

fieldset,
img {
	border: 0;
}

img {
	vertical-align: top;
	max-width: 100%;
}

address,
caption,
cite,
code,
dfn,
em,
th,
var {
	font-style: normal;
	font-weight: normal;
}

ol,
ul {
	list-style: none;
}

caption,
th {
	text-align: left;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-size: 100%;
	font-weight: normal;
}

q:after,
q:before {
	content: '';
}

a,
input,
select,
textarea,
button {
	outline: none;
}

abbr,
acronym {
	border: 0;
}

*,
*:before,
*::after {
	box-sizing: border-box;
}

/* !Clearfix
---------------------------------------------------------- */
.clearfix {
	display: block;
	min-height: 1%;
}

.clearfix:after {
	clear: both;
	content: ".";
	display: block;
	height: 0;
	visibility: hidden;
}

* html .clearfix {
	height: 1%;
	/*\*/
	/*/
	height: auto;
	overflow: hidden;
	/**/
}

/* !Inline Align ------------------------------------------------------------ */
.taL {
	text-align: left !important;
}

.taC {
	text-align: center !important;
}

.taR {
	text-align: right !important;
}

/*common*/
a {
	color: #0F1011;

	text-decoration: none;
}

.op {
	transition: all 0.5s !important;
	-moz-transition: all 0.5s !important;
	/* Firefox */
	-webkit-transition: all 0.5s !important;
	/* Chrome&Safari */
}


@media screen and (min-width: 900px) {
	.op:hover {
		opacity: .7;
		-webkit-opacity: .7;
		-moz-opacity: .7;
	}
}

/* !Layout
---------------------------------------------------------- */
html {
	overflow-y: scroll;
	font-size: 62.5%;
}


body {
	color: #0F1011;
	background: #FFF;
	font-size: 1.6rem;
	font-family: YakuHanJP, "Noto Sans JP", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif;
	-webkit-text-size-adjust: none;
	line-height: 1.5;
}

.eng {
	font-family: "Lato", sans-serif;
}

@media screen and (min-width: 835px) and (max-width: 1200px) {
	html {
		font-size: 0.83vw;
	}
}


/*** スマホ 320px ~ 834px***/
@media screen and (max-width: 834px) {
	body {
		font-size: 1.2rem;
	}

	html {
		font-size: 62.5%;
	}
}

.pc {
	display: block;
}

.sp {
	display: none;
}

.inner {
	max-width: 122.6rem;
	width: 100%;
	margin: 0 auto;
	padding: 0 1.6rem;
}

.is-hide {
	display: none;
}

/*** スマホ 320px ~ 834px***/
@media screen and (max-width: 834px) {
	.pc {
		display: none;
	}

	.sp {
		display: block;
	}
}

/* !rivets_lp_wrapper
---------------------------------------------------------- */
#rivets_lp_wrapper {
	width: 100%;
	position: relative;
	overflow: hidden;
	padding-top: 8rem;
}

#rivets_lp_wrapper::before {
	content: '';
	position: fixed;
	left: 0;
	top: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
	background: url('../../img/lp/common/bg_pc.jpg') no-repeat;
	background-size: cover;
}

/*** スマホ 320px ~ 834px***/
@media screen and (max-width: 834px) {
	#rivets_lp_wrapper {
		padding-top: 5.6rem;
	}

	#rivets_lp_wrapper::before {
		background: url('../../img/lp/common/bg_sp.jpg') no-repeat;
		background-size: cover;
	}
}

/* !header
---------------------------------------------------------- */
#rivets_lp_header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	height: 8rem;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 999;
	padding: 0 2.4rem 0 4rem;
	box-shadow: 8px 6px 20px 0px rgba(61, 65, 70, 0.1);
}

#rivets_lp_header::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
	width: 100%;
	height: 100%;
	background: #3071B9;
}

.rivets_lp_headerLogo {
	width: 19.8rem;
	position: relative;
	z-index: 3;
}

#rivets_lp_navi .rivets_lp_naviLinks {
	display: flex;
}

#rivets_lp_navi a {
	font-size: 1.6rem;
	font-weight: 700;
	line-height: 1.5;
	text-align: center;
	padding: 0 1.6rem;
	display: flex;
	align-items: center;
	height: 100%;
	color: #fff;
	position: relative;
	z-index: 3;
}

#rivets_lp_navi .hasChild {
	position: relative;
}

#rivets_lp_navi .subMenu {
	display: flex;
	position: fixed;
	width: 100%;
	left: 0;
	top: 0;
	z-index: -1;
	pointer-events: none;
	padding-top: 8rem;
}

#rivets_lp_navi .subMenu .subBox {
	width: 100%;
	height: 100%;
	position: relative;
	z-index: -1;
	padding: 6.4rem 0;
	transform: translateY(-100%);
	transition: .3s transform ease;
}

#rivets_lp_navi .subMenu .subBox::before {
	content: '';
	position: absolute;
	left: 50%;
	top: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
	transform: translateX(-50%);
	background: #20538B;
}

#rivets_lp_navi .hasChild {
	position: relative;
	height: 8rem;
}

#rivets_lp_navi .hasChild>a {
	position: relative;
	display: inline-flex;
	align-items: center;
}

#rivets_lp_navi .hasChild>a::after {
	content: '';
	width: 1.6rem;
	height: 1.6rem;
	background: url('../../img/lp/common/icon_plus_white.svg') no-repeat center;
	background-size: cover;
	transform: rotate(-180deg);
	transition: transform .2s;
	margin-left: 0.4rem;
}

#rivets_lp_navi .subList {
	display: flex;
	justify-content: center;
}

#rivets_lp_navi .subList li+li {
	margin-left: 3.2rem;
}

#rivets_lp_navi .subList a {
	font-size: 1.6rem;
	line-height: 1.5;
	color: #fff;
	letter-spacing: 0.02em;
	position: relative;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 5.6rem;
	padding: 1.6rem 2.4rem 1.6rem 4.4rem;
	opacity: 0;
	transition: .4s opacity ease, .4s color ease;
}

#rivets_lp_navi .subList a::before {
	content: '';
	position: absolute;
	left: 1.6rem;
	top: 0;
	width: 2.4rem;
	height: 100%;
	background: url('../../img/lp/common/icon_nav_yellow.svg') no-repeat center;
	background-size: 100% auto;
}

#rivets_lp_navi .subList a::after {
	content: '';
	position: absolute;
	left: 50%;
	top: 50%;
	z-index: -1;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100%;
	background: #3071B9;
	transition: all .2s ease;
	border-radius: 0.4rem;
}

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

	#rivets_lp_navi .hasChild:hover>a::after {
		background: url('../../img/lp/common/icon_plus_yellow.svg') no-repeat center;
		background-size: cover;
		transform: rotate(180deg);
		transition: transform .2s;
	}

	#rivets_lp_navi .hasChild:hover .subMenu {
		pointer-events: initial;
	}

	#rivets_lp_navi .hasChild:hover .subMenu .subBox {
		transform: translateY(0);
		opacity: 1;
		transition: .4s transform ease, opacity .3s ease;
	}

	#rivets_lp_navi .hasChild:hover .subMenu .subBox::before {
		transition: .4s ease;
	}

	#rivets_lp_navi .hasChild:hover .subList a {
		opacity: 1;
		transition: .4s opacity ease;
	}

	#rivets_lp_navi .rivets_lp_naviLinks>li>a:hover {

		color: #F5DD4D;
	}

	#rivets_lp_navi .subList a:hover::after {
		width: calc(100% + 0.2rem);
		height: calc(100% + 0.2rem);
		transition: all .2s ease;
	}
}

/*** スマホ 320px ~ 834px***/
@media screen and (max-width: 834px) {
	#rivets_lp_header {
		height: 5.6rem;
		padding: 0;

	}

	.rivets_lp_headerLogo {
		width: 11.3rem;
		position: fixed;
		left: 1.3rem;
		z-index: 999;
	}

	/*******navi*******/
	#rivets_lp_navi {
		text-align: center;
		width: 100%;
		height: 100vh;
		z-index: 900;
		position: fixed;
		top: 0;
		left: 0;
		z-index: -1;
		overflow-y: hidden;
		-webkit-overflow-scrolling: touch;
		padding: 13.8rem 0 5rem;
		transition: .5s all ease;
		pointer-events: none;

		opacity: 0;
		visibility: hidden;

		transition: z-index 5ms ease 400ms, opacity 5ms ease 400ms, visibility 5ms ease 400ms;
	}

	#rivets_lp_navi.open {
		z-index: 1;
		opacity: 1;
		visibility: visible;
		pointer-events: initial;
		transition: z-index 5ms ease, opacity 5ms ease, visibility 5ms ease;

	}

	#rivets_lp_navi::before {
		content: '';
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		background: #3071B9;
		transform: scaleY(0);
		-webkit-transform-origin: top;
		transform-origin: top;
		transition: transform 0.5s ease;
		pointer-events: none;
	}

	#rivets_lp_navi.open::before {
		transform: scaleY(1);
		transition: transform 0.5s ease;
	}

	#rivets_lp_navi .rivets_lp_naviInner {
		height: 100%;
		overflow: auto;
		padding: 0 3.9rem;
	}

	#rivets_lp_navi .rivets_lp_naviLinks {
		display: block;
		position: relative;
		z-index: 3;
	}

	#rivets_lp_navi .rivets_lp_naviLinks>li {
		border-bottom: 0.1rem solid #CED3D9;
		opacity: 0;
		transition: opacity 400ms ease;
	}

	#rivets_lp_navi.open .rivets_lp_naviLinks>li {
		opacity: 1;
		transition: opacity 400ms ease 100ms;
	}

	#rivets_lp_navi .rivets_lp_naviLinks>li>a {
		font-size: 1.6rem;
		font-weight: 700;
		line-height: 1.5;
		text-align: center;
		padding: 3.2rem 0 0.8rem;
		display: flex;
		align-items: center;
		height: 100%;
		color: #fff;
	}

	#rivets_lp_navi .hasChild {
		position: relative;
	}

	#rivets_lp_navi .subMenu {
		display: none;
		position: relative;
		width: 100%;
		left: 0;
		top: 0;
		z-index: 3;
		pointer-events: initial;
		padding-top: 0;
	}

	#rivets_lp_navi .subMenu .subBox {
		width: 100%;
		height: unset;
		position: relative;
		padding: 0;
		transform: translateY(0);
		opacity: 1;
	}

	#rivets_lp_navi .subMenu .subBox::before {
		content: unset;
	}

	#rivets_lp_navi .hasChild {
		position: relative;
		height: auto;
		width: 100%;
	}

	#rivets_lp_navi .hasChild>a {
		position: relative;
		display: inline-flex;
		align-items: center;
	}

	#rivets_lp_navi .hasChild .subButton {
		display: block;
		width: 100%;
		height: 6.4rem;
		position: absolute;
		left: 0;
		top: 1rem;
		z-index: 10;
	}

	#rivets_lp_navi .hasChild .subButton::before,
	#rivets_lp_navi .hasChild .subButton::after {
		content: '';
		position: absolute;
		right: 0;
		top: 3.4rem;
		z-index: 3;
		width: 1.3rem;
		height: 0.2rem;
		background: #F5DD4D;
	}

	#rivets_lp_navi .hasChild .subButton::after {
		transform: rotate(90deg);
	}

	#rivets_lp_navi .hasChild .subButton.active::after {
		transform: rotate(0);
	}

	#rivets_lp_navi .hasChild>a.change {
		color: #F5DD4D;
	}

	#rivets_lp_navi .hasChild>a::after {
		content: unset;
	}

	#rivets_lp_navi .subList {
		display: block;
		padding-bottom: 1.6rem;
	}

	#rivets_lp_navi .subList li+li {
		margin-left: 0;
	}

	#rivets_lp_navi .subList a {
		padding: 1.3rem 2.4rem;
		opacity: 1;
		display: block;
		min-height: unset;
		text-align: left;
		font-size: 1.4rem;
		line-height: 1;
		letter-spacing: 0.01em;
		font-weight: 400;
	}

	#rivets_lp_navi .subList a::before {
		content: '';
		position: absolute;
		left: -0.5em;
		top: 0;
		width: 2rem;
		height: 100%;
		background: url('../../img/lp/common/icon_nav_yellow.svg') no-repeat center;
		background-size: 100% auto;
	}

	#rivets_lp_navi .subList a::after {
		content: unset;
	}


	/*******btnMenu*********/
	.rivets_lp_btnMenu {
		position: fixed;
		right: 0;
		top: 0;
		z-index: 999;
		width: 6.4rem;
		height: 5.6rem;
		background: url('../../img/lp/common/icon_menu_white.svg') center no-repeat;
		background-size: 3.2rem 3.2rem;
	}


	.rivets_lp_btnMenu.active {
		background: url('../../img/lp/common/icon_close_white.svg') no-repeat center;
		background-size: 3.2rem 3.2rem;
	}

}

/* rivets_lp_contents
-----------------------------------------------------------*/
.rivets_lp_contents {}

/*** contents スマホ 320px ~ 834px***/
@media screen and (max-width: 834px) {
	.rivets_lp_contents {}
}

/* rivets_lp_footer
-----------------------------------------------------------*/
.rivets_lp_footer {
	background: #3071B9;
	padding: 12rem 0;
	position: relative;
}

.rivets_lp_footer::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2;
	width: 100%;
	height: 1.6rem;
	background: #CED3D9;
}

.rivets_lp_footerLinks {
	margin-bottom: 6.4rem;
}

.rivets_lp_footerLinks ul {
	display: flex;
	justify-content: center;
}

.rivets_lp_footerLinks li a {
	color: #fff;
	font-weight: 400;
	letter-spacing: 0.02em;
	padding: 0 2.4rem;
	color: #fff;
	line-height: 1;
	font-size: 1.4rem;
}

.rivets_lp_footerLinks li+li a {
	border-left: 0.1rem solid #CED3D9;
}

.rivets_lp_footerLogo {
	max-width: 16.4rem;
	width: 100%;
	margin: 0 auto;
}

.rivets_lp_footerSns {
	margin-top: 4rem;
}

.rivets_lp_footerSns ul {
	display: flex;
	justify-content: center;
}

.rivets_lp_footerSns ul li+li {
	margin-left: 4rem;
}

.rivets_lp_copyright {
	margin-top: 4rem;
	text-align: center;
	color: #fff;
	line-height: 1;
	letter-spacing: 0.02em;
	font-size: 1.2rem;
}

/*** footerスマホ 320px ~ 834px***/
@media screen and (max-width: 834px) {
	.rivets_lp_footerLinks {
		margin-bottom: 4.8rem;
	}

	.rivets_lp_footerLinks ul {
		display: flex;
		justify-content: center;
	}

	.rivets_lp_footerLinks li a {
		letter-spacing: 0.01em;
		padding: 0 1.6rem;
		font-size: 1.2rem;
	}

	.rivets_lp_footerLogo {
		max-width: 10.3rem;
	}

	.rivets_lp_footerSns {
		margin-top: 4.8rem;
	}

	.rivets_lp_footerSns ul li+li {
		margin-left: 4.4rem;
	}

	.rivets_lp_footerSns img {
		transform: scale(0.8);
	}

	.rivets_lp_copyright {
		margin-top: 2.4rem;
	}
}



/* !mainVisual
---------------------------------------------------------- */

.rivets_lp_mainVisual {
	padding: 4rem 0 10rem;
	background: #fff;
}

.rivets_lp_mainSlider {
	margin-bottom: 8rem;
	position: relative;
}

.rivets_lp_mainSwiper {
	box-shadow: 8px 6px 20px 0px rgba(61, 65, 70, 0.1);
}

.rivets_lp_mainSlider.swiper {
	/* overflow: visible; */
	padding-bottom: 3rem;
}

.rivets_lp_mainSlider .rivets_lp_mainImage {}

.rivets_lp_mainSlider img {
	width: 100%;
}

.rivets_lp_mainSlider .swiper-pagination {
	position: absolute;
	margin: 0;
	bottom: 0;
	z-index: 3;
	transform: translateY(100%);
	display: flex;
	justify-content: center;
	margin-bottom: -2.8rem;
}

.rivets_lp_mainSlider .swiper-pagination-customs {
	width: 14.7rem;
	height: 0.4rem;
	display: inline-block;
	border-radius: 0;
	background: #CED3D9;
	border: none;
	margin: 0 !important;
}

.rivets_lp_mainSlider .swiper-pagination-customs.swiper-pagination-customs-active {
	background: #6A727A;
}

.rivets_lp_mainSlider .swiperBtn {
	position: absolute;
	bottom: 0;
	z-index: 10;
	width: 2.4rem;
	height: 2.4rem;
	margin-bottom: -2.8rem;
}

.rivets_lp_mainSlider .swiperBtn a {
	display: block;
	width: 100%;
	height: 100%;
}

.rivets_lp_mainSlider .swiperBtn.prev {
	left: 50%;
	transform: translate(-50%, 50%) scale(-1);
	background: url('../../img/lp/common/icon_arrow_gray.svg') no-repeat;
	background-size: cover;
	margin-left: -25rem;
}

.rivets_lp_mainSlider .swiperBtn.next {
	right: 50%;
	transform: translate(50%, 50%);
	background: url('../../img/lp/common/icon_arrow_gray.svg') no-repeat;
	background-size: cover;
	margin-right: -25rem;
}

.rivets_lp_mainSlider .swiper-button-prev,
.rivets_lp_mainSlider .swiper-button-next {
	display: none;
}

.rivets_lp_linkBanner .swiper-wrapper {
	display: flex;
	justify-content: center;
}

.rivets_lp_linkBanner .swiper-wrapper .swiper-slide {
	width: 20%;
}

.rivets_lp_linkBanner .swiper-button-prev,
.rivets_lp_linkBanner .swiper-button-next {
	display: none;
}

.rivets_lp_linkBanner .swiper-wrapper a {
	display: block;
	box-shadow: 8px 6px 20px 0px rgba(61, 65, 70, 0.1);
}

.rivets_lp_linkBanner img {
	width: 100%;

}

/*** スマホ 320px ~ 834px***/
@media screen and (max-width: 834px) {

	/* main */
	.rivets_lp_mainVisual {
		margin-top: 0;
		padding: 0 0 2.4rem;
	}

	.rivets_lp_mainVisual .inner {
		padding: 0;
	}

	.rivets_lp_mainSlider {
		margin-bottom: 5.6rem;
	}

	.rivets_lp_mainSwiper {
		box-shadow: none;
	}

	.rivets_lp_mainSlider.swiper {
		/* overflow: visible; */
		padding-bottom: 1.6rem;
	}


	.rivets_lp_mainSlider .swiper-pagination {
		margin-bottom: -1.6rem;
	}

	.rivets_lp_mainSlider .swiper-pagination-customs {
		width: 8.8rem;
		height: 0.2rem;
	}

	.rivets_lp_mainSlider .swiperBtn {
		width: 1.6rem;
		height: 1.6rem;
		margin-bottom: -1.6rem;
	}

	.rivets_lp_mainSlider .swiperBtn.prev {
		margin-left: -15.6rem;
	}

	.rivets_lp_mainSlider .swiperBtn.next {
		margin-right: -15.6rem;
	}

	.rivets_lp_mainSlider .swiper-button-prev,
	.rivets_lp_mainSlider .swiper-button-next {
		display: none;
	}

	.rivets_lp_linkBanner {
		padding: 0 1.6rem;
	}

	.rivets_lp_linkBanner .swiper-wrapper {
		display: flex;
		grid-template-columns: unset;
		justify-content: unset;
		gap: 0;
	}

	.rivets_lp_linkBanner .swiper-slide {
		width: 34.3rem;
	}

	.rivets_lp_linkBanner img {
		width: 100%;
	}
}

/* head */
.rivets_lp_head {
	margin-bottom: 6.4rem;
	text-align: center;
}

.rivets_lp_head .eng {
	font-size: 4.8rem;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0.01em;
	color: #20538B;
	display: block;
}

.rivets_lp_head .jap {
	font-size: 2rem;
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0.01em;
	display: block;
	color: #3D4146;
}

.rivets_lp_head.white .eng,
.rivets_lp_head.white .jap {
	color: #fff;
}

/*** スマホ 320px ~ 834px***/
@media screen and (max-width: 834px) {

	/* head */
	.rivets_lp_head {
		margin-bottom: 3.2rem;
	}

	.rivets_lp_head .eng {
		font-size: 3.2rem;
		display: block;
	}

	.rivets_lp_head .jap {
		font-size: 1.4rem;
	}

}


/* Btn */
.btnLink {
	height: 5.6rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 9.9rem;
	box-shadow: 8px 6px 20px 0px rgba(61, 65, 70, 0.1);
	transition: background .3s ease 0s, border-width .1s ease;
	position: relative;
	font-size: 2rem;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 0.02em;
	border-width: 0.15rem;
	border-style: solid;
}

.btnLink.yellow {
	border-color: #20538B;
}

.btnLink.blue {
	border-color: #fff;
}

.btnLink.white {
	border-color: #20538B;
}

.btnLink span {
	display: inline-flex;
	align-items: center;
}

.btnLink span::after {
	content: '';
	width: 2.4rem;
	height: 2.4rem;
	margin-left: 0.8rem;
}

.btnLink.yellow {
	background: #F5DD4D;
	color: #20538B;
}

.btnLink.yellow span::after {
	background: url('../../img/lp/common/icon_arrow_blue.svg') no-repeat;
	background-size: cover;
}

.btnLink.blue {
	background: rgba(32, 83, 139, 0.7);
	color: #fff;
}

.btnLink.blue span::after {
	background: url('../../img/lp/common/icon_arrow_white.svg') no-repeat;
	background-size: cover;
}

.btnLink.white {
	background: rgba(255, 255, 255, 0.7);
	color: #20538B;
}

.btnLink.white span::after {
	background: url('../../img/lp/common/icon_arrow_blue.svg') no-repeat;
	background-size: cover;
}


@media screen and (min-width: 835px) {
	.btnLink:hover {
		transition: background .3s ease .1s, border-width .1s ease;
		border-width: 0.2rem;
	}

	.btnLink.yellow:hover {
		background: #EBCA00;
	}

	.btnLink.blue:hover {
		background: #20538B;
	}

	.btnLink.white:hover {
		background: #F4F5F6;
	}
}


/*** スマホ 320px ~ 834px***/
@media screen and (max-width: 834px) {
	.btnLink {
		height: 4.8rem;
		font-size: 1.6rem;
		font-weight: 400;
		line-height: 1.5;
		letter-spacing: 0.02em;
		border-width: 0.1rem;
	}

	.btnLink span::after {
		width: 1.8rem;
		height: 1.8rem;
		margin-left: 0.4rem;
	}

}

/* game */
.rivets_lp_gameArea {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 4rem 0;
}

.rivets_lp_gameArea .rivets_lp_head {
	margin-bottom: 3.2rem;
}

.rivets_lp_gameItem {
	width: 50%;
}

.rivets_lp_gameItem.result {
	padding-right: 12rem;
}

.rivets_lp_match {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.rivets_lp_match .team {
	width: 35%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.rivets_lp_match .info {
	width: 30%;
}

.rivets_lp_match .team dd {
	color: #fff;
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0.01em;
	text-align: center;
	margin-top: 0.8rem;
}

.rivets_lp_match .info dt {
	font-size: 6.4rem;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0.01em;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
}

.rivets_lp_match .info dt span {
	display: inline-block;
}

.rivets_lp_match .info dt .win {
	color: #F5DD4D;
}

.rivets_lp_match .info dt .bar {
	width: 2.3rem;
	height: 0.1em;
	background: #fff;
	margin: 0 0.8rem;
}

.rivets_lp_match .info dd {
	color: #fff;
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0.01em;
	text-align: center;
}

.rivets_lp_gameItem.result .btns {
	margin-top: 4.8rem;
	display: flex;
	justify-content: space-between;
}

.rivets_lp_gameItem.result .btns a {
	width: 50%;
}

.rivets_lp_gameItem.result .btns a+a {
	margin-left: 2.4rem;
}

.rivets_lp_gameItem.next {
	position: relative;
	padding: 4.8rem 0 4.8rem 12rem;
}

.rivets_lp_gameItem.next::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	z-index: -1;
	width: 100vw;
	height: 100%;
	background: #F4F5F6;
}

.rivets_lp_gameItem.next .info.vs dt {
	font-size: 3.4rem;
	line-height: 1.5;
	color: #000;
}

.rivets_lp_gameItem.next .info.vs dd {
	color: #000;
}

.rivets_lp_gameItem.next .rivets_lp_match .team dd {
	color: #000;
}

.rivets_lp_gameDate {
	margin-top: 2.4rem;
	display: flex;
}

.rivets_lp_gameDate .item {
	width: 50%;
}

.rivets_lp_gameDate.one .item {
	width: 100%;
}

.rivets_lp_gameDate .item+.item {
	margin-left: 2.4rem;
}

.rivets_lp_gameDate dl {
	display: flex;
	justify-content: center;
	align-items: center;
}

.rivets_lp_gameDate dl dt {
	font-size: 48px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0.01em;
	margin-right: 0.4rem;
}

.rivets_lp_gameDate dl dd {
	font-size: 2rem;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 0.02em;
}

.rivets_lp_gameDate dl dd span {
	display: block;
	margin-top: -0.3rem;
}

.rivets_lp_gameDate a {
	width: 100%;
	margin-top: 0.5rem;
}

.rivets_lp_gameItem.next .other {
	margin-top: 2.4rem;
}

.rivets_lp_gameItem.next .other a {
	width: 100%;
}

/*** スマホ 320px ~ 834px***/
@media screen and (max-width: 834px) {

	/* game */
	.rivets_lp_game {
		position: relative;
	}

	.rivets_lp_gameArea {
		display: block;
		padding: 6.3rem 0;
	}

	.rivets_lp_gameItem {
		width: 100%;
	}

	.rivets_lp_gameItem.result {
		padding-right: 0;
	}


	.rivets_lp_match .team {
		width: 30%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.rivets_lp_match .info {
		width: 30%;
	}

	.rivets_lp_match .team dd {
		font-size: 1.2rem;
	}

	.rivets_lp_match .info dt {
		font-size: 4.8rem;
	}

	.rivets_lp_match .info dt .bar {
		width: 1.8rem;
	}

	.rivets_lp_match .info dd {
		font-size: 1.2rem;
	}

	.rivets_lp_gameItem.result .btns {
		margin-top: 3.2rem;
	}

	.rivets_lp_gameItem.result .btns a+a {
		margin-left: 1.6rem;
	}

	.rivets_lp_gameItem.next {
		margin-top: 6.4rem;
		padding: 3.6rem 1.6rem;
	}

	.rivets_lp_gameItem.next::before {
		content: '';
		position: absolute;
		left: 0;
		top: 0;
		z-index: -1;
		width: 100%;
		height: 100%;
		background: #F4F5F6;
		box-shadow: 8px 6px 20px 0px rgba(61, 65, 70, 0.1);
		border-radius: 0.4rem;
	}

	.rivets_lp_gameItem.next .info.vs dt {
		font-size: 2.4rem;
	}

	.rivets_lp_gameItem.next .info.vs dd {
		font-size: 1.4rem;
		white-space: nowrap;
	}

	.rivets_lp_gameDate {
		margin-top: 3.2rem;
	}

	.rivets_lp_gameDate .item+.item {
		margin-left: 0.8rem;
	}

	.rivets_lp_gameDate dl dt {
		font-size: 3.4rem;
	}

	.rivets_lp_gameDate dl dd {
		font-size: 1.6rem;
	}

	.rivets_lp_gameDate .btnLink.yellow {
		border-width: 0.2rem;
	}

}

/* MOVIE */
.rivets_lp_movie {
	background: #3071B9;
	padding: 8rem 0;
}

.rivets_lp_movieArea .swiper-wrapper {
	display: flex;
	justify-content: center;
}

.rivets_lp_movieArea .swiper-button-prev,
.rivets_lp_movieArea .swiper-button-next {
	display: none;
}

.rivets_lp_movieArea .swiper-slide {
	width: calc(50% - 1.6rem);
	/* margin: 0 1.6rem; */
}

.rivets_lp_movieArea .swiper-slide .mvItem {
	width: 100%;
	padding-top: 56.28%;
	position: relative;
}


.rivets_lp_movieArea .swiper-slide iframe {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.rivets_lp_movieArea .swiper-button-next.disabled,
.rivets_lp_movieArea .swiper-button-prev.disabled {
	display: none;
}

/*** スマホ 320px ~ 834px***/
@media screen and (max-width: 834px) {
	.rivets_lp_movie {
		padding: 4rem 0;
	}

	.rivets_lp_movieArea .swiper-wrapper {
		justify-content: unset;
	}

	.rivets_lp_movieArea .swiper-slide {
		/* padding: 0 1.6rem; */
	}

	.rivets_lp_movieArea .swiper {
		padding-bottom: 5.6rem;
	}

	.rivets_lp_movieArea .swiper-slide .mvItem {
		width: 100%;
	}

	.rivets_lp_movieArea .swiper-slide .mvItem iframe {
		width: 100%;
		height: 100%;
	}

	.rivets_lp_movieArea .swiper-button-prev,
	.rivets_lp_movieArea .swiper-button-next {
		display: block;

	}


	.rivets_lp_movieArea .swiper-button-prev {
		width: 4rem;
		height: 4rem;
		position: absolute;
		left: 50%;
		top: auto;
		bottom: 0;
		transform: translate(-50%, 0);
		margin-top: 0;
		margin-left: -4rem;
	}

	.rivets_lp_movieArea .swiper-button-next {
		margin-top: 0;
		width: 4rem;
		height: 4rem;
		position: absolute;
		right: 50%;
		top: auto;
		bottom: 0;
		transform: translate(50%, 0);
		margin-right: -4rem;
	}

	.rivets_lp_movieArea .swiper-button-prev::before {
		content: '';
		position: absolute;
		left: 0;
		top: 0;
		z-index: 1;
		width: 100%;
		height: 100%;
		background: ;
		background: url('../../img/lp/common/icon_arrow_white.svg') no-repeat center #20538B;
		background-size: 1.6rem 1.6rem;
		border-radius: 100%;
		transform: scale(-1);
		border: 0.1rem solid #fff;
	}

	.rivets_lp_movieArea .swiper-button-next::before {
		content: '';
		position: absolute;
		right: 0;
		top: 0;
		z-index: 1;
		width: 100%;
		height: 100%;
		background: ;
		background: url('../../img/lp/common/icon_arrow_white.svg') no-repeat center #20538B;
		background-size: 1.6rem 1.6rem;
		border-radius: 100%;
		border: 0.1rem solid #fff;
	}

	.rivets_lp_movieArea .swiper-button-prev::after,
	.rivets_lp_movieArea .swiper-button-next::after {
		content: unset;
	}
}

/* TOPICS */

.rivets_lp_topics {
	background: #FFFFFF;
	padding: 8rem 0;
}

.rivets_lp_topicsArea {
	max-width: 95rem;
	width: 100%;
	margin: 0 auto;
}

.rivets_lp_topicsLinks {
	display: flex;
	justify-content: space-between;
	margin-bottom: 1.6rem;
}

.rivets_lp_topicsLinks li+li {
	margin-left: 1.6rem;
}

.rivets_lp_topicsLinks a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 14.5rem;
	height: 4rem;
	border: 0.1rem solid #20538B;
	box-shadow: 8px 6px 20px 0px rgba(61, 65, 70, 0.1);
	background: rgba(255, 255, 255, 0.7);
	border-radius: 9.9rem;
	color: #20538B;
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0.01em;
	text-align: center;
}

.rivets_lp_topicsLinks a.is-active {
	background: #20538B;
	color: #fff;
}

.rivets_lp_topicsList a {
	display: flex;
	align-items: flex-start;
	border-bottom: 0.1rem solid #CED3D9;
	padding: 2.4rem 6.4rem 2.4rem 1.6rem;
	position: relative;
	transition: background .5s ease;
}

.rivets_lp_topicsList li:last-child a {
	border-bottom: none;
}

.rivets_lp_topicsList a::after {
	content: '';
	position: absolute;
	right: 2.1rem;
	top: 50%;
	transform: translateY(-50%);
	width: 1.6rem;
	height: 1.6rem;
	background: url('../../img/lp/common/icon_arrow_gray.svg') no-repeat;
	background-size: cover;
}

.rivets_lp_topicsList a .img_wrap {
	width: 18rem;
	height: 13.5rem;
	position: relative;
	margin-right: 2.5rem;
}

.rivets_lp_topicsList a .img_wrap img {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
	object-fit: cover;
}

.rivets_lp_topicsList a .box_wrap {
	width: calc(100% - 20.5rem);
}

.rivets_lp_topicsList a .date {
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0.01em;
	color: #3D4146;
}

.rivets_lp_topicsList a .cate {
	font-size: 1.4rem;
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0.01em;
	color: #3D4146;
	border: 0.1rem solid #6A727A;
	border-radius: 9.9rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.1rem 0.8rem;
	min-height: 2.2rem;
	margin-left: 0.8rem;
}

.rivets_lp_topicsList a .title {
	display: block;
	margin-top: 0.8rem;
	font-size: 1.4rem;
	font-weight: 400;
	letter-spacing: 0.02em;
	line-height: 1.75;
	color: #0F1011;
}

.rivets_lp_topicsBtn {
	margin-top: 1.6rem;
}

.rivets_lp_topicsBtn a {
	display: flex;
	max-width: 46.4rem;
	width: 100%;
	margin: 0 auto;
}

@media screen and (min-width: 835px) {
	.rivets_lp_topicsLinks a:hover {
		background: #20538B;
		color: #fff;
	}

	.rivets_lp_topicsList a:hover {
		background: rgba(235, 202, 0, .2);
		transition: background .5s ease;
	}
}


/*** スマホ 320px ~ 834px***/
@media screen and (max-width: 834px) {
	/* TOPICS */

	.rivets_lp_topics {
		padding: 6.4rem 0;
	}

	.rivets_lp_topicsLinks {
		flex-wrap: wrap;
		margin-bottom: 0.8rem;
		margin-left: -0.8rem;
	}

	.rivets_lp_topicsLinks li+li {
		margin-left: 0.8rem;
	}

	.rivets_lp_topicsLinks li {
		width: calc(33.33% - 0.8rem);
		margin-left: 0.8rem;
		margin-bottom: 0.8rem;
	}

	.rivets_lp_topicsLinks a {
		width: 100%;
		font-size: 1.4rem;
	}

	.rivets_lp_topicsList a {
		padding: 2.4rem 2.4rem 2.4rem 0;
	}

	.rivets_lp_topicsList a::after {
		right: 0;
		top: 50%;
		transform: translateY(-50%);
	}

	.rivets_lp_topicsList a .img_wrap {
		width: 10rem;
		height: 7.5rem;
		margin-right: 1rem;
	}

	.rivets_lp_topicsList a .box_wrap {
		width: calc(100% - 11rem);
	}


	.rivets_lp_topicsList a .cate {
		font-size: 1.2rem;
		padding: 0.4rem 0.8rem;
		min-height: 2rem;
	}

	.rivets_lp_topicsList a .title {
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 3;
		-webkit-box-orient: vertical;
	}

	.rivets_lp_topicsBtn {
		margin-top: 0.8rem;
	}

}

/* goods */
.rivets_lp_goods {
	padding: 8rem 0;
}

.rivets_lp_goodsList {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 6.4rem 3.2rem;
}

.rivets_lp_goodsList .image p {
	position: relative;
	padding-top: 100%;
	width: 100%;
	overflow: hidden;
}

.rivets_lp_goodsList .image img {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .5s ease;
}

.rivets_lp_goodsList .goodsItem .info {
	margin-top: 1.6rem;
}

.rivets_lp_goodsList .goodsItem .info .title {
	color: #fff;
	font-size: 2rem;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 0.02em;
}

.rivets_lp_goodsList .goodsItem .info .price {
	color: #fff;
	font-size: 1.4rem;
	line-height: 1;
	letter-spacing: 0.01em;
	margin-top: 0.8rem;
}

.rivets_lp_goodsList .goodsItem .info .price span {
	font-size: 1.6rem;
	line-height: 1.5;
	margin-right: 0.4rem;
	font-weight: 700;
}

.rivets_lp_goodsList .goodsItem .btn {
	margin-top: 1.6rem;
}

.rivets_lp_goodsList .goodsItem .btn a {
	width: 100%;
	height: 4rem;
	font-size: 1.6rem;
}

.rivets_lp_goodsList .goodsItem .btn a span::after {
	width: 1.6rem;
	height: 1.6rem;
}

.rivets_lp_goods .goodsBtn a {
	display: flex;
	max-width: 46.4rem;
	width: 100%;
	margin: 6.4rem auto 0;
}

@media screen and (min-width: 835px) {
	.rivets_lp_goodsList .goodsItem:hover img {
		transform: scale(1.1);
		transition: transform .5s ease;
	}

	.rivets_lp_goodsList .goodsItem:hover .btnLink {
		border-width: 0.2rem;
	}
}

/*** スマホ 320px ~ 834px***/
@media screen and (max-width: 834px) {

	/* goods */
	.rivets_lp_goods {
		padding: 6.4rem 0;
	}

	.rivets_lp_goodsList {
		grid-template-columns: repeat(2, 1fr);
		gap: 4rem 1.5rem;
	}

	.rivets_lp_goodsList .goodsItem .info {
		margin-top: 0.8rem;
	}

	.rivets_lp_goodsList .goodsItem .info .title {
		font-size: 1.6rem;
	}

	.rivets_lp_goodsList .goodsItem .info .price {
		font-size: 1.2rem;
		margin-top: 0.4rem;
	}

	.rivets_lp_goodsList .goodsItem .btn {
		margin-top: 0.8rem;
	}

	.rivets_lp_goods .goodsBtn a {
		display: flex;
		max-width: 46.4rem;
		width: 100%;
		margin: 5.6rem auto 0;
	}
}

.rivets_lp_movieS .swiper-slide {
	width: 31.1rem;
}

.rivets_lp_movieS .swiper-slide iframe {
	width: 100%;
	height: auto;
}

/* PLAYER */
.rivets_lp_player {
	padding: 8rem 0;
	background: #fff;
	position: relative;
	z-index: 2;
}

.rivets_lp_player::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
	background: url('../../img/lp/common/bg_player_pc.svg') no-repeat center;
	background-size: 100% auto;
}

.playerNote {
	color: #0F1011;
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0.01em;
	text-align: center;
	margin-bottom: 6.2rem;
}

.rivets_lp_playerSlider .slick-list {
	overflow: visible;
}

.rivets_lp_playerSlider .slick-slide {
	width: 28.8rem;
	margin: 0 2.4rem;
}

.rivets_lp_playerSlider .slick-slide.slick-center {
	transform: scale(1.1);
}

.rivets_lp_playerSlider .slick-slide .playerItem {
	display: block;
	position: relative;
	background: #DDDDDD;
	padding: 0.8rem 0.8rem 0.4rem;
	box-shadow: 10.95px 8.76px 32.85px 0px #3D414633;
}

.rivets_lp_playerSlider .slick-slide.slick-center .playerItem {
	background: #3071B9;
}

.rivets_lp_playerSlider .imageWrap {
	position: relative;
}

.rivets_lp_playerSlider .imageWrap .number {
	position: absolute;
	right: 0.5rem;
	top: 0;
	z-index: 3;
	font-size: 4.3rem;
	font-weight: 700;
	line-height: 1.29;
	letter-spacing: 0.01em;
	text-align: right;
	text-stroke: 0.12rem #3071B9;
	-webkit-text-stroke: 0.12rem #3071B9;
	color: #fff;
	-webkit-background-clip: text;
}

.rivets_lp_playerSlider dl {
	display: flex;
	justify-content: center;
	align-items: flex-end;
	color: #fff;
}

.rivets_lp_playerSlider dt {
	font-size: 3rem;
	font-weight: 700;
	line-height: 1.5 letter-spacing: 0.02em;
	margin-right: 0.8rem;
}

.rivets_lp_playerSlider dd {
	font-size: 1.4rem;
	line-height: 1.5;
	letter-spacing: 0.02em;
}

.rivets_lp_playerBtn a {
	display: flex;
	max-width: 46.4rem;
	width: 100%;
	margin: 11rem auto 0;
}

/*** スマホ 320px ~ 834px***/
@media screen and (max-width: 834px) {
	.rivets_lp_player {
		padding: 6.4rem 0;
	}

	.rivets_lp_player::before {
		background: url('../../img/lp/common/bg_player_sp.svg') no-repeat center;
		background-size: 100% auto;
	}

	.playerNote {
		font-size: 1.4rem;
		margin-bottom: 4.7rem;
	}

	.rivets_lp_playerSlider .slick-slide {
		width: 22.3rem;
		margin: 0 1.2rem;
	}

	.rivets_lp_playerSlider .slick-slide .playerItem {
		padding: 0.6rem 0.6rem 0.3rem;
	}


	.rivets_lp_playerSlider .imageWrap .number {
		right: 0.7rem;
		top: 0.6rem;
		font-size: 3.4rem;
		font-weight: 700;
		line-height: 1.29;
		letter-spacing: 0.01em;
		text-stroke: 0.1rem #3071B9;
		-webkit-text-stroke: 0.1rem #3071B9;
	}

	.rivets_lp_playerSlider dt {
		font-size: 2.3rem;
	}

	.rivets_lp_playerSlider dd {
		font-size: 1.1rem;
	}

	.rivets_lp_playerSlider .slick-arrow {
		top: 12rem;
	}

	.rivets_lp_playerSlider .slick-arrow.slick-prev {
		margin-left: -13rem;
	}

	.rivets_lp_playerSlider .slick-arrow.slick-next {
		margin-right: -13rem;
	}

	.rivets_lp_playerBtn a {
		margin: 7rem auto 0;
	}
}


/* sns */
.rivets_lp_sns {
	padding: 8rem 0;
}

.rivets_lp_snsArea {
	/* Facebookページプラグインの最大描画幅が500pxのため、それに合わせている */
	max-width: 50rem;
	width: 100%;
	margin: 0 auto;
}

.rivets_lp_sns .snsUl {
	display: flex;
	justify-content: center;
	margin-bottom: 3.2rem;
}

.rivets_lp_sns .snsUl li+li {
	margin-left: 9.9rem;
}

.rivets_lp_sns .rivets_lp_twitter {
	position: relative;
	padding-top: 124.23%;
	width: 100%;
}

.rivets_lp_sns .rivets_lp_twitter .box {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2;
	width: 100%;
	height: 100%;
}


/*** スマホ 320px ~ 834px***/
@media screen and (max-width: 834px) {

	/* sns */
	.rivets_lp_sns {
		padding: 6.4rem 0;
	}

	.rivets_lp_sns .rivets_lp_snsArea {
		padding: 0 1.6rem;
	}

	.rivets_lp_sns .snsUl {
		display: flex;
		justify-content: center;
		margin-bottom: 3.2rem;
	}

	.rivets_lp_sns .snsUl li+li {
		margin-left: 4.5rem;
	}

	.rivets_lp_sns .rivets_lp_twitter {
		position: relative;
		padding-top: 0;
		width: 100%;
	}

	.rivets_lp_sns .rivets_lp_twitter .box {
		position: relative;
		left: 0;
		top: 0;
		z-index: 2;
		width: 100%;
		height: 100%;
	}

}

/* RECRUIT */
.rivets_lp_recruit {
	padding: 8rem 0;
	background: #F4F5F6;
}

.rivets_lp_recruitList {
	max-width: 32.6rem;
	width: 100%;
	margin: 0 auto;
}

.rivets_lp_recruitArea p {
	font-size: 2rem;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 0.02em;
	text-align: center;
	margin-bottom: 0.8rem;
}

.rivets_lp_recruitArea li {
	position: relative;
	padding-left: 1em;
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 1.75;
	letter-spacing: 0.02em;
}

.rivets_lp_recruitArea li::before {
	content: '';
	position: absolute;
	left: 0.3em;
	top: 1.3rem;
	z-index: 3;
	width: 0.3rem;
	height: 0.3rem;
	background: #0F1011;
	border-radius: 100%;
}

.rivets_lp_recruitBtn a {
	display: flex;
	max-width: 45.8rem;
	width: 100%;
	margin: 3.2rem auto 0;
}

/*** スマホ 320px ~ 834px***/
@media screen and (max-width: 834px) {

	/* RECRUIT */
	.rivets_lp_recruit {
		padding: 6.4rem 0;
	}

	.rivets_lp_recruitList {
		max-width: 26.3rem;
	}

	.rivets_lp_recruitArea p {
		font-size: 1.6rem;
	}

	.rivets_lp_recruitBtn {
		padding: 0 1.6rem;
	}
}

/* SPONSOR */
.rivets_lp_sponsor {
	background: #fff;
	padding: 8rem 0;
}

.rivets_lp_sponsorList {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 1.6rem;
}

.rivets_lp_sponsorList li a {
	/* ロゴ画像の縦横比が違っても枠の大きさを揃える */
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 355 / 133;
	padding: 0.5rem;
	background-color: #fff;
	border: 0.1rem solid #CED3D9;
}

.rivets_lp_sponsorList li a img {
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	object-fit: contain;
}

.rivets_lp_sponsorBtns {
	display: flex;
	justify-content: center;
	margin-top: 6.4rem;
}

.rivets_lp_sponsorBtns a {
	max-width: 34rem;
	width: 100%;
}

.rivets_lp_sponsorBtns a+a {
	margin-left: 2.4rem;
}

/*** スマホ 320px ~ 834px***/
@media screen and (max-width: 834px) {

	/* SPONSOR */
	.rivets_lp_sponsor {
		padding: 6.4rem 1.6rem;
	}

	.rivets_lp_sponsorList {
		grid-template-columns: repeat(2, 1fr);
	}

	.rivets_lp_sponsorBtns {
		display: block;
		margin-top: 3.2rem;
	}

	.rivets_lp_sponsorBtns a {
		display: flex;
		max-width: 34rem;
		width: 100%;
		margin: 0 auto;
	}

	.rivets_lp_sponsorBtns a+a {
		margin-left: auto;
		margin-top: 1.6rem;
	}
}

/* Links */
.rivets_lp_commonLinks {
	background: #3071B9;
	padding: 3.2rem 0;
}

.rivets_lp_commonLinks .linksList {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.6rem;
}

.rivets_lp_commonLinks .linksList a {
	display: flex;
	flex-direction: column;
	justify-content: center;
	box-shadow: 10px 8px 30px 0px rgba(61, 65, 70, 0.2);
	padding: 0 2.4rem;
	height: 9.8rem;
	position: relative;
	z-index: 3;
}

.rivets_lp_commonLinks .linksList a::before {
	content: '';
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	z-index: -1;
	width: 100%;
	height: 100%;
	border-radius: 0.4rem;
	background: #F4F5F6;
}

.rivets_lp_commonLinks .linksList a::after {
	content: '';
	position: absolute;
	right: 2.4rem;
	top: 50%;
	transform: translateY(-50%);
	width: 2.4rem;
	height: 2.4rem;
	background: url('../../img/lp/common/icon_arrow_gray.svg') no-repeat;
	background-size: cover;
}

.rivets_lp_commonLinks .linksList a .eng {
	font-size: 2.8rem;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 0.02em;
	color: #20538B;
}

.rivets_lp_commonLinks .linksList a .jap {
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0.01em;
	font-family: "Lato", sans-serif;
}

@media screen and (min-width: 835px) {
	.rivets_lp_commonLinks .linksList a:hover::before {
		width: calc(100% + 0.2rem);
		height: calc(100% + 0.2rem);
		transition: all .2s ease;
	}
}

/*** スマホ 320px ~ 834px***/
@media screen and (max-width: 834px) {

	/* Links */
	.rivets_lp_commonLinks {
		padding: 3.2rem 1.6rem;
	}

	.rivets_lp_commonLinks .linksList {
		display: block;
	}

	.rivets_lp_commonLinks .linksList li+li {
		margin-top: 1.6rem;
	}

	.rivets_lp_commonLinks .linksList a {
		padding: 1.6rem 2.4rem;
		height: 9rem;
		z-index: 3;
	}

	.rivets_lp_commonLinks .linksList a::after {
		width: 1.6rem;
		height: 1.6rem;
	}

	.rivets_lp_commonLinks .linksList a .eng {
		font-size: 2.4rem;
	}

	.rivets_lp_commonLinks .linksList a .jap {
		font-size: 1.4rem;
	}

}


/* !parts
---------------------------------------------------------- */
.partsBox {
	margin: 19.2rem 0 32rem;
}

#parts #rivets_lp_wrapper {
	width: 100%;
	position: relative;
	overflow: hidden;
	padding-top: 8rem;
}

#parts #rivets_lp_wrapper::before {
	content: '';
	position: fixed;
	left: 0;
	top: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
	background: #fff;
	background-size: 100% auto;
}

#rivets_lp_teaser {
	position: relative;
	height: 32rem;
	padding: 10.8rem 0;
	display: flex;
	justify-content: center;
	align-items: center;
}

#rivets_lp_teaser::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
	background: url('../../img/lp/common/bg_pc.jpg') no-repeat;
	background-size: 100% auto;
}

.teaserHead {
	text-align: center;
}

.teaserHead .eng {
	font-size: 6.4rem;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0.01em;
	color: #fff;
}

.teaserHead .jap {
	font-size: 2rem;
	line-height: 1;
	letter-spacing: 0.01em;
	color: #F4F5F6;
	display: block;
}

#rivets_lp_breadcrumb {
	padding: 8rem 0;
}


#rivets_lp_breadcrumb ul {
	display: flex;
}

#rivets_lp_breadcrumb ul li,
#rivets_lp_breadcrumb ul li a {
	word-break: keep-all;
	white-space: nowrap;
	font-size: 1.4rem;
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0.07em;
	text-align: left;
	position: relative;
}

#rivets_lp_breadcrumb ul li a {
	color: #6A727A;
	background: linear-gradient(#6A727A, #6A727A) 0 100%/0 1px no-repeat;
	background-size: 100% 0.1rem;
	transition: .3s ease;
}

#rivets_lp_breadcrumb ul li+li {
	padding-left: 4.4rem;
}

#rivets_lp_breadcrumb ul li+li:before {
	content: '＞';
	position: absolute;
	font-size: 1.2rem;
	left: 1.8rem;
	top: 0;
	width: 1.2rem;
	height: 1.2rem;
	color: #6A727A;
	z-index: 1;
}

#rivets_lp_breadcrumb ul li:last-child {
	word-break: break-all;
	white-space: unset;
}

/* headLarge */
.headLarge {
	font-size: 3.4rem;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 0.02em;
	text-align: center;
	padding: 0.8rem 0;
	color: #20538B;
	border-top: 0.1rem solid #3071B9;
	border-bottom: 0.1rem solid #3071B9;
}

/* player */
.dropdown {
	margin-bottom: 2.4rem;
	display: flex;
	justify-content: flex-end;
	position: relative;
}

.dropdown span {
	display: block;
	width: 10.9rem;
	height: 4rem;
	border-radius: 99rem;
	position: relative;
}

.dropdown span::after {
	content: '';
	position: absolute;
	right: 3.3rem;
	top: 50%;
	transform: rotate(45deg) translateY(-50%);
	margin-top: -0.2rem;
	z-index: 3;
	width: 0.8rem;
	height: 0.8rem;
	border-bottom: 0.2rem #fff solid;
	border-right: 0.2rem #fff solid;
	pointer-events: none;
}

.dropdown select {
	padding: 0 1.9rem;
	width: 100%;
	height: 4rem;
	border-radius: 99rem;
	box-shadow: 8px 6px 20px 0px rgba(61, 65, 70, 0.1);
	background: #20538B;
	color: #fff;
	border: none;
	font-family: YakuHanJP, "Noto Sans JP", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

.dropdown select option {
	font-family: YakuHanJP, "Noto Sans JP", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif;
}

.sectionList {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 3.2rem;
}

.sectionList .cont {
	display: block;
	position: relative;
	background: #3071B9;
	padding: 0.8rem 0.8rem 0.4rem;
	box-shadow: 10px 8px 30px 0px rgba(61, 65, 70, 0.2);
}

.sectionList .cont .imageWrap {
	position: relative;
	padding-top: 151.93%;
	overflow: hidden;
}

.sectionList .cont .imageWrap img {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 3;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transform: scale(1);
		transition: transform .3s ease;
}

.sectionList .cont .imageWrap .number {
	position: absolute;
	right: 0.5rem;
	top: 0;
	z-index: 4;
	font-size: 4.3rem;
	font-weight: 700;
	line-height: 1.29;
	letter-spacing: 0.01em;
	text-align: right;
	text-stroke: 0.12rem #3071B9;
	-webkit-text-stroke: 0.12rem #3071B9;
	color: #fff;
	-webkit-background-clip: text;
}

.sectionList .cont dl {
	color: #fff;
	text-align: center;
}

.sectionList .cont dt {
	font-size: 2.4rem;
	font-weight: 700;
	line-height: 1.5 letter-spacing: 0.02em;
}

.sectionList .cont dd {
	font-size: 1.4rem;
	line-height: 1;
	letter-spacing: 0.02em;
	margin-top: -0.2rem;
}

/* news */
.newsWrap .naviUl {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 1.6rem;
	margin-bottom: 4rem;
}

.newsWrap .naviUl a {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 4rem;
	border: 0.1rem solid #20538B;
	box-shadow: 8px 6px 20px 0px rgba(61, 65, 70, 0.1);
	background: rgba(255, 255, 255, 0.7);
	border-radius: 9.9rem;
	color: #20538B;
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0.01em;
	text-align: center;
	transition: all .3s ease;
}

.newsWrap .naviUl a.is-active {
	background: #20538B;
	color: #fff;
}

.newsSection {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 4rem;
}

.newsSection.is-hide {
	display: none;
}

.newsSection .newsCont {
	display: block;
}

.newsSection .newsCont .image {
	position: relative;
	width: 100%;
	padding-top: 63.88%;
	overflow: hidden;
}

.newsSection .newsCont .image img {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 3;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .3s ease;
}

.newsSection .newsCont .info {
	position: relative;
	margin-top: 1.6rem;
	padding-right: 2.4rem;
}

.newsSection .newsCont .info::after {
	content: '';
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 1.6rem;
	height: 1.6rem;
	background: url('../../img/lp/common/icon_arrow_gray.svg') no-repeat;
	background-size: cover;
}

.newsSection .newsCont .date {
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0.01em;
	color: #3D4146;
}

.newsSection .newsCont .cate {
	font-size: 1.4rem;
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0.01em;
	color: #3D4146;
	border: 0.1rem solid #6A727A;
	border-radius: 9.9rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.1rem 0.8rem;
	min-height: 2rem;
	margin-left: 0.8rem;
}

.newsSection .newsCont .title {
	display: block;
	margin-top: 0.8rem;
	font-size: 1.6rem;
	font-weight: 400;
	letter-spacing: 0.02em;
	line-height: 1.75;
	color: #0F1011;
}

@media screen and (min-width: 835px) {
	#rivets_lp_breadcrumb ul li a:hover {
		background-size: 0% 0.1rem;
		transition: .3s ease;
	}

	.newsWrap .naviUl a:hover {
		background: #20538B;
		color: #fff;
		transition: all .3s ease;
	}

	.sectionList .cont:hover .imageWrap img {
		transform: scale(1.1);
		transition: transform .3s ease;
	}

	.newsSection .newsCont:hover .image img {
		transform: scale(1.1);
		transition: transform .3s ease;
	}
}

/*** スマホ 320px ~ 834px***/
@media screen and (max-width: 834px) {

	/* !parts
	---------------------------------------------------------- */
	.partsBox {
		margin: 8rem 0;
	}

	#rivets_lp_teaser {
		height: 22rem;
		padding: 7.6rem 0;
	}

	#rivets_lp_teaser::before {
		background: url('../../img/lp/common/bg_sp.jpg') no-repeat;
		background-size: 100% auto;
	}

	.teaserHead .eng {
		font-size: 4rem;
	}

	.teaserHead .jap {
		font-size: 1.6rem;
	}

	#rivets_lp_breadcrumb {
		padding: 2.4rem 0;
	}

	#rivets_lp_breadcrumb ul li,
	#rivets_lp_breadcrumb ul li a {
		font-size: 1.2rem;
	}


	#rivets_lp_breadcrumb ul li+li {
		padding-left: 2.6rem;
	}

	#rivets_lp_breadcrumb ul li+li:before {
		font-size: 1rem;
		left: 1rem;
		width: 1rem;
		height: 1rem;
	}


	/* headLarge */
	.headLarge {
		font-size: 2.4rem;
	}

	/* player */

	.dropdown select {
		font-size: 1.4rem;
	}

	.sectionList {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 2.4rem 1.6rem;
	}


	.sectionList .cont .imageWrap .number {
		right: 0.7rem;
		font-size: 2.4rem;
		text-stroke: 0.1rem #3071B9;
		-webkit-text-stroke: 0.1rem #3071B9;
	}

	.sectionList .cont dl {
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.sectionList .cont dt {
		font-size: 2rem;
		text-align: left;
	}

	.sectionList .cont dd {
		font-size: 1.2rem;
		margin-top: -0.1rem;
		text-align: left;
	}

	/* news */
	.newsWrap .naviUl {
		grid-template-columns: repeat(3, 1fr);
		gap: 0.8rem;
		margin-bottom: 3.2rem;
	}

	.newsWrap .naviUl a {
		font-size: 1.4em;
	}


	.newsSection {
		display: block;
	}

	.newsSection .newsCont {
		padding: 2.4rem 1.4rem;
		border-bottom: 0.1rem solid #CED3D9;
	}

	.newsSection .newsCont:last-child {
		border-bottom: none;
	}

	.newsSection .newsCont .cate {
		font-size: 1.2rem;
		min-height: 2rem;
	}

}

/* SNS埋め込み（Facebookページプラグイン）
   幅はプラグイン側がコンテナ幅に合わせて描画する（data-adapt-container-width）。
   高さは実寸を持たせる（比率ボックスにするとスマホで高さが潰れるため） */
.rivets_lp_sns .rivets_lp_facebook {
	position: relative;
	padding-top: 0;
	width: 100%;
}

.rivets_lp_sns .rivets_lp_facebook .box {
	position: relative;
	width: 100%;
	height: auto;
	overflow: hidden;
}

/* 描画幅がコンテナを超えても、はみ出して切れないようにする */
.rivets_lp_sns .rivets_lp_facebook .fb-page,
.rivets_lp_sns .rivets_lp_facebook .fb-page > span,
.rivets_lp_sns .rivets_lp_facebook .fb-page iframe {
	max-width: 100% !important;
}