/*box shadow *の変更*/



/* NOTE: ■エレメント *//*————————————————————————————————————————————————————————————————*/

.sp {
	display: block;
}

.pc {
	display: none;
}

.spHide{
	display:none !important;
}

#wrap {
	overflow: hidden;
}

img {
	max-width: 100%;
}

p {
	margin: 0 10px;
}




/* NOTE: ■グローバル *//*————————————————————————————————————————————————————————————————*/

.line {
	display: block;
}
/* header*/
header {
  background-color: #ffffff;
  position: fixed;
  width: 100%;
  top:0;
  box-shadow: 0px 0px 7px 2px rgba(138, 138, 138, 0.5);
  height: auto;
  z-index: 999;
}

header #knocknote {
/* 	border: red solid 1px; */
	display: inline-block;
	width: 200px;
	text-align: left;
}

header #knocknote a img {
	width: 100%;
}

/* ノックノートアイコン */
header figure {
  display: inline-block;
  text-align: left;
  padding-left: 10px;
}

.mg60{
	margin: 0;
}

.header-icon {
	display: flex;
	padding: 10px;
}

/* メニュー開閉ボタン */
.sp_nav_BTN {
/* 	border: red solid 1px; */
	width: 23px;
	height: 18px;
	position: absolute;
	top: 15px;
	right: 15px;
	cursor: pointer;
}

.sp_nav_BTN div {
	position: relative;
/* 	border: blue solid 1px; */
	height: 100%;
}

.sp_nav_BTN div span {
	display: block;
	height: 2px;
	width: 100%;
	background: #3d0906;
	transition: all .3s ease;
}

.sp_nav_BTN div span:nth-of-type(1) {
	position: absolute;
	top: 0;
	left: 0;
}

.sp_nav_BTN div span:nth-of-type(2) {
	position: absolute;
	top: 47%;
	left: 0;
}

.sp_nav_BTN div span:nth-of-type(3) {
	position: absolute;
	bottom: 0;
	left: 0;
}


.sp_nav_BTN.is-active div span:nth-of-type(1) {
	transform: rotate(-45deg);
	transform-origin: right top;
}
.sp_nav_BTN.is-active div span:nth-of-type(2) {
	opacity: 0;
}
.sp_nav_BTN.is-active div span:nth-of-type(3) {
	transform: rotate(45deg);
	transform-origin: right bottom;
}



.annotation {
	position: relative;
	top: -3px;
}


.headline {
	text-align: center;
    font-size: 20px;
	height: 19vw;
    margin: 40px 0 20px 0;
    padding-top: 3px;
}

header nav {
	padding: 30px 0;
	display: none;
}

header nav ul li {
	list-style-type: none;
	line-height: 3;
}

header nav ul li a {
	text-decoration: none;
	color: #3d0906;
	font-weight: bold;
	font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
}





/* 問い合わせボタン 上から下へ */
header .headerBTN {
	display: none;
}

.sp_bottom_BTN {
	display: flex;
	width: 100%;
	position: fixed;
	bottom: 0;
	z-index: 1000;
}

.sp_bottom_BTN a:nth-of-type(1) {
	text-decoration: none;
	color: #fff;
	display: block;
	background: #EE93BB;
	width: 82%;
	padding: 15px 0;
	text-align: center;
	font-weight: bold;
	font-size: 4.4vw;
	letter-spacing: 2px;
}

.sp_bottom_BTN a:nth-of-type(2) {
	text-decoration: none;
	color: #fff;
	display: block;
	background: #00cad8;
	width: 18%;
	text-align: center;
	font-size: 3rem;
	position: relative;
	padding: 10px 0;
}

.sp_bottom_BTN .fa-phone-volume {
	transform: rotate(-45deg);
	display: block;
/* 	border: red solid 1px; */
	height: 100%;
	margin: 0 auto;
	position: relative;
	top: 2px;
}



/* NOTE: ■共通利用クラス *//*————————————————————————————————————————————————————————————————*/
.center-title{
	width: 90%;
	margin: 0 auto 55px;
}

.white-box{
	padding: 0px 5px 20px;
	border-radius:15px;
}

