@charset "utf-8";
@media screen and (max-width : 767px){
	#contents_area {
		overflow: hidden;
		position: relative;
		background: #000;
		color: #fff;
		font-size: calc(16 / 393 * 100vw);
		line-height: 1.5;
	}

	#contents_area .pc {
		display: none !important;
	}

	.section {
		position: relative;
		z-index: 1;
		margin-top: calc(100 / 393 * 100vw);
	}
	.section img {
		display: block;
		width: 100%;
	}
	.section video {
		display: block;
		width: 100%;
	}

	.section .anc {
		visibility: hidden;
		opacity: 0;
		position: absolute;
	}

	.section h2 {
		border: solid var(--c-red);
		border-width: 3px 0;
		text-align: center;
		letter-spacing: .05em;
		font-size: calc(19 / 393 * 100vw);
		line-height: calc(43 / 393 * 100vw);
	}

	.title_en,
	.title_en>span {
		clip-path: polygon(0% 0%, 100% 0%, 100% var(--clip-end), 0% var(--clip-end));
	}
	.title_en {
		display: flex;
		justify-content: center;
		position: absolute;
		right: calc(30 / 393 * 100vw);
		width: calc(18 / 393 * 100vw);
		margin-top: calc(-118 / 393 * 100vw);
		padding: calc(9 / 393 * 100vw) 0;
		background: var(--c-red);
	}
	.title_en img {
		width: calc(9.5 / 393 * 100vw);
	}

	.section_inner {
		position: relative;
		z-index: 1;
		box-sizing: border-box;
		width: calc(353 / 393 * 100vw);
		margin: auto;
	}

	#contents_area .btn {
		display: block;
		box-sizing: border-box;
		width: calc(294 / 393 * 100vw);
		margin: auto;
		border: 4px solid var(--c-red);
		border-radius: calc(29 / 393 * 100vw);
		background: var(--c-gray);
		text-align: center;
		color: #fff;
		font-family: var(--font-bold);
		line-height: calc(50 / 393 * 100vw);
	}

	#contents_area .btn[target='_blank']>span::after {
		content: '';
		display: inline-block;
		width: calc(22 / 393 * 100vw);
		height: calc(50 / 393 * 100vw);
		margin-left: calc(10 / 393 * 100vw);
		background: url(../img/icon_outerlink.svg) 50% 50% / contain no-repeat;
		vertical-align: top;
	}


/* ----------------------------------------
	section_title
---------------------------------------- */

	#section_title {
		margin-top: 0;
		padding-top: calc(38 / 393 * 100vw);
	}
	#section_title h1 {
		position: relative;
		z-index: 2;
		font-family: var(--font-bold);
	}
	#section_title h1>img {
		width: calc(348 / 393 * 100vw);
		margin: auto;
	}

	#section_title .cp,
	#section_title .period {
		display: flex;
		align-items: center;
		position: absolute;
		left: calc(171 / 393 * 100vw);
		right: 0;
		top: calc(49 / 393 * 100vw);
		z-index: 1;
		padding: 0 calc(10 / 393 * 100vw);
	}
	#section_title .cp {
		background: var(--c-red);
		height: calc(33 / 393 * 100vw);
	}
	#section_title .cp img {
		width: calc(181 / 393 * 100vw);
	}

	#section_title .period {
		margin-top: calc(33 / 393 * 100vw);
		background: #000;
		height: calc(22 / 393 * 100vw);
	}
	#section_title .period img {
		width: calc(179 / 393 * 100vw);
	}

	#section_title .cp.anim_end,
	#section_title .period.anim_end {
		transition-delay: .5s;
	}
	#section_title .cp.anim_end>span,
	#section_title .period.anim_end>span {
		transition-delay: .8s;
	}

	#section_title .kv {
		position: relative;
		z-index: 1;
		width: calc(296 / 393 * 100vw);
		margin: calc(24 / 393 * 100vw) auto 0;
	}

	#section_title .btn_to_campaign {
		display: flex;
		justify-content: center;
		position: absolute;
		z-index: 1;
		left: 50%;
		box-sizing: border-box;
		width: calc(272 / 393 * 100vw);
		border: 1px solid;
		background: #000;
		transform: translate(-50%,-50%);
		color: var(--c-red);
		font-family: var(--font-bold);
		font-size: calc(14 / 393 * 100vw);
		line-height: calc(28 / 393 * 100vw);
	}

	#section_title .btn_to_campaign .text {
		display: inline-block;
		position: relative;
		padding: 0 calc(31 / 393 * 100vw) 0 calc(11 / 393 * 100vw);
	}
	#section_title .btn_to_campaign .text::after {
		content: '';
		position: absolute;
		right: calc(11 / 393 * 100vw);
		top: 0;
		bottom: 0;
		z-index: 1;
		width: calc(13 / 393 * 100vw);
		background: url(../img/arrow_down.svg) 100% 50% / contain no-repeat;
	}


