@charset "utf-8";


.red .schedule-note {
	color: #D80003;
}

/*===============================================
●画面の横幅が769px以上
===============================================*/
@media screen and (min-width : 769px ){
#pc------------------------------------------- {
}
main {
	overflow: hidden;
}
#helo {
	background-image: url("../images/pc/index/h_bg.png");
	height: 49.78vw;               /* 680px */
	background-size: cover;
	background-position: center center;
}

#helo h2 {
	text-align: right;
	margin-right: 3.66vw;         /* 50px */
	padding-top: 2vw;          /* 100px */
}

#helo h2 img {
	width: 56.56vw;               /* 773px */
}









#reason {
	margin-top: 4.392vw;          /* 60px */
}

#reason .flex {
	width: 78.04vw;               /* 1066px */
	margin-left: auto;
	margin-right: auto;
	display: flex;
	justify-content: space-between;
	margin-top: 10.98vw;          /* 150px */
}

#reason .flex div {
	width: 21.96vw;               /* 300px */
	background-color: #003850;
	position: relative;
}

#reason .flex div figure {
	width: 13.54vw;               /* 185px */
	margin-left: auto;
	margin-right: auto;
	position: relative;
	top: -6.22vw;                 /* 85px */
	margin-bottom: -4.392vw;      /* -60px */
}

#reason .flex div h3 {
	color: #fff;
	font-size: 1.318vw;           /* 18px */
	font-weight: bold;
	margin-bottom: 2.197vw;       /* 30px */
}

#reason .flex div:nth-of-type(2) h3,
#reason .flex div:nth-of-type(3) h3 {
	padding-top: 0.732vw;         /* 10px */
	margin-bottom: 3.073vw;       /* 42px */
}

#reason .flex div h3+p {
	color: #fff;
	font-size: 1.024vw;           /* 14px */
	margin-left: 3.66vw;          /* 50px */
	margin-right: 3.66vw;         /* 50px */
	padding-bottom: 2vw;
}






#different {
	padding-top: 8.78vw;               /* 120px */
}

#different .inner {
	position: relative;
}

#different h2 {
	margin-bottom: 2.197vw;            /* 30px */
}

#different .flex {
	display: flex;
	justify-content: space-between;
	align-items: center;
	background-color: #E5EBEE;
	overflow: hidden;
}

#different .flex figure {
	width: 50vw;                       /* 683px */
}

#different .flex div {
	width: 50vw;                       /* 683px */
}

#different .flex div h3 {
	font-size: 3vw;                    /* 41px */
	font-weight: bold;
	color: #003850;
}

#different .flex div p {
	font-size: 1.757vw;                /* 24px */
	line-height: 1.8em;
	margin-top: 4.392vw;               /* 60px */
}

#different .flex div p span {
	font-weight: bold;
}

#different .flex + .flex {
	flex-direction: row-reverse;
	background-color: #FCF1D7;
}

#different .inner .logo {
	width: 14.27vw;                    /* 195px */
	height: 16.26vw;                   /* 222px */
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
}






#plan {
	padding-top: 5.857vw;              /* 80px */
}

#plan .flex {
	width: 80.52vw;                    /* 1100px */
	margin-left: auto;
	margin-right: auto;
	display: flex;
	justify-content: space-between;
	margin-top: 2.197vw;               /* 30px */
	margin-bottom: 1.464vw;            /* 20px */
}

#plan .flex div {
	width: 50%;
	background-color: #F8DC9B;
	color: #003850;
	height: 14.64vw;                   /* 200px */
}

#plan .flex div:first-child p {
	font-size: 5.56vw;                 /* 76px */
	font-weight: bold;
	font-feature-settings: "palt";
	line-height: 13.17vw;              /* 180px */
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	padding-top: 3.4vw;
}

#plan .flex div:first-child p span {
	font-size: 2.635vw;                /* 36px */
}

