@charset "utf-8";
/* CSS Document */

/*------------------------------
 ▼共通デザイン（モバイル向け）
 -------------------------------*/
body {
	font-family: 'Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',sans-serif;
	font-size: 14px;
	color: #000000;
	line-height: 1.4;
}

img {
	display: block;
	width: 100%;
}

.pc__left_wrapper {
	display: none;
}

.pc__left_title a {
	display: inline;
}

.section__title::before {
	content: "about";
	display: block;
	letter-spacing: 0.1em;
	font-size: 40px;
	text-transform:uppercase;
}

.section__title {
	text-align: center;
	font-size: 14px;
}

/*    ここからトップの設定   */
.top {
	position: relative;
	height: 100svh;
	max-height: 720px;
}

.top__img {
	position: absolute;
	top: 50%;
	width: 100%;
	pointer-events: none;
}

.top__video {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.main-logo {
	display: block;
	width: 100%;
	max-width: 375px;
	padding: 0 8px;
	margin: auto;
}

.main-detail {
	display: inline;
}

/*    ここからAboutの設定   */
.about,
.schedule,
.inquiry,
.office {
	padding: 40px 16px;
	background-image: url(../images2/bg.jpg);
	background-size: cover;
}

.about__inner {
	margin: 20px 0 0 0;
	text-align: center;
}

.schedule .section__title::before {
	content: "schedule";
}

.about__img {
	max-width: 280px;
	margin: auto;
}

.about__txt {
	margin: 8px 0;
	font-size: 14px;
	line-height: 2.6;
}

.about__txt-main {
	display: block;
	font-size: 30px;
	font-weight: bold;
	line-height: 1.4;
}

.about__txt-important {
	margin: 0 4px;
	padding: 0 8px;
	color: #fff;
	background: #000;
}

.about__txt-img {
	width: 100%;
    max-width: 240px;
    margin: 12px auto 0;
}

/*    ここからdetailsの設定   */
.details_container {
	background-image: url(../images2/bg_3.jpg);
	background-size: contain;
	padding: 40px 0 0 0;
}

.details {
	padding: 24px 16px 0;
}

.details_new {
	background-image: url(../images2/bg.jpg);
	background-size: contain;
	clip-path: polygon(0 18%, 100% 0%, 100% 100%, 0% 100%);
	margin: -96px 0 0;
    padding: 96px 16px 40px;
}

.details_container .section__title {
	color: #fff;
}

.details_container .section__title::before {
	content: "details";
}

.details__txt-main-container {
	position: relative;
}

.details__txt-title-sub {
	width: 140px;
	position: relative;
	margin: 0 0 8px;
	padding: 2px 0;
	z-index: 2;
	text-align: center;
}

.details__txt-information {
	color: #fff;
    padding: 8px;
    border: 1px solid;
    margin: 0 0 12px 0;
}

.details__txt-title-sub_new {
	width: 200px;
	margin: 0 0 8px auto;
	color: #fff;
}

.details__txt-main {
	margin: 0 0 12px;
    background-size: 102px;
    background-repeat: no-repeat;
    background-position: right bottom;
}

.details__txt-main_new {
	background-size: 126px;
	background-position: left bottom;
}

.details__txt-title-sub::before {
	content: ""; /*ボックスを作る*/
    transform: skewX(-35deg);
    position: absolute; /*ポジションで中央に配置*/
    top: 0; bottom: 0; left: 0; right: 0;
    z-index: -1; /* 親要素の後ろに来るように-1 */
    background-color:#fff;
}

.details__txt-title-sub_new::before {
	background: #000;
	color: #fff;
}

.details__txt-title {
	font-size: 24px;
	line-height: 1.3;
	color: #fff;
}

.details__txt-title_new {
	text-align: end;
	color: #000;
}

.details__txt-number {
	width: 102px;
	position: absolute;
	right: 0;
	bottom: 0;
}

.details__txt-number_new {
	width: 126px;
	left: 0;
}

.details__txt {
	margin: 8px 0 12px;
	color: #fff;
}

.details__txt_new {
	color: #000;
}

.details__inner {
	max-width: 500px;
	margin: 0 auto;
}

/*    ここからSchedule  */

.schedule__inner {
	max-width: 500px;
	margin: auto;
	padding: 20px 0 0;
}

.schedule__card {
	width:100%;
	margin: 0 0 16px;
	text-align: center;
	background: #FFF;
	border: 1px solid #000;
}

.schedule__card:last-of-type {
	margin: 0;
}

.schedule__card-inner {
	padding: 12px;
}

.schedule__title {
	padding: 8px 0;
	color: #FFF;
	background: #000;
	font-size: 16px;
}

.schedule__day {
    font-size: 16px;
    font-weight: bold;
}

.schedule__note {
	font-size: 12px;
}

.schedule__txt {
	margin: 12px 0 0;
	padding: 12px 0 0;
	font-size: 12px;
	border-top: solid 1px #000;
}

.list__item {
	padding: 0 0 12px 0;
}

/*     ここから応募条件        */

.entry {
	padding: 40px 16px;
	background-image: url(../images2/bg_2.jpg);
	background-size: cover;
}

.entry .section__title {
	color: #fff;
}

.entry .section__title::before {
	content: "entry";
}

.entry__box {
	max-width: 500px;
	margin: 0 auto 50px;
	padding: 50px 16px 12px;
	background: #FFF;
}

.entry__box:first-of-type {
	margin: 50px auto;
}

.entry__box:last-of-type {
	margin: 0 auto;
}

/*    h2の見出しデザイン  */
.entry__title {
	width: 260px;
	margin: -76px auto 24px;
	padding: 12px 0;
	position: relative;
	font-size: 20px;
	font-weight: normal;
    z-index: 1;
    text-align: center;
	color: #fff;
}

.entry__title::before {
	content: "";
    transform: skewX(-20deg);
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: -1;
    background-color: #000;
	border: 2px solid #fff;
}

.entry__list {
	position: relative;
	padding: 0 0 0 14px;
}

.entry__txt {
	padding: 0 0 14px;
}

.list__item_mark::before {
	content: "・";
	position: absolute;
	left: 0;
}

.list__item_txt {
	font-weight: bold;
}

.list__item_txt::before {
    content: "※";
    position: absolute;
    left: 0;
}

/*   ここからpickの設定   */
.section__title-img {
	max-width: 295px;
	margin: 0 auto;
}
.pick {
	padding: 40px 24px;
	background-image: url("../images2/pick_bg.jpg");
	background-size: cover;
}

.section__title_color {
	color: #fff;
}

.section__title_color::before {
	content: "message";
}

.pick__inner {
	max-width: 500px;
	margin: 12px auto 0;
}

.pick__container {
	text-align: center;
}

.pick__img {
	margin: 0 auto 12px;
	border: 1px solid #fff;
}

.pick__caption {
	color: #ffF;
	text-align: left;
}

.pick__caption-img {
	max-width: 286px;
    margin: 24px auto 12px
}

.pick__caption-sub {
	max-width: 160px;
	margin: 16px auto 40px;
}

.pick__caption-item {
	display: inline-block;
	margin: 4px;
	padding: 6px 8px;
	background: #fff;
	color: #8900FF;
	font-size: 12px;
}

.pick__caption-tag {
	font-size: 0;
	text-align: left;
}

.pick__video {
	width: 100%;
	margin: 24px auto 0;
	border: 1px solid #fff;
}

/*     ここからFAQ        */
.inquiry .section__title::before {
	content: "faq";
}

.inquiry__inner {
	padding: 24px 0 0;
}

.accordion {
	max-width: 500px;
	margin: auto;
}

.accordion__check {
	display: none;
}

.accordion__label {
	display: block;
	position: relative;
	padding: 24px 40px;
	background: #000;
	color: #fff;
	cursor: pointer;
}

.accordion__content {
	position: relative;
	height: 0;
	margin: 6px 0 16px 0;
	opacity: 0;
	border: 1px solid #000;
	visibility: hidden;
	background: #fff;
}

/*    Q・A疑似要素    */
.accordion__label::before {
	content: "q";
	position: absolute;
	left: 16px;
	font-size: 16px;
	color: #fff;
	text-transform:uppercase;
}

.accordion__label::after {
	content: '';
	position: absolute;
	top: 0;
	right: 16px;
	bottom: 0;
	width: 8px;
	height: 8px;
	margin: auto 0;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	transform: rotate(135deg);
}

.accordion__content::before {
	content: "a";
	position: absolute;
	left: 16px;
	height: 0;
	font-size: 16px;
	color: #000;
	text-transform:uppercase;
}

/*    開閉時    */
.accordion__check:checked + .accordion__label + .accordion__content {
	height: auto;
	padding: 16px 16px 16px 40px;
	opacity: 1;
	visibility: visible;
}

.accordion__check:checked + .accordion__label::after {
	transform: rotate(-45deg);
}

.content__list_marker {
	display: table-cell;
}

.content__list_text {
	display: table-cell;
}

.content__list_ltem {
	margin: 8px 0;
}

/*ここからフッター*/
.footer {
	position: relative;
	padding: 24px 0 94px;
	background: #000;
}

.back-top {
	position: absolute;
	left: 50%;
	top: -20px;
	transform: translateX(-50%);
	width: 60px;
	height: 60px;
	background: #000;
	border-radius: 50%;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}

.back-top::before {
	content: '';
	position: absolute;
	left: 50%;
	top: -20px;
	bottom: 0;
	transform: translateX(-50%) rotate(-45deg);
	width: 8px;
	height: 8px;
	margin: auto;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
}

.footer__logo {
	position: relative;
}

.main-logo-small {
	width: 260px;
	padding: 0 16px 16px;
}

.form {
	display: flex;
	position: fixed;
	bottom: 16px;
	width: 100%;
	padding: 0 8px;
	text-align: center;
	justify-content: center;
	z-index: 3;
}

.form__link {
	display: inline-block;
	width: 100%;
	max-width: 343px;
	padding: 16px 0;
	margin: 0 8px;
	border-radius: 28px;
	line-height: 1;
	background: #8900FF;
	color: #fff;
	font-size: 24px;
	font-weight: bold;
}

.footer__copyright {
	margin: 16px 0 0;
	text-align: center;
	font-size: 10px;
	color: #fff
}

.footer__link-wrap {
	text-align: center;
}

.footer__link {
	display: inline-block;
	margin: 0 4px;
	padding: 4px;
	color: #fff;
}

.office {
	text-align: center;
	padding: 16px 16px 60px;
}

.office  .section__title::before {
	content: "management";
	font-size: 30px;
}


.office__txt {
	padding: 24px 0 16px;
	font-size: 16px;
	font-weight: bold;
}

.office__inner {
    max-width: 500px;
    margin: auto;
}

.office__message {
	padding: 24px 0;
	border-bottom: 1px solid #000;
	text-align: initial;
}

.after__flow {
    text-align: center;
}

.triangle {
    display: inline-block;
    border-right: 20px solid transparent;
    border-left: 20px solid transparent;
    border-top: 16px solid #000;
    height: 16px;
}

.after__flow-important {
	display: block;
	font-size: 24px;
    font-weight: bold;
    color: #7600dc;
}
.after__flow-txt {
    padding: 8px 0 16px;
    line-height: 1.4;
    font-size: 20px;
}

/*-------------------------------
 ▼大型画面向けデザイン（PCなど）
 --------------------------------*/
@media screen and (min-width: 769px) {
	.pc__top {
		background-image: url("../images2/pc_bg.jpg");
		background-attachment: fixed;
		background-size: cover;
		background-position: center;
	}

	.pc__top_wrapper {
		display: flex;
		justify-content: center;
		margin: 0 40px;
	}

	.pc__left_wrapper {
		position: sticky;
		top: 0;
		height: 100vh;
		display: flex;
		width: 100%;
		max-width: 460px;
		margin: 0 60px 0 0;
		flex: 1;
	}

	.pc__left {
		display: flex;
		flex-direction: column;
		justify-content: center;
		width: 100%;
	}

	.form {
		position: static;
		display: block;
	}

	.form__txt {
		margin: 0 0 16px;
		color: #fff;
		font-size: 20px;
		font-weight: bold;
	}

	.form__qr {
		max-width: 140px;
		margin: 0 auto;
		padding: 6px;
		background: #fff;
	}

	.pc__right {
		width: 500px;
		background-color: #fff;
	}

	.pc__main-logo {
		width: 100%;
	}

	.pc__main-detail {
		display: inline;
		width: 270px;

	}

	.footer {
		padding: 32px 16px;
	}

	.footer__link-content {
		max-width: 1024px;
		padding: 24px 16px;
	}

}

/*　　フッターリンク　　*/

.footer__link-content {
	margin: auto;
	padding:40px 24px;
}

.content__heading {
	margin: 0 16px 24px;
	font-size: 21px;
}

.info__list {
	position: relative;
	padding: 0 0 0 14px;
	margin: 12px 0;
}

.link__txt {
	padding: 0 16px;
}

.link__txt-last {
	padding: 24px 16px;
}

.link__heading {
	margin: 24px 0 16px;
	font-size: 16px;
}

.txt {
	margin: 0 0 8px;
}

.list__item_namber {
	list-style: decimal;
}

.list__item_bracket {
	position: relative;
	padding: 0 0 0 12px;
	list-style: none;
	counter-increment: cnt;
}

.list__item_bracket::before {
	position: absolute;
    left: -12px;
    content: "(" counter(cnt) ") ";
}

.link__txt-heading {
	padding: 16px 0 8px;
	font-size: 16px;
}

.list__item_namber > .info__list {
	padding: 0;
}

.chala__list a {
	display: block;
	margin: 3%;
}

.chala__list [class*="chala__"] {
    padding-bottom: 7%;
}

.chala__list [class*="chala__"]:nth-child(even) {
    background: #f0fff8;
}

.chala__list [class*="chala__"]:nth-child(odd) {
    background: #ebeeff;
}

.guidelines__head {
    text-align: center;
    padding: 8% 0;
    background: #1d1d1d;
    color: #fff;
    font-size: 20px;
    letter-spacing: 3px;
}

.guidelines__list {
    padding: 3%;
}

.guidelines__list dt {
    padding: 5px 8px;
    border-left: 4px solid #111;
    font-weight: bold;
    margin-bottom: 10px;
}

.guidelines__list dd {
    margin-bottom: 30px;
}

.end__txt {
    margin: 6% 6% 10%;
    text-align: center;
    padding: 5% 0;
    border: 2px solid #c5c5c5;
    color: #646464;
    font-weight: bold;
}

.store__list {
    display: flex;
    flex-wrap: wrap;
    text-align: center;
    justify-content: space-evenly;
}

.store__list__item {
    width: calc(50% - 5px);
    margin-top: 10px;
}

.store__list__item a {
    display: block;
    padding: 10px 0;
    border: 1px solid #6b6b6b;
    background: #fff;
    color: #111;
}

body {
	min-width: 320px;
}

.pc__left_title {
    text-align: center;
}

.monopre {
    background: #1f1f1f;
    padding: 30px 0;
}

.monopre .end__txt {
    margin: 10px;
    padding: 15px;
    text-align: left;
    background: #f5f5f5;
    color: #111;
}