/* ----------------------------------------
	rs_nav
---------------------------------------- */

	#rs_nav_btn {
		display: flex;
		align-items: center;
		position: absolute;
		left: 20px;
		top: 18px;
		z-index: 2;
		transform: translateY(-50%);
		mix-blend-mode: difference;
		color: var(--c-red);
		font-size: 12px;
		line-height: 1;
	}

	#rs_nav_btn.fixed {
		position: fixed;
	}

	#rs_nav_btn::before {
		content: '';
		opacity: .46;
		width: 18px;
		height: 3px;
		margin-right: 7px;
		background: #fff;
	}

	#rs_nav {
		visibility: hidden;
		opacity: 0;
		overflow-x: hidden;
		position: fixed;
		left: 0;
		right: 0;
		top: 0;
		z-index: 10;
		max-height: 100%;
		background: var(--c-red);
		transition: .5s;
		transition-property: visibility, opacity;
	}

	.nav_open #rs_nav {
		visibility: visible;
		opacity: 1;
	}

	#rs_nav_btn_close {
		display: flex;
		align-items: center;
		position: absolute;
		left: 20px;
		top: 18px;
		transform: translateY(-50%);
		font-size: 12px;
		line-height: 1;
		text-align: right;
		color: #000;
		font-family: var(--font-bold);
	}
	#rs_nav_btn_close::before {
		content: '';
		width: 18px;
		height: 3px;
		margin-right: 7px;
		background: #fff;
	}

	#rs_nav ul {
		display: flex;
		flex-direction: column;
		gap: 34px;
		padding: 63px 21px 35px;
	}
	#rs_nav li {
		display: flex;
	}
	#rs_nav li a {
		height: 14.5px;
	}
	#rs_nav li img {
		display: block;
		width: auto;
		height: 100%;
	}


/* ----------------------------------------
	section_whatisrs
---------------------------------------- */

	#section_whatisrs h2 {
		display: flex;
		justify-content: center;
		align-items: center;
		width: calc(213 / 393 * 100vw);
		height: calc(35 / 393 * 100vw);
		border: 0;
		background: var(--c-red);
	}
	#section_whatisrs h2 img {
		width: calc(165 / 393 * 100vw);
	}

	#section_whatisrs p {
		margin-top: calc(36 / 393 * 100vw);
		white-space: nowrap;
		line-height: 2.1;
	}


/* ----------------------------------------
	section_lineup
---------------------------------------- */

	#section_lineup h2 {
		display: flex;
		justify-content: center;
		align-items: center;
		width: calc(156 / 393 * 100vw);
		height: calc(24 / 393 * 100vw);
		margin: auto;
		border: 0;
		background: var(--c-red);
	}
	#section_lineup h2 img {
		width: calc(106 / 393 * 100vw);
	}

	#section_lineup .section_inner {
		width: calc(297 / 393 * 100vw);
	}

	#section_lineup ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: flex-end;
		row-gap: calc(52 / 393 * 100vw);
		margin-top: 15px;
		padding: 90px 0 78px;
		border: solid var(--c-red);
		border-width: 2px 0;
	}
	#section_lineup li {
		width: 50%;
		text-align: center;
	}
	#section_lineup li:nth-child(odd) {
		margin-left: calc(-5 / 393 * 100vw);
	}
	#section_lineup li:nth-child(even) {
		margin-right: calc(-10 / 393 * 100vw);
	}
	#section_lineup li a {
		display: block;
	}

	#section_lineup li .img {
		position: relative;
		z-index: 1;
		height: calc(72 / 393 * 100vw);
	}
	#section_lineup li .img img {
		position: absolute;
		left: 50%;
		width: auto;
		height: 100%;
		transform: translateX(-50%);
	}

	#section_lineup li .text {
		display: inline-block;
		position: relative;
		z-index: 1;
		margin-top: calc(10 / 393 * 100vw);
		padding-right: calc(18 / 393 * 100vw);
		color: var(--c-red);
		line-height: 1;
	}
	#section_lineup li .text::after {
		content: '';
		position: absolute;
		right: 0;
		top: 0;
		z-index: 1;
		border: solid transparent;
		border-width: calc(8 / 393 * 100vw) 0 calc(8 / 393 * 100vw) calc(14 / 393 * 100vw);
		border-left-color: var(--c-red);
	}

	#section_lineup li .text>span {
		position: relative;
		z-index: 1;
	}

	#section_lineup .n-one .img img {
		top: calc(-3 / 393 * 100vw);
		height: calc(75 / 393 * 100vw);
	}

	#section_lineup .vezel .img {
		/* height: calc(83 / 393 * 100vw); */
	}
	#section_lineup .vezel .img img {
		/* height: calc(93 / 393 * 100vw); */
		height: calc(72 / 393 * 100vw);
	}