#plan .flex div:first-child p em {
	font-size: 1.903vw;                /* 26px */
	font-weight: bold;
}

#plan .flex div:last-child {
	background-color: #003850;
	color: #f0c032;
}

#plan .flex div:last-child h3 {
	font-size: 2.635vw;                /* 36px */
	font-weight: bold;
	padding-top: 3.66vw;               /* 50px */
	margin-bottom: 1.83vw;             /* 25px */
}

#plan .flex div:last-child p {
	font-size: 1.537vw;                /* 21px */
	font-weight: bold;
	line-height: 1.6em;
}

/* ボタン */
#plan .btn a {
	background-color: #003850;
	width: 80.52vw;                    /* 1100px */
	height: 7.32vw;                    /* 100px */
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-top: 1.464vw;               /* 20px */
}

#plan .btn img {
	width: 31.71vw;                    /* 433px */
	position: relative;
	top: 2.34vw;                       /* 32px */
}

#plan .btn a:hover {
	opacity: 0.7;
	transition: 0.3s;
}






#instructor {
	padding-top: 7.32vw;               /* 100px */
}

#instructor .flex {
	display: flex;
	justify-content: space-between;
	background-color: #E5EBEE;
	align-items: center;
	margin-top: 2.563vw;               /* 35px */
	overflow: hidden;
}

#instructor .flex div {
	width: 50vw;                       /* 683px */
	padding-top: 3.66vw;               /* 50px */
}

#instructor .flex div p {
	font-size: 1.757vw;                /* 24px */
	line-height: 2em;
	font-weight: bold;
}

#instructor .flex div p + p {
	font-size: 1.318vw;                /* 18px */
	margin-top: 1.464vw;               /* 20px */
	margin-bottom: 3.66vw;             /* 50px */
}

#instructor .flex div p + p span {
	font-size: 1.757vw;                /* 24px */
}

#instructor .flex div .btn a {
	background-color: #003850;
	display: block;
	width: 25.63vw;                    /* 350px */
	height: 3.66vw;                    /* 50px */
	margin-left: auto;
	margin-right: auto;
	transition: 0.3s;
}
#instructor .flex div .btn a:hover {
	opacity: 0.7;
	transition: 0.3s;
}
#instructor .flex div .btn img {
	width: 9.29vw;                     /* 127px */
	position: relative;
	top: 1.318vw;                      /* 18px */
}

#instructor .flex figure {
	width: 50vw;                       /* 683px */
}






#flow {
	padding-top: 8.78vw;              /* 120px */
	width: 80.52vw;                  /* 1100px */
	margin-left: auto;
	margin-right: auto;
}

#flow figure {
	background-color: #003850;
	width: 80.52vw;                  /* 1100px */
	height: 18.30vw;                 /* 250px */
	margin-left: auto;
	margin-right: auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 2.197vw;             /* 30px */
}

#flow figure img {
	width: 66.84vw;                  /* 913px */
	margin-left: auto;
	margin-right: auto;
}

/* ボタン */
#flow .btn a {
	background-color: #003850;
	width: 80.52vw;                  /* 1100px */
	height: 7.32vw;                  /* 100px */
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-top: 2.563vw;             /* 35px */
}

#flow .btn img {
	width: 31.71vw;                  /* 433px */
	position: relative;
	top: 2.34vw;                     /* 32px */
}

#flow .btn a:hover {
	opacity: 0.7;
	transition: 0.3s;
}






#reserve {
	margin-top: 8.05vw;              /* 110px */
	width: 80.52vw;                  /* 1100px */
	margin-left: auto;
	margin-right: auto;
}

#reserve h2 + p {
	font-size: 1.537vw;              /* 21px */
	line-height: 1.6em;
	margin-top: 2.197vw;             /* 30px */
	margin-bottom: 0.366vw;          /* 5px */
}
#reserve h2+p a {
	color: #003752;
	text-decoration: none;
}
#reserve h2 + p +p {
	margin-bottom: 35px;
}
#reserve h2 + p +p a {
	color: #003752;
}