.anxiety {
	padding: 0 10px;
	background: #fff;
}

.anxiety h3 {
	text-align: center;
	font-size: 17px;
	margin-top:20px;
	height: 50px;
}
.polca-dot {
	padding: 0 10px;
}
.polca-dot::before,
.polca-dot::after {
	left: 0;
}




/* NOTE: -体験申し込みボタン */
.applyBTN {
	padding-top: 10px;
	padding-bottom: 15px;
}
.applyBTN a {
	font-size: 5vw;
	padding: 10px 20px;
}
.applyBTN a:before,
.applyBTN a span::after {
	/* content: none; */
	display: inline-block;
	content: "";
	width: 3vw;
	height: 3vw;
	background-image: url(../img/click_icon.png);
	background-size: 3vw;
	margin-left: -20px;
	right: -30px;
}

.applyBTN a span::before {
	left: -75px;
}

.subhead {
    font-size: 13px;
    margin: 0 1px 0 0;
}

.grade {
    margin: 10px 0;
}

.course {
    width: 85%;
    margin-bottom: 40px;
    margin: 0;
}

.course_intro{
	padding: 0;
	background-image: url(../img/back_pink.png);
	background-repeat: repeat space;
}

.course > img{
	height: 100%;
	width: 100%;
}

.goodpoint {
    position: relative;
    width: 100%;
    margin: 0 auto;
}

.goodpoint p {
	line-height: 24px;
    vertical-align: middle;
}


footer {
	/* background-color: #ffccb5; */
	text-align: center;
	padding: 20px 0 65px;
}






/* NOTE: ■個別 *//*————————————————————————————————————————————————————————————————*/



/* NOTE: -トップ */

#top {
	display: inline-block;
	position: relative;
	background-image: url("../img/top_image_sp.png");
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 100%;
	margin-top:55px;
	height: 100%;
}


#top figure {
	display: block;
	width: 100%;
	height: 100%;
	position: relative;
}


#top figure > img {
	position: relative!important;
	width: 90%;
	margin: 0 5% 19% 5%;
}

#top figure > img:nth-child(2) {
	display: block;
	padding: 0 20px;
	margin: 15% auto;
	width: 80%;
	position: relative;
	top: 10vw;
}

#top figure a {
	display: block;
	width: 95%;
	height: auto!important;
	position: relative!important;
	top: 0!important;
	left: 3%!important;
}

.campaign {
	position: relative;
    top: 0px;
	font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
    background: #FDFF00;
    text-align: center;
    font-size: 4vw;
    letter-spacing: 1px;
	line-height: 40px;
    /* padding: 10px 0; */
	margin: 0 15px;
    /* border-radius: 15px 15px 0 0; */
    border: white solid 5px;
    color: #F75A84;
    margin-bottom: 5px;
	z-index: 5;
    max-width: 700px;
}

.campaign p{
	font-size: 5vw;
}

.campaign span{
	font-size: 50px;
}

.campaign_btn h1::before {
    width: 15vw;
    height: 15vw;
    background-size: 15vw;
    margin-left: -15vw;
}

.campaign_btn{
	background: #F2C1CD;
	padding: 15px;
	position: relative;
	/* top: 70%; */
}

.campaign_btn h3{
	text-align: center;
	color: #673737;
    font-size: 4.5vw;
}

.campaign_btn p{
	background: #FFBA00;
	border-radius: 13px;
	color: #fff;
    text-align: center;
	padding: 2px;
	width: 85vw;
	margin: 0 auto ;
	font-size: 5vw;
}

.year {
	font-size: 4vw!important;
}


/* NOTE: -キャンペーン */

#canpain .white-box::before,
#canpain .white-box h2::before,
#canpain .white-box h2::after {
	content: none;
}


#canpain .white-box h2 {
	font-size: 2rem;
}

#canpain .canpain_txt1 {
	font-size: 2rem;

}

#canpain .canpain_txt1 .words1 {
	font-size: 120%;
	color: #ff172c;
}

#canpain .canpain_txt2 {
	font-size: 2.8rem;
}

#canpain .canpain_txt2 .words3 {
	font-size: 120%;
}


