@charset "utf-8";
/* =================================================
Foundation
================================================= */
:root {
  --primary-font-family: "M PLUS Rounded 1c", sans-serif;
  --font-en: "Roboto", serif;
	--c-body: #00000;
	--c-primary: #2dbbed;
	--c-secondary: #ffb400;
	--c-border: #d8d8d8;
  --sec_margin-inline: 20px;
  --cont_margin-inline: 150px;
  --cont_margin-block: 200px;
  --cont_margin-block02: 150px;
}
@media (max-width: 1300px) {
  :root {
    --cont_margin-inline: 120px;
    --cont_margin-block: 150px;
    --cont_margin-block02: 100px;
  }
}
@media (max-width: 960px) {
  :root {
    --cont_margin-inline: 90px;
    --cont_margin-block: 100px;
  }
}
@media (max-width: 769px) {
  :root {    
    --cont_margin-inline: 20px;
    --cont_margin-block: 70px;
    --cont_margin-block02: 50px;
  }
}

/* Base
------------------------------------------------- */
* {
	font-weight: 500;
	font-style: normal;
	font-family: var(--primary-font-family);
	margin: 0;
	padding: 0;
	line-height: 1.75;
	/*letter-spacing: .1em;*/
	color: var(--c-body);
	box-sizing: border-box;
	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
}
html {
	font-size: 62.5%;
	scroll-behavior: smooth; 
}
body {
	font-size: 20px;
	font-size: 2.0rem;
	word-wrap: break-word;
	font-display: swap;
	overflow-wrap: break-word;
	overflow-x: hidden;
	position: relative;
	width: 100vw;
	height: 100vh;
	background: radial-gradient(at 100% 100%, #f9ccb4, transparent 80%),
		radial-gradient(at 100% 0%, #f7f39a, transparent 50%),
		radial-gradient(at 0% 100%, #b6d88d, transparent 50%), 
		radial-gradient(at 0% 0%, #5bc3e7, transparent);
	background-attachment: fixed;
	background-size: cover;
}
@media screen and (max-width: 767px) {
	body {
		font-size: 1.4rem;
	}
}
@media screen and (max-width: 374px) {
	html {
		font-size: 2.667vw;
	}
}
img {
	border: 0;
	vertical-align: bottom;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}


/* =================================================
Animation
================================================= */
@keyframes fadeIn {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}
@keyframes translate {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
		transform : translate(0, 0);
	}
}
@keyframes blur {
	0% {
		opacity: 0;
		-ms-filter: blur(6px);
		filter: blur(6px);
	}
	100% {
		opacity: 1;
		-ms-filter: blur(0);
		filter: blur(0);
	}
}
@keyframes rotate {
	0% {
		opacity: 0;
    transform: rotate( 45deg );
	}
	100% {
		opacity: 1;
		transform : translate(0, 0) rotate( 45deg );
	}
}
.-fadein {
	opacity: 0;
}
.-translate {
	opacity: 0;
	transform : translate(0, 5px);
}
.-blur {
	opacity: 0;
}
.fv-fadein {
	opacity: 0;
	animation: fadeIn 0.5s ease-in-out 0.5s forwards;
}
.fv-translate {
	opacity: 0;
	animation: translate 0.3s ease-in-out 0.5s forwards;
}
.fv-blur {
	opacity: 0;
	animation: blur 0.5s ease-in-out 0.5s forwards;
}
.js-effect__fade {
	animation: fadeIn 0.5s ease-in-out 0.5s forwards;
}
.js-effect__blur {
	animation: blur 0.2s ease-in-out 0.5s forwards;
}
.js-effect__translate {
	animation: translate 0.5s ease-in-out 0.5s forwards;
}


/* =================================================
Layout
================================================= */
#l-container {
	width: 100%;
	overflow: hidden;
	position: relative;
	background: url(../images/wrp_bg.png) repeat-y;
	background-size: contain;
}

/* Header
------------------------------------------------- */
.l-header {
	background: url(../images/logo_bg.png) no-repeat center 0;
	background-size: contain;
	padding: 40px 0 60px;
}
.l-header__ttl {
	margin: 0 auto;
	color: #ea531a;
	text-align: center;
	font-size: 3.0rem;
	font-weight: 700;
	line-height: 1.0;
}
.l-header__ttl span {
	font-size: 4.0rem;
	font-weight: 700;
}
.l-header__txt {
	color: #4a4b4b;
	font-weight: 700;
	text-align: center;
}
@media (max-width: 960px) {
	.l-header__ttl {
		font-size: 2.0rem;
	}
	.l-header__ttl span {
		font-size: 3.0rem;
	}
}
@media (max-width: 769px) {
	.l-header {
		background-size: 100% 100%;
		padding: 20px 0 30px;
	}
	.l-header__ttl {
		font-size: 1.4rem;
		line-height: 1.6;
	}
	.l-header__ttl span {
		font-size: 1.8rem;
	}
}

/* ---------- Global Nav ----------*/
.menu-container {
	position: fixed;
	top: 30px;
	right: 30px;
	z-index: 500;
}
.burger-menu {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	row-gap: 10px;
	width: 100px;
	height: 100px;
	border-radius: 50%;
	background: #ffffff;
	cursor: pointer;
	z-index: 10;
}
.burger-menu .bar {
	margin: 0 auto;
	background-color: #60b4a2;
	height: 6px;
	width: 40px;
	border-radius: 6px;
	transition: all 0.3s ease;
}
.burger-menu_txt {
	font-size: 1.6rem;
	color: #60b4a2;
	font-family: var(--primary-font-family);
	font-weight: 900;
	letter-spacing: 0;
	text-align: center;
	line-height: 1.0;
}
/* ハンバーガーメニューが回転する */
.burger-menu.open .bar:nth-child(1) {
	transform: rotate(45deg);
	position: relative;
	top: 5px;
}
.burger-menu.open .bar:nth-child(2) {
	transform: rotate(-45deg);
	position: relative;
	bottom: 11px;
}
@media (max-width: 960px) {
	.burger-menu {
		row-gap: 5px;
		width: 60px;
		height: 60px;
	}
	.burger-menu .bar {
		height: 4px;
		width: 20px;
		border-radius: 3px;
	}
	.burger-menu_txt {
		font-size: 1.2rem;
	}
	/* ハンバーガーメニューが回転する */
	.burger-menu.open .bar:nth-child(1) {
		top: 2px;
	}
	.burger-menu.open .bar:nth-child(2) {
		bottom: 7px;
	}
}
@media (max-width: 769px) {
	.menu-container {
		top: 10px;
		right: 10px;
	}
}

/* ナビゲーションメニュー */
.nav {
	position: fixed;
	top: 0;
	right: -100%; 
	width: 80%; /* メニュー幅 */
	max-width: 300px;
	height: 100vh;
	padding-top: 150px;
	background-color: #60b4a2;
	transition: right 0.3s ease-in-out;
	z-index: 5;
}
.nav ul {
	list-style: none;
	display: flex;
	flex-direction: column;
	align-items: center;
	transform:rotateZ(0.03deg);
}
.nav ul li {
	margin: 0 0 20px;
	color: #ffffff;
	font-size: 2.2rem;
	font-weight: 700;
}
.nav ul li a {
	color: #ffffff;
	text-decoration: none;
	font-size: 2.2rem;
	font-weight: 700;
}
.nav ul li ul li {
	margin: 0 0 5px;
}
.nav ul li ul li a {
	font-size: 1.8rem;
	font-weight: 700;
	color: #f3ec49;
}

/* メニューが表示されたとき */
.nav.open {
  right: 0;
}


#concept,
#skill,
#onga,
#kasuya,
#ukiha,
#chikushi,
#entry {
  scroll-margin-top: 150px;
}
@media screen and (max-width: 767px) {
	#concept,
	#skill,
	#onga,
	#kasuya,
	#ukiha,
	#chikushi,
	#entry {
	  scroll-margin-top: 50px;
	}
}