#reserve .btn {
	text-align: left;
	margin-top: 1.464vw;             /* 20px */
}

#reserve .btn a {
	color: #000;
}






#faq {
	margin-top: 6.586vw;             /* 90px */
}

#faq .box {
	width: 68.83vw;                  /* 940px */
	margin-left: auto;
	margin-right: auto;
	background-color: #E5EBEE;
	padding-top: 3.66vw;             /* 50px */
	padding-bottom: 3.66vw;          /* 50px */
	padding-left: 5.857vw;           /* 80px */
	padding-right: 5.857vw;          /* 80px */
	text-align: left;
	margin-top: 2.197vw;             /* 30px */
	border: 0.146vw solid #003752;   /* 2px */
}

#faq dl dt {
	font-size: 1.757vw;              /* 24px */
	font-weight: bold;
	background-color: #003850;
	color: #fff;
	padding-top: 1.464vw;            /* 20px */
	padding-bottom: 1.464vw;         /* 20px */
	padding-left: 1.318vw;           /* 18px */
	margin-bottom: 1.464vw;          /* 20px */
	width: 65.86vw;                  /* 900px */
	margin-left: auto;
	margin-right: auto;
	cursor: pointer;
	position: relative;
}

#faq dl dt span {
	position: absolute;
	right: 20px;
}

#faq dl dd {
	font-size: 1.537vw;              /* 21px */
	padding-left: 1.318vw;           /* 18px */
	padding-right: 1.318vw;          /* 18px */
	padding-bottom: 1.83vw;          /* 25px */
	line-height: 1.5em;
	width: 65.86vw;                  /* 900px */
	margin-left: auto;
	margin-right: auto;
}
#faq .box p {
	width: 67vw;
	margin-left: auto;
	margin-right: auto;
}
#faq .box p a {
	color: #ff0000;
}
}



/*===============================================
●画面の横幅が768pxまで
===============================================*/
@media screen and (max-width:768px){
	
/*===============================================
●sp-tablet
===============================================*/
#sptablet------------------------------------------- {
}
/* =========================================
   # HELO
========================================= */
#helo {
	background-image: url("../images/sp/index/h_bg.png");
	height: 162.285vw;        /* 568px */
	background-size: cover;
	background-position: center top;
	position: relative;
}

#helo h2 {
	text-align: right;
	padding-top: 5.714vw;     /* 20px */
}

#helo h2 img {
	width: 100.285vw;         /* 351px */
}

#helo ul {
	display: flex;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	width: 96%;
	margin: 0 auto;
}

#helo ul li {
	width: 50%;
	height: 28.571vw;         /* 100px */
}

#helo ul li a {
	display: block;
	height: 28.571vw;
	line-height: 28.571vw;
	color: #003850;
	background-color: #F1BB3E;
	font-size: 4.571vw;        /* 16px */
	text-decoration: none;
}

#helo ul li+li a {
	background-color: #003850;
	color: #fff;
}

/* =========================================
   # REASON
========================================= */
#reason {
	margin-top: 8.571vw;       /* 30px */
	width: 90%;
	margin-left: auto;
	margin-right: auto;
}

#reason .flex {
	margin-top: 34.285vw;      /* 120px */
}

#reason .flex div {
	width: 85.714vw;           /* 300px */
	padding-bottom: 8.571vw;   /* 30px */
	background-color: #003850;
	position: relative;
	margin-bottom: 31.428vw;   /* 110px */
}

#reason .flex div figure {
	width: 52.857vw;           /* 185px */
	margin-left: auto;
	margin-right: auto;
	position: relative;
	top: -24.285vw;            /* -85px */
	margin-bottom: -17.142vw;  /* -60px */
}

#reason .flex div h3 {
	color: #fff;
	font-size: 5.142vw;        /* 18px */
	font-weight: bold;
	margin-bottom: 2.857vw;    /* 10px */
}