/* NOTE: -体験申し込みボタン */


.applyBTN {
	text-align: center;
	padding-top: 1vw;
	/* padding-bottom: 25px; */
/* 	border: red solid 1px; */
}

.applyBTN a {
	display: inline-block;
	color: #fff;
	/* background-color: #51CB46; */
	background: linear-gradient(#6DE260, #39B630);
	text-decoration: none;
	/* font-size: 2.5rem; */
	font-weight: bold;
	letter-spacing: 2px;
	/* padding: 15px 40px; */
	border: white solid 3px;
	border-radius: 12px;
	box-shadow: 1px 1px 1px 1px rgba(52, 52, 52, 0.6);
	position: relative;
	transition: all .2s ease;
	width: 95%;
}

.applyBTN a:hover {
	background-color: #6DE260;
}



.applyBTN a:before {
	display: inline-block;
	content: "";
	width: 79px;
	height: 112px;
	/* background-image: url("../img/arrow.png"); */
	position: absolute;
	bottom: 20px;
	left: -120px;
	pointer-events: none;
}

.applyBTN a span {
/* 	border: blue solid 1px; */
	position: relative;
	font-size: 5vw;
}


.applyBTN a span::before {
	display: inline-block;
	content: "";
	width: 61px;
	height: 52px;
	/* background-image: url("../img/free-icon.png"); */
	margin-left: 10px;
	position: absolute;
	left: -80px;
	top: -40px;
}



.applyBTN a span::after {
	display: inline-block;
	content: "";
	width: 4vw;
    height: 4vw;
    background-image: url(../img/click_icon.png);
    background-size: 4vw;
    margin-left: 10px;
    margin-bottom: 0vw;
    /* position: relative; */
}

.pink {
    background-image: url(../img/back_btn.png);
	background-position: center -20vw;
    height: 70vw;
    background-size: 107%;
}

.pink > div {
    margin: 2vw 5vw;
    padding: 1.3vh 0;
	position: relative;
	top: 10vw;
}

.contents_about {
	width: 100%;
	margin: 0 auto;
	background-image: url(../img/back_pink_mid.png);
    background-position: center bottom;
	background-size: 80%;
}

.white {
    font-size: 4vw;
}

.term {
    font-size: 4vw;
    padding: 2px;
    width: 85%;
    margin: 0 auto;
}

.contents_about img {
	width: 100%;
	display: block;
	margin: 0 auto;
}

/* NOTE: -3つの力 */

#points .circles ul li{
	background: #F7ED4C;
    border-radius: 50%;
    height: 240px;
    width: 240px;
    line-height: 1.6;
    display: inline-block;
    margin: 10px 25px;
    padding-top: 80px;
    font-weight: bold;
    font-size: 24px;
    letter-spacing: 0.01em;
}

.mg60 > div {
	margin: 0 auto;
	width: 95%;
}

.allpoints {
    text-align: unset;
	background-image: url(../img/back_pink_mid.png);
    background-size: 90%;
    background-position: center bottom;

}

.points {
	width: 300px;
	display: block;
	margin: 0 auto;
}

.points_detail {
	width: 100%;
    margin-left: 5vw;
    top: 25px;
}

.points_detail p {
    font-size: 1.5rem;
}

@media screen and (min-width:420px) and ( max-width:599px){
	.points_detail {
	    width: 80%;
	    margin-left: 13vw;
	    top: 25px;
	}

	.points_detail p {
	    line-height: 24px;
	    margin: 10px;
	    font-size: 1.7rem;
	}
}

.circles ul {
	height: 300px;
    width: 300px;
    margin: 0 auto;
}

.circles > ul li {
	/* background: #FAB1C5; */
    border-radius: 50%;
    height: 150px;
    width: 150px;
    line-height: 1.6;
    display: inline-block;
    margin: 10px 25px;
    padding-top: 80px;
    font-weight: bold;
    font-size: 24px;
    letter-spacing: 0.01em;
}

#minipink::before {
    height: 30px;
    width: 30px;
}

#minigreen::before {
    height: 30px;
    width: 30px;
}

#miniyellow::before {
    height: 30px;
    width: 30px;
}