/* Footer
------------------------------------------------- */

/* =================================================
Object
================================================= */

/*---------- component ----------*/
/*--wrap--*/
.c-cont__f {
  margin: 0;
}
.c-cont__ll {
  margin: 0 var(--cont_margin-inline);
}
.c-cont__l {
  max-width: 1620px;
  margin: 0 auto;
}
.c-cont__m {
  max-width: 1200px;
  margin: 0 auto;
}
.c-cont__s {
  max-width: 800px;
  margin: 0 auto;
}
.c-cont {
  padding-top: 100px;
  padding-bottom: 200px;
  position: relative;
}
@media screen and (max-width: 1720px) {
  .c-cont__ll,
  .c-cont__l {
    margin: 0 var(--cont_margin-inline);
  }
}
@media screen and (max-width: 1300px) {
  .c-cont__m {
    margin: 0 var(--cont_margin-inline);
  }
}
@media screen and (max-width: 960px) {
  .c-cont__ll,
  .c-cont__l,
  .c-cont__m {
    margin: 0 var(--cont_margin-inline);
  }
}
@media screen and (max-width: 769px) {
  .c-cont__ll,
  .c-cont__l,
  .c-cont__m,
  .c-cont__s {
    margin: 0 var(--cont_margin-inline);
  }
  .c-cont {
    padding-top: 70px;
    padding-bottom: 100px;
  }
}

/*----- Title -----*/
/*--c-page-ttl--*/
.c-page-ttl {
  animation: blur 0.5s ease-in-out 0.5s forwards;
}


/* Section Title */
.c-sec-ttl01 {
}
.c-sec-en01 {
}

.c-sec-txt01 {
}

/* section */
.c-section {
}