/* ----------------------------------------
	section_campaign
---------------------------------------- */

	#section_campaign .heading {
		margin-top: calc(43 / 393 * 100vw);
		padding: calc(8 / 393 * 100vw) 0 calc(13 / 393 * 100vw);
		background: #fff;
		text-align: center;
		color: #000;
		font-family: var(--font-bold);
		font-size: calc(13 / 393 * 100vw);
		line-height: calc(50 / 3 / 13);
	}

	#section_campaign .heading .present {
		display: inline-block;
		margin-top: calc(15 / 393 * 100vw);
		text-align: left;
		color: var(--c-red);
		font-size: calc(20 / 393 * 100vw);
		line-height: 1;
	}

	#section_campaign .heading .item {
		display: block;
		margin-top: calc(10 / 393 * 100vw);
		font-size: calc(37.6 / 393 * 100vw)
	}

	#section_campaign .heading .text {
		display: block;
		margin-top: calc(10 / 393 * 100vw);
		text-align: right;
	}

	#section_campaign .present_detail {
		text-align: center;
		margin-top: calc(55 / 393 * 100vw);
		font-size: calc(15 / 393 * 100vw);
		line-height: 1;
	}
	#section_campaign .present_detail>li {
		display: grid;
		grid-template-columns: auto calc(160 / 393 * 100vw) calc(60 / 393 * 100vw);
		justify-content: center;
		align-items: flex-end;
		margin-top: calc(20 / 393 * 100vw);
		text-align: right;
	}
	#section_campaign .present_detail>li:first-child {
		margin-top: 0;
	}

	#section_campaign .present_detail .price {
		font-size: calc(26.5 / 393 * 100vw);
	}

	#section_campaign .present_detail li>span:nth-child(2) {
		font-size: calc(19.5 / 393 * 100vw);
	}

	#section_campaign .present_detail .number {
		font-size: calc(18 / 393 * 100vw);
	}

	#section_campaign .outline {
		width: calc(292 / 393 * 100vw);
		margin: calc(52 / 393 * 100vw) auto 0;
	}
	#section_campaign .outline p {
		margin-top: calc(26 / 393 * 100vw);
	}
	#section_campaign .outline p:first-child {
		margin-top: 0;
	}

	#section_campaign .btn_area li {
		margin-top: calc(40 / 393 * 100vw);
	}
	#section_campaign .btn_area small {
		display: block;
		width: calc(278 / 393 * 100vw);
		margin: calc(7 / 393 * 100vw) auto 0;
		padding-left: 1em;
		text-align: left;
		text-indent: -1em;
		font-size: calc(14 / 393 * 100vw);
	}


/* ----------------------------------------
	section_application
---------------------------------------- */

	#section_application .title_en {
		left: calc(30 / 393 * 100vw);
		right: auto;
		margin-top: calc(-98 / 393 * 100vw);
	}

	#section_application .section_inner {
		width: calc(294 / 393 * 100vw);
	}

	#section_application .step {
		margin-top: calc(100 / 393 * 100vw);
	}
	#section_application .step>li {
		margin-top: calc(70 / 393 * 100vw);
	}
	#section_application .step>li:first-child {
		margin-top: 0;
	}

	#section_application .step .text {
		padding-left: calc(6 / 393 * 100vw);
		font-family: var(--font-bold);
	}

	#section_application .step h3 {
		position: relative;
		font-size: calc(32 / 393 * 100vw);
		line-height: 1;
	}
	#section_application .step h3::before {
		content: '';
		position: absolute;
		left: calc(-36 / 393 * 100vw);
		right: 0;
		bottom: -2px;
		z-index: 1;
		border-bottom: 2px solid var(--c-red);
	}
	#section_application .step h3>span {
		position: relative;
		z-index: 1;
	}
	#section_application .step p {
		margin-top: calc(23 / 393 * 100vw);
	}

	#section_application .step03 .text p {
		white-space: nowrap;
		letter-spacing: -.02em;
	}
	
	#section_application .step .btn {
		margin-top: calc(34 / 393 * 100vw);
	}

	#section_application .step .note {
		display: block;
		margin-top: calc(10 / 393 * 100vw);
		padding-left: 1em;
		text-indent: -1em;
		font-family: var(--font-normal);
		font-size: calc(14 / 393 * 100vw);
	}

	#section_application .step .example {
		display: inline-block;
		margin-top: calc(6 / 393 * 100vw);
		letter-spacing: -.05em;
		font-size: calc(13 / 393 * 100vw);
		line-height: calc(27 / 13);
	}
	#section_application .step .example span {
		display: block;
		text-align: right;
	}

	#section_application .step figure {
		display: flex;
		justify-content: center;
		align-items: center;
		aspect-ratio: 1;
		width: calc(173 / 393 * 100vw);
		margin: calc(25 / 393 * 100vw) auto 0;
		border: 4px solid var(--c-red);
		background: #fff;
	}

	#section_application .step .step01 figure img {
		width: calc(69 / 393 * 100vw);
	}
	#section_application .step .step02 figure img {
		width: calc(123 / 393 * 100vw);
	}
	#section_application .step .step03 figure img {
		width: calc(99 / 393 * 100vw);
		margin-left: calc(19 / 393 * 100vw);
	}