/* NOTE: -当日の流れ */

#flow .white-box > section > h2 {
	height: 50px;
	background-size: contain;
}

#flow .flow_sec01 .sp {
/* 	border: red solid 1px; */
/* 	text-align: center; */
}

#flow .flow_sec01 .sp img {
	display: block;
	margin: 0 auto;
}

#flow .flow_sec01 .sp img.arrow {
	transform: rotate(90deg);
	width: 10vw;
	position: relative;
	left: 4%;
}


#flow .flow_sec02 > div {
	display: block;
	padding-left: 20px;
	padding-right: 20px;
}

.flow_sp {
	margin: 0 auto;
	width: 95%;
}



#flow .flow_sec02 > div iframe,
#flow .flow_sec02 > div p {
	width: 100%;
}



/* NOTE: -コース紹介 */

.course {
	width: 310px;
    margin: 20px auto;
    position: relative;
    bottom: 20px;
}

.contents_about p {
    font-size: 1.7rem;
    width: 90%;
    margin: 0 auto;
}

.alright{
	width: 95% !important;
}

#course .flex-space {
	display: block;
}
.course > span{
	padding: 10px;
}


.subhead{
	position: relative;
	top: 10px;
	display: inline-block;
	text-align: left;
	width: 185px;
	font-size: 14px;
}

.grade{
	display: inline-block;
	width:100px;
	font-size: 15px;
	background-color: #EE93BB;
    color: #fff;
	border-radius: 10px;
	margin-bottom: 10px;
	padding: 3px;
}

.goodpoint {
    position: relative;
    width: 100%;
    margin: 0 auto;
}

.goodpoint p {
	text-align: left;
    line-height: 24px;
    vertical-align: middle;
    margin: 0;

}

.goodpoint p::before {
	content:"";
	display: inline-block;
    background-image: url(../img/icon_sakura.png);
    background-size: 17px;
	background-position: left 0px;
    width: 20px;
    height: 20px;}

#scratch,#robot,#unity{
	display: block;
	height: 220px;
	background-position: top center;
	background-repeat: no-repeat;
	background-size: 100% 100%;
}

#youtube{
	height: 228px;
	width: 410px;
}

/* NOTE: -選ばれる理由 */

#reason .white-box > section > h2 {
/* 	border: red solid 1px; */
	max-width: 100%;
	height: 55px;
	background-size: contain;
}

#reason .reason_figure {
	display: block;
	margin-top: 20px;
}

#reason .reason_figure dl {
	width: 100%;
	margin-bottom: 20px;
}

#reason .reason_voice dl {
	display: block;
	margin-bottom: 25px!important;
}

#reason .reason_voice dl dt img {
	width: 40%;
}


#reason .reason_voice dl dd  {
	border-radius: 10px;
	padding: 10px;
	width: 100%;
	font-size: 1.4rem;
}

#reason .reason_voice dl dd p {
	font-size: 1.5rem;
}

#reason .reason_voice dl:nth-of-type(1) dd::before,
#reason .reason_voice dl:nth-of-type(2) dd::before {
	content: none;
}

#reason .white-box > section p {
	padding: 0 10px;
}


/* NOTE: -メディア掲載 */
#media .media_sec01 {
	display: block;
	width: 85%;
	margin-bottom: 20px;
}

#media .media_sec01 dl {
	margin-bottom: 15px;
}

#media .media_sec02 {
	width: 85%;
	display: block;
}

#media .media_sec02::before,
#media .media_sec02::after,
#media .media_sec02 div:nth-of-type(1) {
	content: none;
	display: none;
}

#media .media_sec02 div:nth-of-type(2) {
	width: 100%;
	padding: 2px 0 0 6px;
}

#media .media_sec02 div:nth-of-type(2) iframe {
	width: 97%;
}

#media .media_sec03 {
	margin-top: 40px;
}

#media .media_sec03 button span {
	padding: 7px;
}

#media .media_sec03 dl {
	width: 90%;
}

#media .media_sec03 dl dt {
	font-size: 1.8rem;
}

#media .media_sec03 dl dd {
	margin-bottom: 30px;
}