/* table */
.c-table {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

/* list */
.c-sec-list {
  margin-bottom: 50px;
}

/*----- Button -----*/
.c-btn-cta {
}
.c-btn-cta a {
}

.c-btn {
}
.c-btn-l {
}
.c-btn a {
}



/*--c-menu--*/

/*---------- project ----------*/
.p-mv {
	display: flex;
	flex-direction: row-reverse;
	justify-content: center;
	/*align-items: center;*/
	height: 850px;
	margin-top: -30px;
	overflow: hidden;
}
.p-mv-catch {
	flex-basis: 60%;
	max-width: 900px;
	margin-right: 35%;
	z-index: 10;
}
.p-mv-obj__img {
	position: absolute;
	top: 300px;
    left: 30%;
    width: 80%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.obj01 img {
    /* 画像サイズはwrapperに合わせて調整 */
    width: 90%; 
    height: auto;
    /* 男の子が奥になるようにZ-index調整 */
    z-index: 1; 
    /* 微妙な位置調整 (必要に応じて) */
    transform: translate(10%, -150px);
}
.obj02 img {
    /* 画像サイズはwrapperに合わせて調整 */
    width: 85%; 
    height: auto;
    /* 女の子が少し前に出るようにZ-index調整 */
    z-index: 2; 
    /* 微妙な位置調整 (必要に応じて) */
    transform: translate(-12%, 5%);
}
.p-mv-catch img,
.obj01 img,
.obj02 img {
    display: block;
}
@media screen and (max-width: 1640px) {
	.p-mv {
		height: 700px;
	}
	.p-mv-catch {
		flex-basis: 55%;
	}
	.p-mv-obj__img {
		top: 350px;
	}
	.obj02 img {
		transform: translate(-12%, 0%);
	}
}
@media screen and (max-width: 1350px) {
	.p-mv {
		height: 600px;
	}
	.obj02 img {
		transform: translate(-12%, 0%);
	}
}
@media screen and (max-width: 1100px) {
	.p-mv {
		height: 500px;
	}
	.p-mv-catch {
		flex-basis: 50%;
	}
	.p-mv-obj__img {
		top: 350px;
	}
	.obj02 img {
		transform: translate(-12%, 0%);
	}
}
@media screen and (max-width: 960px) {
	.p-mv {
		height: 400px;
	}
	.obj02 img {
		transform: translate(-12%, -5%);
	}
}

@media screen and (max-width: 820px) {
	.p-mv {
		height: 800px;
	}
	.p-mv-catch {
		flex-basis: 70%;
		margin: 0 auto;
	}
	.p-mv-obj__img {
		top: 750px;
		left: 0%;
		width: 100%;
	}
	.obj02 img {
		transform: translate(-23%, -100px);
	}
}
@media screen and (max-width: 768px) {
	.p-mv {
		height: 750px;
		margin-top: 0px;
	}
	.p-mv-obj__img {
		top: 650px;
	}
}
@media screen and (max-width: 640px) {
	.p-mv {
		height: 600px;
	}
	.p-mv-obj__img {
		top: 600px;
	}
}
@media screen and (max-width: 520px) {
	.p-mv {
		height: 500px;
	}
	.p-mv-obj__img {
		top: 500px;
	}
}
@media screen and (max-width: 430px) {
	.p-mv {
		height: 450px;
	}
}


.p-concept {
	background: linear-gradient(135deg, rgb(241, 147, 100) 0%, rgb(138, 194, 48) 40%, rgb(80, 193, 229) 70%, rgb(160, 80, 154) 100%);
    border-radius: 100px;
	width: 80%;
	margin: 0 auto 250px;
    padding: 20px;
	text-align: center;
	position: relative;
	z-index: 100;
}
.p-concept_inner {
	background: #ffffff;
	border-radius: 80px;
	padding: 100px;
}
.p-concept__ttl {
	width: 100%;
	max-width: 1100px;
	margin: 0 auto 80px;
	text-align: center;
}
.p-rainbow-text {
	display: inline-block;
	margin: 0 auto 50px;
    background: linear-gradient(
		315deg,
		#f1936e 25%, /* 赤 */
		#8ac230 45%, /* 緑 */
		#50c1e5 65%, /* 青 */
		#a0509a 85%  /* 紫 */
	  );
	-webkit-background-clip: text; /* Safari/Chrome用 */
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent; 
	font-weight: 900;
	font-size: 5.0rem;
	line-height: 1.5;
	text-align: center;
}
.p-concept_txt {
	font-size: 4.0rem;
	font-weight: 700;
}
@media screen and (max-width: 1300px) {
	.p-rainbow-text {
		font-size: 4.0rem;
	}
	.p-concept_txt {
		font-size: 2.8rem;
	}
}
@media screen and (max-width: 1024px) {
	.p-concept {
		padding: 15px;
	}
	.p-concept_inner {
		padding: 60px 40px;
	}
	.p-concept__ttl {
		margin: 0 auto 40px;
	}
	.p-rainbow-text {
		font-size: 3.0rem;
		margin: 0 auto 30px;
	}
	.p-concept_txt {
		font-size: 2.0rem;
	}
}
@media screen and (max-width: 768px) {
	.p-concept {
		border-radius: 40px;
		width: 90%;
		margin: 0 auto 100px;
		padding: 10px;
	}
	.p-concept_inner {
		background: #ffffff;
		border-radius: 30px;
		padding: 40px 20px;
	}
	.p-concept__ttl {
		width: 100%;
		max-width: 400px;
		margin: 0 auto 40px;
	}
	.p-rainbow-text {
		margin: 0 auto 30px;
		font-size: 2.6rem;
	}
	.p-concept_txt {
		font-size: 1.8rem;
	}
}
@media screen and (max-width: 640px) {
	.p-concept {
		margin: 0 auto 70px;
	}
	.p-rainbow-text {
		font-size: 2.0rem;
	}
	.p-concept_txt {
		font-size: 1.4rem;
	}
}


.p-lead__ttl {
	margin: 0 auto 30px;
	padding: 0 8%;
	text-align: center;
	font-size: 6.0rem;
	font-weight: 800;
	letter-spacing: 0;
	text-shadow: rgb(255, 255, 255) 5px 0px 0px, rgb(255, 255, 255) 4.90033px 0.993347px 0px, rgb(255, 255, 255) 4.60531px 1.94709px 0px, rgb(255, 255, 255) 4.12668px 2.82321px 0px, rgb(255, 255, 255) 3.48353px 3.58678px 0px, rgb(255, 255, 255) 2.70151px 4.20736px 0px, rgb(255, 255, 255) 1.81179px 4.6602px 0px, rgb(255, 255, 255) 0.849836px 4.92725px 0px, rgb(255, 255, 255) -0.145998px 4.99787px 0px, rgb(255, 255, 255) -1.13601px 4.86924px 0px, rgb(255, 255, 255) -2.08073px 4.54649px 0px, rgb(255, 255, 255) -2.94251px 4.04248px 0px, rgb(255, 255, 255) -3.68697px 3.37732px 0px, rgb(255, 255, 255) -4.28444px 2.57751px 0px, rgb(255, 255, 255) -4.71111px 1.67494px 0px, rgb(255, 255, 255) -4.94996px 0.7056px 0px, rgb(255, 255, 255) -4.99147px -0.291871px 0px, rgb(255, 255, 255) -4.83399px -1.27771px 0px, rgb(255, 255, 255) -4.48379px -2.2126px 0px, rgb(255, 255, 255) -3.95484px -3.05929px 0px, rgb(255, 255, 255) -3.26822px -3.78401px 0px, rgb(255, 255, 255) -2.4513px -4.35788px 0px, rgb(255, 255, 255) -1.53666px -4.75801px 0px, rgb(255, 255, 255) -0.560763px -4.96845px 0px, rgb(255, 255, 255) 0.437495px -4.98082px 0px, rgb(255, 255, 255) 1.41831px -4.79462px 0px, rgb(255, 255, 255) 2.34258px -4.41727px 0px, rgb(255, 255, 255) 3.17346px -3.86382px 0px, rgb(255, 255, 255) 3.87783px -3.15633px 0px, rgb(255, 255, 255) 4.4276px -2.32301px 0px, rgb(255, 255, 255) 4.80085px -1.39708px 0px, rgb(255, 255, 255) 4.98271px -0.415447px 0px;
}
@media screen and (max-width: 1300px) {
	.p-lead__ttl {
		font-size: 4.0rem;
	}
}
@media screen and (max-width: 768px) {
	.p-lead__ttl {
		font-size: 3.0rem;
	}
}
@media screen and (max-width: 500px) {
	.p-lead__ttl {
		font-size: 2.2rem;
	}
}

.p-lead__txt {
	margin: 0 auto 130px;
	padding: 0 10%;
	text-align: center;
	font-size: 3.0rem;
	font-weight: 500;
	letter-spacing: 0;
	text-shadow: rgb(255, 255, 255) 5px 0px 0px, rgb(255, 255, 255) 4.90033px 0.993347px 0px, rgb(255, 255, 255) 4.60531px 1.94709px 0px, rgb(255, 255, 255) 4.12668px 2.82321px 0px, rgb(255, 255, 255) 3.48353px 3.58678px 0px, rgb(255, 255, 255) 2.70151px 4.20736px 0px, rgb(255, 255, 255) 1.81179px 4.6602px 0px, rgb(255, 255, 255) 0.849836px 4.92725px 0px, rgb(255, 255, 255) -0.145998px 4.99787px 0px, rgb(255, 255, 255) -1.13601px 4.86924px 0px, rgb(255, 255, 255) -2.08073px 4.54649px 0px, rgb(255, 255, 255) -2.94251px 4.04248px 0px, rgb(255, 255, 255) -3.68697px 3.37732px 0px, rgb(255, 255, 255) -4.28444px 2.57751px 0px, rgb(255, 255, 255) -4.71111px 1.67494px 0px, rgb(255, 255, 255) -4.94996px 0.7056px 0px, rgb(255, 255, 255) -4.99147px -0.291871px 0px, rgb(255, 255, 255) -4.83399px -1.27771px 0px, rgb(255, 255, 255) -4.48379px -2.2126px 0px, rgb(255, 255, 255) -3.95484px -3.05929px 0px, rgb(255, 255, 255) -3.26822px -3.78401px 0px, rgb(255, 255, 255) -2.4513px -4.35788px 0px, rgb(255, 255, 255) -1.53666px -4.75801px 0px, rgb(255, 255, 255) -0.560763px -4.96845px 0px, rgb(255, 255, 255) 0.437495px -4.98082px 0px, rgb(255, 255, 255) 1.41831px -4.79462px 0px, rgb(255, 255, 255) 2.34258px -4.41727px 0px, rgb(255, 255, 255) 3.17346px -3.86382px 0px, rgb(255, 255, 255) 3.87783px -3.15633px 0px, rgb(255, 255, 255) 4.4276px -2.32301px 0px, rgb(255, 255, 255) 4.80085px -1.39708px 0px, rgb(255, 255, 255) 4.98271px -0.415447px 0px;
	transform:rotateZ(0.03deg);
}
@media screen and (max-width: 1300px) {
	.p-lead__txt {
		font-size: 2.4rem;
	}
}
@media screen and (max-width: 768px) {
	.p-lead__txt {
		padding: 0 3%;
		font-size: 2.0rem;
	}
}
@media screen and (max-width: 500px) {
	.p-lead__txt {
		font-size: 1.6rem;
	}
}


.skills-container {
	width: 88%;
    max-width: 1700px;
    margin: 0 auto 100px;
    padding: 20px 20px 50px;
    background-color: #fff;
    border-radius: 100px;
	transform:rotateZ(0.03deg);
}
.skills-header {
    text-align: center;
    margin: -50px auto 50px;
	position: relative;
}
.skills-title {
    display: inline-block;
    background-color: #ee7c76;
    color: #fff;
    font-size: 3.0rem;
	font-weight: 700;
    padding: 10px 30px;
}
.skills-list {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
    text-align: center;
}
.skill-item {
	width: calc( 100% / 5 );
    /*flex: 1;*/
    padding: 20px 10px;
    border-right: 1px solid #f7c9c7;
}
.skills-list li:last-child {
    border-right: none;
}
.skill-name {
    font-size: 4.0rem;
    color: #ee7c76;
    font-weight: bold;
    margin-bottom: 40px;
    line-height: 1.2;
}
.skill-description {
    line-height: 1.5;
    margin: 0;
	transform:rotateZ(0.03deg);
}
@media (max-width: 1500px) {
	.skill-name {
		font-size: 2.8rem;
		margin-bottom: 25px;
	}
	.skill-description {
		font-size: 1.8rem;
	}
}
@media (max-width: 1200px) {
	.skills-list {
		flex-wrap: wrap;
		justify-content: center;
	}
	.skill-item {
		width: 33.3333%;
		margin-bottom: 30px;
	}
	.skills-list li:nth-child(3) {
		border-right: none;
	}
	.skill-name {
		font-size: 2.4rem;
		margin-bottom: 25px;
	}
	.skill-description {
		font-size: 1.6rem;
	}
}
@media (max-width: 640px) {
	.skills-container {
		padding: 20px 30px;
		border-radius: 50px;
	}
	.skills-header {
		margin: -50px auto 20px;
	}
	.skills-title {
		font-size: 2.0rem;
	}
   .skills-list {
        flex-direction: column;
    }
    .skill-item {
		width: 100%;
		margin-bottom: 0;
		padding-bottom: 20px;
        border-right: none;
        border-bottom: 1px solid #f7c9c7;
    }
    .skills-list li:last-child {
        border-bottom: none;
    }
}

.p-plan {
	width: 88%;
    max-width: 1700px;
    margin: 0 auto 100px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.p-plan_col {
	width: 48%;
	margin-bottom: 70px;
	padding: 20px 4% 50px;
    background: #ffffff;
    border-radius: 100px;
	transform:rotateZ(0.03deg);
}
@media (max-width: 1300px) {
	.p-plan {
		flex-direction: column;
	}
	.p-plan_col {
		width: 100%;
		max-width: 1000px;
		margin: 0 auto 50px;
	}
}
@media (max-width: 640px) {
	.p-plan_col {
		border-radius: 50px;
	}
}

.p-plan-header {
    text-align: center;
    margin: -50px auto 50px;
	position: relative;
}
.p-area__ttl {
    display: inline-block;
    color: #fff;
    font-size: 3.0rem;
	font-weight: 700;
    padding: 10px 30px;
}
@media (max-width: 640px) {
	.p-area__ttl {
		font-size: 2.0rem;
	}
}
.area01 {
    background-color: #e0d42b;
}
.area02 {
    background-color: #39b69f;
}
.area03 {
    background-color: #86b7e3;
}
.area04 {
    background-color: #ee7419;
}


.p-plan__logo {
	width: 60%;
	margin: 0 auto 40px;
	text-align: center;
}
.p-plan__logo img {
	display: inline-block;
}

.p-plan__subttl {
	margin: 0 auto 20px;
	text-align: center;
}
.p-plan__subttl span {
	font-size: 3.0rem;
	font-weight: 700;
}
.area01_subtl {
	background:linear-gradient(transparent 60%, #fff33f 60%);
}
.area02_subtl {
	background:linear-gradient(transparent 60%, #7ac8bc 60%);
}
.area03_subtl {
	background:linear-gradient(transparent 60%, #b4dfed 60%);
}
.area04_subtl {
	background:linear-gradient(transparent 60%, #f6b072 60%);
}
@media (max-width: 640px) {
	.p-plan__subttl span {
		font-size: 2.4rem;
	}
}

.p-plan__txt {
	margin-bottom: 40px;
}
.p-plan__txt span {
	font-size: 1.8rem;
}
@media (max-width: 769px) {
	.p-plan__txt span {
		font-size: 1.3rem;
	}
}

.teacher_col {
	display: flex;
	justify-content: center;
	margin: 0 auto 40px;
}
.teacher_img {
	width: 120px;
	height: 120px;
	margin: 0 10px;
}
.teacher_img img {
	border-radius: 30px;
}

.schedule_txt {
	margin-bottom: 10px;
	font-size: 2.6rem;
	font-weight: 900;
}

.area01_st {
	color: #e0d42b;
}
.area02_st {
	color: #39b69f;
}
.area03_st {
	color: #86b7e3;
}
.area04_st {
	color: #ee7419;
}


.step-guide {
    width: 100%;
	margin-bottom: 60px;
}
.area01_plan { border-left: 2px solid #e0d42b; }
.area02_plan { border-left: 2px solid #39b69f; }
.area03_plan { border-left: 2px solid #86b7e3; }
.area04_plan { border-left: 2px solid #ee7419; }

.step-item {
    display: flex;
	align-items: flex-start;
    position: relative;
    margin-bottom: 25px;
}
@media (max-width: 640px) {
	.step-item {
		flex-direction: column;
	}
}
.step-number-wrapper {
	display: flex;
	justify-content: space-around;
	align-items: center;
    flex-shrink: 0;
    width: 100px; 
    margin-right: 20px;
    padding: 0 10px;
    border-radius: 0 50px 50px 0;
    text-align: center;
    line-height: 1;
}
.step-label {
	font-family: var(--font-en);
    font-size: 1.6rem;
    font-weight: bold;
    color: #ffffff;
}
.step-number {
	font-family: var(--font-en);
    font-size: 3.0rem;
    font-weight: bold;
    color: #ffffff;
}
@media (max-width: 640px) {
	.step-number-wrapper {
		width: 80px;
	}
	.step-label {
		font-size: 1.3rem;
	}
	.step-number {
		font-size: 2.0rem;
	}
}
.step-content {
    flex-grow: 1;
    padding-top: 5px;
	transform:rotateZ(0.03deg);
}
.step-date {
    font-size: 2.6rem;
    font-weight: 700;
}
.step-date span {
    font-size: 2.2rem;
    font-weight: 700;
}
.step-time {
    font-size: 1.6rem;
}
.step-description {
    font-size: 2.6rem;
	line-height: 1.4;
}
@media (max-width: 640px) {
	.step-content {
		margin-left: 20px;
	}
	.step-date {
		font-size: 1.8rem;
	}
	.step-date span {
		display: block;
		font-size: 1.6rem;
	}
	.step-time {
		font-size: 1.3rem;
	}
	.step-description {
		font-size: 1.6rem;
	}
}

.c-y { background-color: #e0d42b; }
.c-g { background-color: #39b69f; }
.c-b { background-color: #86b7e3; }
.c-o { background-color: #ee7419; }



.plan_gallery {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-content: stretch;
}
.gallery_col {
	width: 45%;
	margin-bottom: 30px;
}
.gallery_img {
	margin-bottom: 5px;
}
.gallery_img img {
	border-radius: 40px;
}
@media (max-width: 640px) {
	.gallery_col {
		width: 100%;
	}
	.gallery_img img {
		border-radius: 20px;
	}
}


.entry-container {
	width: 88%;
    max-width: 1700px;
    margin: 0 auto 100px;
    padding: 20px 20px 50px;
    background-color: #fff;
    border-radius: 100px;
	transform:rotateZ(0.03deg);
}
.entry-header {
    text-align: center;
    margin: -50px auto 50px;
	position: relative;
}
.entry-title {
    display: inline-block;
    background-color: #ee7419;
    color: #fff;
    font-size: 3.0rem;
	font-weight: 700;
    padding: 10px 30px;
}
@media (max-width: 640px) {
	.entry-container {
		padding: 20px 30px;
		border-radius: 50px;
	}
	.entry-header {
		margin: -50px auto 20px;
	}
	.entry-title {
		font-size: 2.0rem;
	}
}
.entry-lead {
	margin: 0 auto 20px;
	font-size: 3.0rem;
	font-weight: 900;
	color: #ee7419;
	text-align: center;
}
.entry-description {
	margin: 0 auto 40px;
	color: #ee7419;
	text-align: center;
}
.entry-details {
    width: 80%;
    border-collapse: collapse;
    margin: 20px auto 50px;
    border-top: 1px solid #f7c9c7;
}
.entry-details tr {
    border-bottom: 1px solid #f7c9c7;
}
.entry-label {
    width: 15%;
    padding: 30px 0;
    color: #ee7419;
    font-size: 2.4rem;
    font-weight: bold;
    text-align: left;
    vertical-align: top;
}
.entry__text {
    width: 85%;
    padding: 30px 20px;
    line-height: 1.6;
    font-size: 2.4rem;
    vertical-align: top;
}
.entry__text span {
	font-size: 2.0rem;
}
.entry__text a {
    color: #ee7419;
    text-decoration: underline;
    font-weight: bold;
}
.entry__text a:hover {
    text-decoration: none;
    opacity: 0.8;
}
@media (max-width: 960px) {
	.entry-lead {
		font-size: 2.4rem;
	}
	.entry-label,
	.entry__text {
		display: block;
		width: 100%;
		font-size: 2.0rem;
	}
	.entry-label {
		padding: 30px 0 10px;
	}
	.entry__text {
		padding: 0 0 30px;
	}
}
@media (max-width: 640px) {
	.entry-lead {
		font-size: 2.4rem;
	}
	.entry-details {
		width: 100%;
	}
	.entry-label,
	.entry__text {
		width: 100%;
		font-size: 1.6rem;
	}
	.entry-label {
		padding: 20px 0 10px;
	}
	.entry__text {
		padding: 0 0 20px;
	}
}
.p-entry__txt {
	margin: 0 auto 30px;
	text-align: center;
}
.p-entry__txt span {
	position: relative;
	display: inline-block;
	padding: 10px 70px;
	text-align: center;
	font-size: 3.0rem;
	font-weight: 700;
	letter-spacing: 0;
	text-shadow: rgb(255, 255, 255) 5px 0px 0px, rgb(255, 255, 255) 4.90033px 0.993347px 0px, rgb(255, 255, 255) 4.60531px 1.94709px 0px, rgb(255, 255, 255) 4.12668px 2.82321px 0px, rgb(255, 255, 255) 3.48353px 3.58678px 0px, rgb(255, 255, 255) 2.70151px 4.20736px 0px, rgb(255, 255, 255) 1.81179px 4.6602px 0px, rgb(255, 255, 255) 0.849836px 4.92725px 0px, rgb(255, 255, 255) -0.145998px 4.99787px 0px, rgb(255, 255, 255) -1.13601px 4.86924px 0px, rgb(255, 255, 255) -2.08073px 4.54649px 0px, rgb(255, 255, 255) -2.94251px 4.04248px 0px, rgb(255, 255, 255) -3.68697px 3.37732px 0px, rgb(255, 255, 255) -4.28444px 2.57751px 0px, rgb(255, 255, 255) -4.71111px 1.67494px 0px, rgb(255, 255, 255) -4.94996px 0.7056px 0px, rgb(255, 255, 255) -4.99147px -0.291871px 0px, rgb(255, 255, 255) -4.83399px -1.27771px 0px, rgb(255, 255, 255) -4.48379px -2.2126px 0px, rgb(255, 255, 255) -3.95484px -3.05929px 0px, rgb(255, 255, 255) -3.26822px -3.78401px 0px, rgb(255, 255, 255) -2.4513px -4.35788px 0px, rgb(255, 255, 255) -1.53666px -4.75801px 0px, rgb(255, 255, 255) -0.560763px -4.96845px 0px, rgb(255, 255, 255) 0.437495px -4.98082px 0px, rgb(255, 255, 255) 1.41831px -4.79462px 0px, rgb(255, 255, 255) 2.34258px -4.41727px 0px, rgb(255, 255, 255) 3.17346px -3.86382px 0px, rgb(255, 255, 255) 3.87783px -3.15633px 0px, rgb(255, 255, 255) 4.4276px -2.32301px 0px, rgb(255, 255, 255) 4.80085px -1.39708px 0px, rgb(255, 255, 255) 4.98271px -0.415447px 0px;
	transform:rotateZ(0.03deg);
}
.p-entry__txt span::before,
.p-entry__txt span::after {
	content: '';
	position: absolute;
	width: 60px;
	height: 81px;
}
.p-entry__txt span::before {
	top: 0;
	left: 0;
	background: url("../images/fukidashi_l.png") no-repeat 0 0/contain;
}
.p-entry__txt span::after {
	top: 0;
	right: 0;
	background: url("../images/fukidashi_r.png") no-repeat 0 0/contain;
}

.p-entery_button {
    display: block;
    width: 90%;
    max-width: 800px;
    margin: 0 auto 150px;
    padding: 30px;
    background-color: #ee7419;
    color: #fff;
    text-decoration: none;
    border-radius: 100px;
    border: 5px solid #fff;
    position: relative;
    transition: all 0.3s ease;
	transform:rotateZ(0.03deg);
}
.p-entery_button::after {
	content: "";
	position: absolute;
	top: calc( 50% - 7px );
	right: 30px;
	width: 15px;
	height: 25px;
	background: url(../images/arr_wht.png) no-repeat 0 0;
	background-size: contain;
}
.p-entery_button:hover {
    transform: translateY(-10px);
}
.button-subtitle {
    display: block;
    font-size: 2.6rem;
	text-align: center;
	line-height: 1.4;
}
.button-main-text {
    display: block;
    font-size: 4.0rem;
    font-weight: 900;
	text-align: center;
	line-height: 1.4;
}
@media (max-width: 640px) {
	.p-entry__txt span {
		font-size: 2.0rem;
	}
	.p-entry__txt span::before,
	.p-entry__txt span::after {
		content: '';
		position: absolute;
		width: 46px;
		height: 60px;
	}
	.p-entery_button {
		padding: 20px;
	}
	.p-entery_button::after {
		top: calc( 50% - 7px );
		right: 20px;
		width: 10px;
		height: 20px;
	}
	.button-subtitle {
		font-size: 1.5rem;
	}
	.button-main-text {
		font-size: 3.0rem;
	}
}




.p-news {
	width: 88%;
    max-width: 1700px;
    margin: 0 auto 200px;
	display: flex;
	transform:rotateZ(0.03deg);
}
.p-news__ttl {
    flex-shrink: 0;
    width: 30%; 
}
.news-title {
	position: relative;
	margin-bottom: 100px;
	font-size: 5.0rem;
    font-weight: 900;
    color: #ffffff;
	text-shadow: rgb(160, 80, 154) 5px 0px 0px, rgb(160, 80, 154) 4.90033px 0.993347px 0px, rgb(160, 80, 154) 4.60531px 1.94709px 0px, rgb(160, 80, 154) 4.12668px 2.82321px 0px, rgb(160, 80, 154) 3.48353px 3.58678px 0px, rgb(160, 80, 154) 2.70151px 4.20736px 0px, rgb(160, 80, 154) 1.81179px 4.6602px 0px, rgb(160, 80, 154) 0.849836px 4.92725px 0px, rgb(160, 80, 154) -0.145998px 4.99787px 0px, rgb(160, 80, 154) -1.13601px 4.86924px 0px, rgb(160, 80, 154) -2.08073px 4.54649px 0px, rgb(160, 80, 154) -2.94251px 4.04248px 0px, rgb(160, 80, 154) -3.68697px 3.37732px 0px, rgb(160, 80, 154) -4.28444px 2.57751px 0px, rgb(160, 80, 154) -4.71111px 1.67494px 0px, rgb(160, 80, 154) -4.94996px 0.7056px 0px, rgb(160, 80, 154) -4.99147px -0.291871px 0px, rgb(160, 80, 154) -4.83399px -1.27771px 0px, rgb(160, 80, 154) -4.48379px -2.2126px 0px, rgb(160, 80, 154) -3.95484px -3.05929px 0px, rgb(160, 80, 154) -3.26822px -3.78401px 0px, rgb(160, 80, 154) -2.4513px -4.35788px 0px, rgb(160, 80, 154) -1.53666px -4.75801px 0px, rgb(160, 80, 154) -0.560763px -4.96845px 0px, rgb(160, 80, 154) 0.437495px -4.98082px 0px, rgb(160, 80, 154) 1.41831px -4.79462px 0px, rgb(160, 80, 154) 2.34258px -4.41727px 0px, rgb(160, 80, 154) 3.17346px -3.86382px 0px, rgb(160, 80, 154) 3.87783px -3.15633px 0px, rgb(160, 80, 154) 4.4276px -2.32301px 0px, rgb(160, 80, 154) 4.80085px -1.39708px 0px, rgb(160, 80, 154) 4.98271px -0.415447px 0px;
}
.news-title::after {
	display: block;
	content: "INFORMATION";
	font-family: --font-en;
	font-size: 2.4rem;
	color: #ffffff;
	text-shadow: none;
}
.news-title.news_tl {
	font-size: 7.0rem;
}
.p-news__btn {
	display: block;
	width: 80%;
	max-width: 280px;
	padding: 20px 30px;
	border-radius: 50px;
	border: 3px solid #ffffff;
	background: #a0509a;
	font-size: 2.4rem;
	font-weight: 900;
	color: #ffffff;
	text-align: center;
	position: relative;
    transition: all 0.3s ease;
	transform:rotateZ(0.03deg);
}
.p-news__btn::after {
	display: block;
	content: "";
	position: absolute;
	width: 12px;
	height: 24px;
	background: url("../images/arr_wht.png") no-repeat 0 0/100%;
	top: calc( 50% - 10px );
	right: 20px;
}
.p-news__btn:hover {
    transform: translateY(-10px);
}
.p-news__col {
	flex-grow: 1;
}
.p-news__list {
	width: 100%;
	margin-bottom: 10px;
	transform:rotateZ(0.03deg);
}
.p-news__list a {
	display: block;
	width: 100%;
	padding: 20px 30px;
	background: #ffffff;
	border-radius: 30px;
	font-size: 2.4rem;
    transition: all 0.3s ease;
}
.p-news__list a:hover {
    transform: translateY(-5px);
}
.news_date {
	display: inline-block;
	padding-right: 50px;
	font-size: 1.6rem;
	font-weight: 700;
	color: #44a6c7;
}

@media (max-width: 960px) {
	.p-news {
		flex-direction: column;
	}
	.p-news__ttl {
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
	}
}
@media (max-width: 768px) {
	.news-title.news_tl {
		font-size: 5.0rem;
	}
	.p-news__list a {
		padding: 20px;
		font-size: 2.0rem;
	}
	.news_date {
		padding-right: 30px;
		font-size: 1.4rem;
	}
}
@media (max-width: 640px) {
	.p-news {
		margin: 0 auto 100px;
	}
	.news-title {
		font-size: 3.0rem;
		margin-bottom: 50px;
	}
	.news-title.news_tl {
		font-size: 4.0rem;
	}
	.news-title::after {
		font-size: 1.6rem;
		color: #ffffff;
		text-shadow: none;
	}
	.p-news__btn {
		width: 50%;
		padding: 15px 20px;
		font-size: 1.8rem;
	}
	.p-news__btn::after {
		width: 8px;
		height: 18px;
		top: calc( 50% - 7px );
		right: 15px;
	}
	.p-news__list a {
		font-size: 1.6rem;
	}
	.news_date {
		display: block;
		font-size: 1.2rem;
	}
}

.news_col {
	width: 100%;
	padding: 50px 70px;
	box-sizing: border-box;
	border-radius: 100px;
	background: #ffffff;
	transform:rotateZ(0.03deg);
}
.news_col h3 {
	margin-bottom: 70px;
	font-size: 3.4rem;
}
.news_detail {
	transform:rotateZ(0.03deg);
}
.news_detail p {
	margin-bottom: 30px;
}
@media (max-width: 960px) {
	.news_col {
		padding: 30px 50px;
		border-radius: 50px;
	}
	.news_col h3 {
		margin-bottom: 50px;
		font-size: 2.4rem;
	}
}
@media (max-width: 640px) {
	.news_col {
		padding: 30px;
	}
	.news_col h3 {
		margin-bottom: 30px;
		font-size: 2.0rem;
	}
}




.footer_col {
	margin: 0 auto 50px;
	transform:rotateZ(0.03deg);
}
.footer__txt {
	margin: 0 auto 30px;
	font-size: 1.8rem;
	text-align: center;
}
.insta_link {
	width: 90px;
	margin: 0 auto 30px;
}
.insta_link a {
    transition: all 0.3s ease;
}
.insta_link a:hover {
	opacity: 0.6;
}
.fukuoka_pref {
	width: 85%;
	max-width: 243px;
	margin: 0 auto 30px;
}
.fukuoka_pref img {
	max-width: 100%;
}
.takarakuji_col {
	width: 90%;
	max-width: 600px;
	margin: 0 auto 70px;
	padding: 20px 30px;
	border-radius: 50px;
	background: #ffffff;
	display: flex;
	justify-content: space-around;
	align-items: center;
	transform:rotateZ(0.03deg);
}
.takarakuji_img {
	width: 96px;
}
.takarakuji_col p {
	font-size: 1.6rem;
}
.copy {
	text-align: center;
	color: #ffffff;
}
@media (max-width: 640px) {
	.footer__txt {
		font-size: 1.4rem;
	}
	.takarakuji_col {
		padding: 15px;
	}
	.takarakuji_img {
		width: 80px;
	}
	.takarakuji_col p {
		font-size: 1.2rem;
	}
}



/*--Pager--*/
.p-pager {
	margin: 50px 0 ;
	text-align:center;
	display: flex;
	justify-content: center;
	align-items: center;
}
.p-pager span,
.p-pager a {
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0 7px;
	width: 40px;
	height: 40px;
	line-height: 1.0;
	border: 2px solid #ffffff;
	font-size: 1.4rem;
	-moz-border-radius: 40px;
	-webkit-border-radius: 40px;
	border-radius: 40px;
	transition: all .5s;
	-webkit-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
	letter-spacing: 0.05em;
}
.p-pager a {
	color: #ffffff;
	text-decoration:none;
	background: none;
}
.p-pager span,
.p-pager a:hover {
	background-color: #ffffff;
	color: #60b4a2;
	border: none;
	text-decoration:none;
}
.p-pager a.next ,
.p-pager a.prev {
	color: #ffffff;
	border: none;
	border-radius: 0;
	width: 60px;
	height: 40px;
	position: relative;
}
.p-pager a.next {
  justify-content: flex-start;
  margin: 0 0 0 30px;
}
.p-pager a.prev {
  justify-content: flex-end;
  margin: 0 30px 0 0;
}
.p-pager a:hover.next ,
.p-pager a:hover.prev {
  background: none;
}
.p-pager a.prev:after {
  position: absolute;
  content: "";
  width: 10px;
  height: 10px;
  bottom: 12px;
  left: -4px;
  border: 3px solid #ffffff;
  border-right: none;
  border-top: none;
  transform: rotate( 45deg ) translateY( -50% );
}
.p-pager a.next:after {
  position: absolute;
  content: "";
  width: 10px;
  height: 10px;
  bottom: 12px;
  right: 0;
  border: 3px solid #ffffff;
  border-left: none;
  border-bottom: none;
  transform: rotate( 45deg ) translateY( -50% );
}
@media screen and (max-width: 769px) {
  .p-pager span,
  .p-pager a {
    margin: 0 3px;
    width: 30px;
    height: 30px;
    font-size: 1.2rem;
  }
  .p-pager a.next ,
  .p-pager a.prev {
    width: 45px;
  }
  .p-pager a.next {
    margin: 0 0 0 10px;
  }
  .p-pager a.prev {
    margin: 0 10px 0 0;
  }
}

.p-detail-pager {
	padding-top: 50px;
	display: flex;
	justify-content: space-between;
	justify-content: center;
	align-items: center;
}
.p-detail-pager div {
	width: 33%;
}
.p-detail-pager a {
	color: #ffffff;
	font-size: 1.8rem;
	text-decoration: none;
	position: relative;
	display: inline-block;
}
.p-detail-pager a:hover {
	color: #60b4a2;
}
.p-detail-pager__list {
	text-align: center;
}
.p-detail-pager__prev {
	text-align: left;
}
.p-detail-pager__next {
	text-align: right;
}
.p-detail-pager__prev span {
  padding: 0 0 0 20px;
}
.p-detail-pager__next span {
  padding: 0 20px 0 0;
}
.p-detail-pager__prev span,
.p-detail-pager__next span {
  position: relative;
}
.p-detail-pager__prev span:after {
  position: absolute;
  content: "";
  width: 10px;
  height: 10px;
  top: calc( 50% - 3px );
  left: -4px;
  border: 3px solid #ffffff;
  border-right: none;
  border-top: none;
  transform: rotate( 45deg ) translateY( -50% );
}
.p-detail-pager__next span:after {
  position: absolute;
  content: "";
  width: 10px;
  height: 10px;
  top: calc( 50% - 3px );
  right: 0;
  border: 3px solid #ffffff;
  border-left: none;
  border-bottom: none;
  transform: rotate( 45deg ) translateY( -50% );
}









/* Utility
------------------------------------------------- */
/* ---------- Display ----------*/
.u-m-xxl,
.u-m-xl,
.u-m-lg,
.u-m-md,
.u-m-sm,
.u-m-xs { display: none;}
.u-p-xxl,
.u-p-xl,
.u-p-lg,
.u-p-md,
.u-p-sm,
.u-p-xs { display: block;}
@media screen and (max-width: 1440px) {
	.u-m-xxl { display: block;}
	.u-p-xxl { display: none;}
}
@media screen and (max-width: 1300px) {
	.u-m-xl { display: block;}
	.u-p-xl { display: none;}
}
@media screen and (max-width: 1024px) {
	.u-m-lg { display: block;}
	.u-p-lg { display: none;}
}
@media screen and (max-width: 960px) {
	.u-m-md { display: block;}
	.u-p-md { display: none;}
}
@media screen and (max-width: 767px) {
	.u-m-sm { display: block;}
	.u-p-sm { display: none;}
}
@media screen and (max-width: 428px) {
	.u-m-xs { display: block;}
	.u-p-xs { display: none;}
}