#reason .flex div h3+p {
	color: #fff;
	font-size: 4vw;            /* 14px */
	width: 57.142vw;           /* 200px */
	margin: 0 auto;
}

/* =========================================
   # DIFFERENT
========================================= */
#different {
	margin-top: -11.428vw;     /* -40px */
}

#different h2 {
	width: 96%;
	margin: 0 auto 5.714vw;    /* 20px */
}

#different .inner {
	position: relative;
}

#different .flex {
	background-color: #E5EBEE;
	width: 90%;
	margin: 0 auto;
	overflow: hidden;
}

#different .flex div h3 {
	font-size: 5.714vw;        /* 20px */
	padding-top: 14.285vw;     /* 50px */
	font-weight: bold;
	color: #003850;
}

#different .flex div p {
	font-size: 3.428vw;        /* 12px */
	line-height: 1.8em;
	margin-top: 5.714vw;       /* 20px */
	padding-bottom: 14.285vw;  /* 50px */
}

#different .flex + .flex {
	background-color: #FCF1D7;
	display: flex;
	flex-direction: column-reverse;
}

#different .inner .logo {
	display: none;
}

/* =========================================
   # PLAN
========================================= */
#plan {
	padding-top: 11.428vw;     /* 40px */
	width: 90%;
	margin: 0 auto;
}

#plan .flex {
	margin: 5.714vw auto 0;    /* 20px */
}

#plan .flex div {
	background-color: #F8DC9B;
	color: #003850;
	padding-top: 5.714vw;
	padding-bottom: 2.857vw;
}
#plan .flex div:first-child {
	padding-bottom: 0px;
	height: 23vw;
	padding-top: 2vw;
}
#plan .flex div:first-child p {
	font-size: 11vw;       /* 48px */
	font-weight: bold;
	font-feature-settings: "palt";
	line-height: 25vw;     /* 180px */
	width: 90%;
	padding-top: 2vw;
	margin-left: auto;
	margin-right: auto;
}

#plan .flex div:last-child {
	background-color: #003850;
	color: #f0c032;
}

#plan .flex div:last-child h3 {
	font-size: 6.285vw;        /* 22px */
	font-weight: bold;
	padding-top: 2.857vw;      /* 10px */
}

#plan .flex div:last-child p {
	font-size: 4.285vw;        /* 15px */
	font-weight: bold;
	line-height: 1.6em;
	margin-top: 3.428vw;       /* 12px */
	padding-bottom: 5.714vw;   /* 20px */
}

#plan .flex + p {
	font-size: 3.5vw;            /* 14px */
	margin-top: 2.857vw;
}

/* ボタン */
#plan .btn a {
	background-color: #003850;
	width: 100%;
	height: 14.285vw;          /* 50px */
	margin: 4.285vw auto 0;    /* 15px */
	display: block;
}

#plan .btn img {
	width: 61.714vw;           /* 216px */
	position: relative;
	top: 4.571vw;              /* 16px */
}

#plan .btn a:hover {
	opacity: 0.7;
	transition: 0.3s;
}

/* =========================================
   # INSTRUCTOR
========================================= */
#instructor {
	padding-top: 14.285vw;     /* 50px */
	width: 90%;
	margin: 0 auto;
}

#instructor .flex {
	background-color: #E5EBEE;
	align-items: center;
	margin-top: 5.714vw;       /* 20px */
	display: flex;
	flex-direction: column-reverse;
	overflow: hidden;
}

#instructor .flex div {
	padding-top: 14.285vw;     /* 50px */
}

#instructor .flex div p {
	font-size: 3.428vw;        /* 12px */
	line-height: 2em;
	font-weight: bold;
}

#instructor .flex div p+p {
	font-size: 2.5vw;        /* 10px */
	margin-top: 5.714vw;       /* 20px */
	margin-bottom: 14.285vw;   /* 50px */
}