#media .media_sec03 .media_more_tv::before,
#media .media_sec03 .media_more_book::before {
	content: none;
}





































/* NOTE: -アクセス */

#access {

}

#access .white-box {
	display: block;
	padding-left: 20px;
	padding-right: 20px;
}

#map {
	width: 100%;
}
















/* NOTE: -問い合わせフォーム */


#form {
	padding-top: 40px;
}

.form_box {
    padding: 0;
}





/* 元サイトから */
#course_tab {
	text-align: center;
	margin: 60px 0 30px 0;
}

#course_tab > li {
	display: inline-block;
	padding: 3px 3px;
	font-size: 1.25rem;
	margin: 2px auto;
	border-radius: 10px;
	color: #555;
	font-weight: normal;
	cursor: pointer;
	width: 200px;
}

#course_tab > li.is-active-tab {
	background: #ff5757;
	color: #fff;
/* 	font-weight: bold; */
}

#course_tab > li.select:before {
	content: '\f040';
	padding: 0 .4em 0 0;
	font-family: FontAwesome;
}


#cont_tab > li {
	display: none;
}

#cont_tab > .is-active-cont {
	display: block!important;
}

#COMMON {
    padding: 30px 15px 50px 15px;
    box-sizing: border-box;
}

.sub_table {
    font-size: 15px;
}

.formStepList li:last-child span {
    padding-right: 17px;
}

.formStepList li span {
    text-align: center;
    height: 20px;
    padding: 2px 0 0 21px;
    position: relative;
    margin: 0;
	font-size: 1.1rem;
}

form.form_default {
/* 	border: red solid 1px; */
	overflow: hidden;
}

form.form_default > dl dt {
	float: none;
	width: 100%;
}

form.form_default > dl dt .requiredlabel {
	display: inline-block;
	margin-left: 5px;
}

form.form_default > dl dd {
	border-top: none;
	width: 100%;
	float: none;
	padding: 5px 0 10px 0;
}



form.form_default > dl dd input[type=text],
form.form_default > dl dd input[type=email],
form.form_default > dl dd input[type=tel] {
	width: 100%;
}
form.form_default > dl dd input[type=radio] {
	margin: 0 10px 0 0;
	max-width: 100%;
}
form.form_default > dl dd select {
	max-width: 100%;
}



form.form_default > dl dd textarea {
	width: 100%;
	min-height: 10em;
}

form.form_default button.submitBtn {
	padding: 10px 10px;
	font-size: 3.5vw;
}









.form_chk > table th {
	width: 100%;
	display: block;
}

.form_chk > table th .requiredlabel {
	display: inline-block;
	margin-left: 5px;
	text-align: center;
}

.form_chk > table td {
	border-top: none;
	width: 100%;
	display: block;
}

.form_chk > table td input {
	border: green solid 3px;
}






/* 完了画面 */
.formCompleteBox .txtbox {
	width: 90%;
	font-size: 1.6rem;
}

.formCompleteBox .h3Form {
	text-align: center;
	margin-bottom: 20px;
}

.formCompleteBox h4 {
	width: 90%;
}

.formCompleteBox dl {
	width: 90%;
}

.formCompleteBox dl dt {
	font-size: 1.8rem;
}

.formCompleteBox dl dd {
	font-size: 1.6rem;
}


























.h1{
  display: inline;
  text-align: center;
}
.h1 > span{
  width: 80%;
  margin-left: auto;
  margin-right: auto;
}



/* button */

















/*
@media screen and (max-width:600px){
	.menu-trigger,
	.menu-trigger span{
		border: 1px solid black;
		display: inline-block;
		transition: all .4s;
		box-sizing: border-box;
	}
	.menu-trigger{
		position: relative;
		width: 50px;
		height:44px;
	}
	.menu-trigger span{
		position: absolute;
		left:0;
		width: 100%;
		height: 4px;
		background-color: #fff;
		border-radius:4px;
	}
	.menu-trigger span:nth-of-type(1){
		top:0;
	}
	.menu-trigger span:nth-of-type(2){
		top:20px;
	}
	.menu-trigger span:nth-of-type(3){
		bottom:0;
	}
}
*/