/* ----------------------------------------
	section_terms
---------------------------------------- */

	#section_terms .title_en {
		margin-top: calc(-100 / 393 * 100vw);
	}

	#section_terms .section_inner {
		margin-top: calc(70 / 393 * 100vw);
		padding: calc(40 / 393 * 100vw) calc(18 / 393 * 100vw);
		background: var(--c-bg-terms);
	}

	#section_terms .box {
		overflow-x: hidden;
		box-sizing: border-box;
		height: calc(457 / 393 * 100vw);
		margin-right: calc(-10 / 393 * 100vw);
		padding-right: calc(10 / 393 * 100vw);
		font-family: var(--font-light);
		color: #000;
		font-size: calc(13 / 393 * 100vw);
	}

	#section_terms dt,
	#section_terms p,
	#section_terms ul,
	#section_terms ol {
		margin-top: 1.5em;
	}
	#section_terms dt:first-child,
	#section_terms p:first-child,
	#section_terms ul:first-child,
	#section_terms ol:first-child {
		margin-top: 0;
	}
	#section_terms ul li {
		position: relative;
		padding-left: 1em;
	}
	#section_terms ul li::before {
		content: '・';
		position: absolute;
		left: 0;
		z-index: 1;
	}

	#section_terms ul[data-style='kome'] li::before {
		content: '※';
	}

	#section_terms li ul {
		margin-top: 0;
	}
	#section_terms li li {
		padding-left: 0;
	}
	#section_terms li li::before {
		display: none;
	}


/* ----------------------------------------
	section_inquiry
---------------------------------------- */

	#section_inquiry {
		font-size: calc(12 / 393 * 100vw);
	}

	#section_inquiry h2 {
		border: 0;
		text-align: left;
		letter-spacing: 0;
		font-size: calc(15 / 393 * 100vw);
		line-height: 1;
	}
	#section_inquiry p {
		margin-top: calc(22 / 393 * 100vw);
	}
	#section_inquiry ul {
		margin-top: calc(18 / 393 * 100vw);
	}


/* ----------------------------------------
	section_movie
---------------------------------------- */

	#section_movie .section_inner {
		width: auto;
	}

	#section_movie h2 {
		width: calc(144 / 393 * 100vw);
		margin-left: calc(228 / 393 * 100vw);
		border: 0;
	}
	#section_movie li {
		position: relative;
		z-index: 1;
	}

	#section_movie .movie01 {
		width: calc(323 / 393 * 100vw);
		margin-top: calc(35 / 393 * 100vw);
	}

	#section_movie .movie02 {
		width: calc(234 / 393 * 100vw);
		margin: calc(45 / 393 * 100vw) 0 0 calc(140 / 393 * 100vw);
	}

	#section_movie .movie03 {
		width: calc(288 / 393 * 100vw);
		margin: calc(89 / 393 * 100vw) 0 0 calc(38 / 393 * 100vw);
	}

	#section_movie .movie04 {
		margin: calc(44 / 393 * 100vw) 0 0 calc(188 / 393 * 100vw);
	}


	/* ----------------------------------------
		btn_pagetop
	---------------------------------------- */

	#btn_pagetop {
		width: calc(204 / 393 * 100vw);
		margin: calc(70 / 393 * 100vw) auto 0;
		padding-bottom: calc(120 / 393 * 100vw);
	}
	#btn_pagetop a {
		display: block;
		position: relative;
		box-sizing: border-box;
		height: calc(139 / 393 * 100vw);
		padding-top: calc(27 / 393 * 100vw);
		border: 1px solid var(--c-red);
		text-align: center;
		color: var(--c-red);
		font-size: calc(24 / 393 * 100vw);
		line-height: 1;
		font-family: var(--font-bold);
	}
	#btn_pagetop a::before {
		content: '';
		display: block;
		width: 0;
		margin: 0 auto calc(12 / 393 * 100vw);
		border: solid transparent;
		border-width: 0 calc(20 / 393 * 100vw) calc(22 / 393 * 100vw) calc(20 / 393 * 100vw);
		border-bottom-color: var(--c-red);
	}
}