#instructor .flex div p+p span {
	font-size: 3.714vw;        /* 13px */
}

#instructor .flex div .btn a {
	background-color: #003850;
	display: block;
	width: 100%;
	height: 14.285vw;          /* 50px */
	margin: 0 auto;
}

#instructor .flex div .btn img {
	width: 42.857vw;           /* 150px */
	position: relative;
	top: 4.571vw;              /* 16px */
}

/* =========================================
   # FLOW
========================================= */
#flow {
	padding-top: 11.428vw;     /* 40px */
	width: 90%;
	margin: 0 auto;
}

#flow figure {
	background-color: #003850;
	margin: 0 auto;
	height: 30vw;              /* 105px */
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 5.714vw;       /* 20px */
}

#flow figure img {
	width: 94%;
	margin: 0 auto;
}

#flow .btn a {
	background-color: #003850;
	width: 100%;
	height: 14.285vw;          /* 50px */
	margin: 2.857vw auto 0;
	display: block;
}

#flow .btn img {
	width: 60.571vw;           /* 212px */
	position: relative;
	top: 4.571vw;              /* 16px */
}

/* =========================================
   # RESERVE
========================================= */
#reserve {
	margin-top: 11.428vw;      /* 40px */
	width: 80.52vw;
	margin-left: auto;
	margin-right: auto;
}

#reserve h2+p {
	font-size: 4.571vw;        /* 16px */
	line-height: 1.6em;
	margin-top: 5.714vw;       /* 20px */
	text-align: left;
}
#reserve h2+p a {
	color: #003752;
	text-decoration: none;
}
#reserve h2+p+p {
	text-align: left;
}
#reserve h2 + p +p a {
	color: #003752;
}


#reserve .btn {
	margin-top: 5.714vw;
	text-align: left;
}
#reserve .btn a {
	color: #000;
}

/* =========================================
   # FAQ
========================================= */
#faq {
	margin-top: 22.857vw;      /* 80px */
	width: 90%;
	margin-left: auto;
	margin-right: auto;
}

#faq .box {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	background-color: #E5EBEE;
	padding-top: 3vw;     /* 50px */
	padding-bottom: 3vw;
	text-align: left;
	margin-top: 8.571vw;
	border: 0.571vw solid #003752;  /* 2px */
}

#faq dl dt {
	font-size: 4.5vw;        /* 18px */
	font-weight: bold;
	background-color: #003850;
	color: #fff;
	padding-top: 5.714vw;      /* 20px */
	padding-bottom: 4vw;
	margin-bottom: 4vw;
	padding-left: 3vw;
	padding-right: 3vw;
}

#faq dl dd {
	font-size: 4.571vw;        /* 16px */
	padding-bottom: 7.142vw;   /* 25px */
	line-height: 1.5em;
	margin-left: 3vw;
	margin-right: 3vw;
}

#faq .box p {
	font-size: 3.428vw;        /* 12px */
	margin-top: 5.714vw;       /* 20px */
	line-height: 1.6em;
	width: 90%;
	margin-left: auto;
	margin-right: auto;
}

#faq .box p a {
	color: #ff0000;
}




.monthly-calendar,
.multiple-calendar
{
	width: 1000px!important;
}
}



/*===============================================
●画面の横幅が400pxまで
===============================================*/
@media screen and (max-width:400px){
/*===============================================
●sp400
===============================================*/
#sp400------------------------------------------- {
}
}



/*===============================================
●画面の横幅が320pxまで
===============================================*/
@media screen and (max-width:320px){
/*===============================================
●sp320
===============================================*/
#sp320------------------------------------------- {
}
}



/*===============================================
●画面の横幅が481pxから768pxまで
===============================================*/
@media screen and (min-width:481px) and (max-width:768px) {
/*===============================================
●tablet
===============================================*/
#tab------------------------------------------- {
}
}