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

/*------------------------------
 ▼共通デザイン（モバイル向け）
 -------------------------------*/
body {
	font-family: "Noto Sans JP", serif;
	font-size: 14px;
	color: #7C5D64;
	line-height: 1.5;
	letter-spacing: 0.05em;
}

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

.pc__left_wrapper {
	display: none;
}

.section__title::before {
	content: "";
	display: block;
	background-size: contain;
	background-repeat: no-repeat;
	height: 58px;
	margin: 0 auto;
}

.section__title {
	text-align: center;
	font-size: 12px;
	color: #CA8BA4;
	font-weight: 600;
}

.main {
	overflow: hidden;
}

.pc__right::before {
	content:"";
display:block;
position:fixed;
top:0;
left:0;
z-index:-1;
width:100%;
height:100dvh;
background-repeat:no-repeat;
background-position:50% 100%;
background-image:url(../images/sp-bg.jpg);
background-size:cover;
}

/* -------------------- animation -------------------- */
.fadeUp,
.mvFadeUp {
	opacity:0;
}

.Up {
	animation-name: fadeUpAnime;
	animation-duration: 1.2s;
	animation-fill-mode: forwards;
}

@keyframes fadeUpAnime {
	from {
		opacity: 0;
		transform: translateY(30px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.fadeIn,
.mvFadeIn {
	opacity: 0;
}

.In {
	animation-name: fadeInAnime;
	animation-duration: .1.2s;
	animation-fill-mode: forwards;
}

@keyframes fadeInAnime {
	from {
		opacity: 0;
		transform: translateX(-50px);
	}

	to {
		opacity: 1;
		transform: translateX(0);
	}
}

/*    ここからトップの設定   */
.top {
	position: relative;
	height: 100vh;
	background-image: url(../images/bg_img.png);
	background-size: cover;
	background-position: bottom;
}

.top__img {
	position: absolute;
	bottom: 10%;
	left: 50%;
	width: 100%;
	max-width: 500px;
	transform: translate(-50%,0);
}

.top__img-main {
	position: absolute;
	top: 5%;
	left: 50%;
	transform: translate(-55%, 0);
	width: auto;
	height: 70%;
	mask-image: linear-gradient(180deg, black, black 60%, transparent 90%);
}

.top__img-sub {
	position: absolute;
	top: 10%;
	left: 4.1%;
	width: 33%;
}

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

.main-detail {
	width: 75%;
	padding: 5% 8px 0 12px;
	margin: auto;
}

/*    ここからAboutの設定   */
.schedule,
.inquiry,
.office {
	padding: 64px 16px;
}

.about {
	padding: 64px 0 40px;
	max-width: 500px;
	margin: 0 auto;
}

.about__title {
	max-width: 360px;
	padding: 0 16px;
}

.about__img-container {
	margin: 0 -16px;
	position: relative;
}

.schedule .section__title::before {
	background-image: url(../images/flow.png);
	max-width: 157px;
}

.about__img-left {
	max-width: 80%;
	border-radius: 12px;
}

.about__img-right {
	max-width: 45%;
	margin: -40% 0 0 auto;
	border-radius: 12px;
}

.about__img-container::before {
	content: "";
	background-image: url(../images/butterfly_1.png);
	width: 115px;
	height: 108px;
	background-size: contain;
	background-repeat: no-repeat;
	position: absolute;
	top: -30px;
	right: 0;
	z-index: 2;
}

.about__img-container::after {
	content: "";
	background-image: url(../images/butterfly_2.png);
	width: 85px;
	height: 81px;
	background-size: contain;
	background-repeat: no-repeat;
	position: absolute;
	left: 4%;
	bottom: 8%;
}

.about__txt {
	margin: 24px 0;
	font-size: 16px;
	line-height: 2;
	letter-spacing: 0.1em;
	font-family: "Noto Serif JP", serif;
	font-weight: 500;
	padding: 0 16px;
}

.about__txt-main {
	font-size: 20px;
}

.about__txt-important {
	color: #da73b8;
}

/*    ここからSchedule  */

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

.schedule__card {
	width:100%;
	margin: 0 0 16px;
	background: #FFF;
	border-radius: 8px;
	overflow: hidden;
}

.schedule__card-inner {
	padding: 10px;
}

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

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

.schedule__note {
	font-size: 12px;
}

.schedule__txt {
	margin: 10px 0 0;
	padding: 10px 0 0;
	font-size: 14px;
	border-top: solid 1px #ddd;
}

.schedule__info {
	font-size: 12px;
	color: #CA8BA4;
}

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

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

.entry {
	padding: 64px 16px;
}

.entry .section__title::before {
	background-image: url(../images/entry.png);
	max-width: 171px;
}

.entry__box {
	position: relative;
	max-width: 500px;
	margin: 0 auto 50px;
	padding: 40px 16px 16px;
	background: #FFF;
	border-radius: 8px;
}

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

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

/*    h2の見出しデザイン  */
.entry__title {
	width: 260px;
	position: absolute;
	top: 0%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.entry__title-sub {
	position: relative;
	text-align: center;
	color: #CA8BA4;
	font-weight: normal;
	margin: 0 0 8px 0;
}

.entry__title-sub:before {
	position: absolute;
	top: calc(50% - 1px);
	left: 0;
	width: 100%;
	height: 1px;
	content: '';
	background: #CA8BA4;
}

.entry__title-sub .entry__title-sub-span {
	position: relative;
	background: #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::before {
	content: "※";
	position: absolute;
	left: 0;
}

/*   ここからpuroducerの設定   */
.section__title-img {
	max-width: 390px;
	margin: 0 auto;
}
.puroducer {
	padding: 40px 16px;
	background-image: url("../images/puroducer_bg.jpg");
	background-size: cover;
}


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

.puroducer__container {
	text-align: center;
}

.puroducer__img {
	margin: 0 auto 16px;
}

.puroducer__caption {
	text-align: left;
	margin: 4px 0 0 0;
}

.puroducer__caption-img {
	max-width: 358px;
	margin: 48px auto 24px;
}

.puroducer__caption-title {
	text-align: center;
}


/*ここから合格後のサポート*/

.works {
	position: relative;
	padding: 64px 0 54px; 
	background-image: url("../images/pick_bg.jpg");
	background-size: cover;
}

.works::after {
	content: "";
	background-image: url("../images/txt.png");
	width: 20px;
	height: 308px;
	background-size: contain;
	background-repeat: no-repeat;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: .5%;
}

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

.works__list-item:nth-child(1) {
	position: relative;
}

.works__list-item:nth-child(1)::after {
	content: "";
	position: absolute;
	background-image: url("../images/butterfly_2.png");
	width: 131px;
	height: 122px;
	background-size: contain;
	background-repeat: no-repeat;
	top: 24px;
	right: -48px;
}

.works__list-item:nth-child(3) {
	position: relative;
}

.works__list-item:nth-child(3)::after {
	content: "";
	position: absolute;
	background-image: url("../images/butterfly_2.png");
	width: 131px;
	height: 122px;
	background-size: contain;
	background-repeat: no-repeat;
	bottom: 24px;
	left: -64px;
	transform: rotate(35deg);
}

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

.back-top {
	position: absolute;
	left: 50%;
	top: -20px;
	transform: translateX(-50%);
	width: 60px;
	height: 60px;
	background: #f0e3ef;
	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 #cf9bdb;
	border-right: 2px solid #cf9bdb;
}

.footer__logo {
	position: relative;
}

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

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

.form__link {
	display: inline-block;
	width: 100%;
	max-width: 500px;
	margin: 0 auto;
	padding: 12px 0;
	border-radius: 28px;
	background-image: url(../images/button-bg.jpg);
	background-size: cover;
	background-position: center;
}

.buttom__txt {
	max-width: 150px;
	margin: 0 auto;
}

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

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

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

.office {
	padding: 0 16px 64px;
}

.office  .section__title::before {
	background-image: url(../images/message.png);
	max-width: 258px;
}

.office__txt {
	font-weight: 600;;
	text-align: center;
}

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

.office__message {
	padding: 24px 0;
	text-align: initial;
}

.question__container {
	position: relative;
	padding: 0 0 0 44px;
	min-height: 42px;
	display: flex;
	align-items: center;
}

.question__list-item {
	background: #ffffff;
	padding: 24px 16px;
	border-radius: 8px;
	box-shadow: 0px 0px 10px 0px #e687ad6e;
	margin: 0 0 24px 0;
}

.question::before {
	content: "";
	background-image: url(../images/Q.png);
	width: 35px;
	height: 42px;
	background-size: contain;
	background-repeat: no-repeat;
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}

.anser__container {
	position: relative;
	padding: 12px 48px 0 0;
}

.anser::after {
	content: "";
	background-image: url(../images/icon.png);
	width: 36px;
	height: 36px;
	background-size: contain;
	position: absolute;
	right: 0;
}

.anser {
	padding: 16px 12px;
	border-radius: 12px;
	background: -moz-linear-gradient(left, #fff4f4, #faf1f9);
	background: -webkit-linear-gradient(left, #fff4f4, #faf1f9);
	background: linear-gradient(to right, #fff4f4, #faf1f9);
}

.anser::before {
	content: "";
	display: inline-block;
	position: absolute;
	bottom: 14px;
	right: 30px;
	border: 8px solid transparent;
	border-left: 16px solid #faf1fa;
}

.balloon5 {
	width: 100%;
	margin: 1.5em 0;
	overflow: hidden;
  }
  
  .balloon5 .faceicon {
	float: left;
	margin-right: -90px;
	width: 80px;
  }
  
  .balloon5 .faceicon img{
	width: 100%;
	height: auto;
	border: solid 3px #d7ebfe;
	border-radius: 50%;
  }
  
  .balloon5 .chatting {
	width: 100%;
  }
  
  .says {
	display: inline-block;
	position: relative; 
	margin: 5px 0 0 105px;
	padding: 17px 13px;
	border-radius: 12px;
	background: #d7ebfe;
  }
  
  .says::before {
	content: "";
    display: inline-block;
    position: absolute;
    top: 18px;
    right: -24px;
    border: 12px solid transparent;
    border-left: 12px solid #d7ebfe;
  }
  
  .says p {
	margin: 0;
	padding: 0;
  }

/*-------------------------------
 ▼大型画面向けデザイン（PCなど）
 --------------------------------*/
@media screen and (min-width: 769px) {
	.pc__top {
		background-image: url("../images/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: 500px;
		margin: 0 5% 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: #a07980;
		font-size: 16px;
		font-weight: 600;;
	}

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

	.pc__right {
		width: 390px;
		background-color: #f9f2f5;
		box-shadow: 0px 0px 20px 0px #73008326;

	}

	.pc__main-logo {
		width: 100%;
	}

	.pc__main-detail {
		position: unset;
		padding: 8px 0 30px;
		max-width: 65%;
	}

	.footer {
		padding: 32px 16px;
	}

	.pc__right_form {
		display: none;
	}

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

	.top {
		max-height: 844px;
	}

	.about {
		padding: 0px 0 40px;
	}

}

/*　　フッターリンク　　*/

.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;
}