@charset "utf-8";
/* ----------------------------- main ------------------------------- */
main{padding: 64px 0 0; background: #fff;}
h3{text-align: center; font-size: 19px; line-height: 120%;}
h3 span{ background: linear-gradient(to right,#FF9FEC 20%,#E5BAFF); background: -webkit-linear-gradient(to right,#FF9FEC 20%,#E5BAFF); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-size: 50px;font-family: vdl-logojrblack, sans-serif; font-weight: 900; font-style: normal;}
.mini_inner{width: 90%; margin: 0 auto;}
img{width: 100%; height: auto;}

.pink_number{font-family: vdl-logojrblack, sans-serif; font-weight: 900; font-style: normal; font-size: 59px; color: #F7A7F1;}
/* ----------------------------- #fv ------------------------------- */
#fv{background: url(../images/top/fv_bg_1_sp.jpg) no-repeat center center; background-size: cover; padding: 10px 0 41px;position: relative;}
#fv .fv_box{position: absolute; width: 170px; right: 5%; top: 30%;}
#fv .fv_box .box{width: 100%; height: auto; position: relative;}
#fv .fv_box .box.box_2{margin: 0 0 14px;}
#fv .fv_box .box img.fv_pin_1{position: absolute; top: -17px; left: -27px; z-index: 2;  width: 63px; height: auto;}
#fv .fv_box .box:before{display: block; content: ""; width: 100%; height: 100%; position: absolute; bottom: -6px; right: -4px; border-radius: 20px; background: #FC97DB;}
#fv .fv_box .box p{padding: 13px 0 12px; width: 100%; height: 100%; background: #fff; border-radius: 20px; position: relative; z-index: 1; text-align: center; font-size: 18px; line-height: 112%;}
#fv .fv_box .box.box_2 p{font-size: 17px;padding: 13px 0 12px;}
#fv .fv_box .box p img{display: inline-block;}
#fv .fv_box .box_1 p img{width: 20px; height: auto;}
#fv .fv_box .box_2 p img{width: 17px; height: auto;}
#fv .name{font-size: 12px; font-family: vdl-logog, sans-serif; font-weight: 400; font-style: normal; padding: 5px 0 0; line-height: 125%;}
#fv .name .mini_bg{background:linear-gradient(transparent 40%, #fff 40%); font-size: 12px; line-height: 125%; margin: 0 7px 0 0px;}
#fv .name .big_tt{font-size: 19px; margin: 0 0 0 4px;}
#fv .deta_tt{padding: 14px 0 0;}
#fv .link_title{text-align: center; font-size: 18px; padding: 25px 0 0;font-family: corporate-logo-ver2, sans-serif; font-weight: 500; font-style: normal;}
#fv a.view_btn{margin: 8px auto 0;}

/* ----------------------------- #mentors ------------------------------- */
#mentors{padding: 52px 0 0;}
#mentors .box_list{padding: 30px 0 0;}
#mentors .box_list .box{width: 100%; height: auto; box-shadow: 0 5px 8px 1px rgba(0,0,0,0.1);}
#mentors .box_list .box:not(:last-child){margin: 0 0 30px;}
#mentors .box_list .box h4{text-align: center; font-size: 18px; line-height: 156%; padding: 6px 0 3px;}
#mentors .box_list .box.purple_box h4{background: linear-gradient(to right,#E5D3FF,#AD89DD 70%);}
#mentors .box_list .box.red_box h4{background: linear-gradient(to right,#FF9191,#F46262 70%);}
#mentors .box_list .box .content{padding: 25px 26px 25px 27px;}
#mentors .box_list .box .content img{border-radius: 5px;}
#mentors .box_list .box .content h5{font-size: 19px; text-align: center; padding: 15px 0 0;}
#mentors .box_list .box .content p{font-size: 12px; line-height: 200%;font-family: 'Noto-Sans-JP-Regular'; padding: 13px 0 0;}

/* ----------------------------- #composers ------------------------------- */
#composers{padding: 60px 0 0;}
#composers h3{font-size: 18px; line-height: 140%;}
#composers h3 span{font-size: 37px;}
#composers .box_list{padding: 27px 0 0;}
#composers .box_list .box{overflow: hidden; border-radius:15px 15px 25px 25px; box-shadow: 0 0 6px 2px rgba(0,0,0,0.1);}
#composers .box_list .box:not(:last-child){margin: 0 0 30px;}
#composers .box_list .box .text_box{padding: 20px 26px;}
#composers .box_list .box .text_box  h4{text-align: center; font-family: corporate-logo-ver2, sans-serif; font-weight: 500; font-style: normal;}
#composers .box_list .box .text_box p{font-size: 12px; line-height: 200%;font-family: 'Noto-Sans-JP-Regular'; }

#composers .box_list .box .text_box .tt_bx_1{ border-bottom: 1px solid #000;}
#composers .box_list .box .text_box .tt_bx_1 h4{ font-size: 19px; padding: 6px 0 2px;color: #fff;background: linear-gradient(to right,#FF9FEC ,#E5BAFF);}
#composers .box_list .box .text_box .tt_bx_1 p{padding: 15px 0 20px; }

#composers .box_list .box .text_box .tt_bx_2{padding: 20px 0 0;}
#composers .box_list .box .text_box .tt_bx_2 h4{font-size: 17px; }
#composers .box_list .box .text_box .tt_bx_2 p{padding: 18px 0 0px; }

/* ----------------------------- #about ------------------------------- */
#about{padding: 60px 0 0;}
#about p.title_tt{max-width: 289px; margin: 0 auto; width: 100%; padding: 32px 0 0;}
#about p.title_tt span{font-size: 20px; display: inline-block; padding: 7px 0 6px; background: linear-gradient(90deg,#FFAFE0 30%,#9BA3FF); color: #fff; width: 100%; text-align: center;}
#about p.title_tt span:not(:last-child){margin: 0 0 5px;}

#about .img_box{padding: 17px 0 0; text-align: center;}
#about .img_box img{border-radius: 5px; width: 84.7%; height: auto;}
#about .img_box .text_box{padding: 23px 0 0;}
#about .img_box .text_box p:not(:last-child){padding: 0 0 28px;}
#about .img_box .text_box p{line-height: 200%; font-size: 14px;}
#about .img_box .text_box p span{line-height: 140%; font-size: 14px; background: #FFF364; display: inline-block;}

/* ----------------------------- #point ------------------------------- */
#point{padding: 31px 0 60px;}
#point .box_list{padding: 37px 0 0;}
#point .box_list .box{width: 84.7%; margin: 0 auto;}
#point .box_list .box:not(:last-child){padding: 0 0 33px;}
#point .box_list .box h4{padding: 29px 0 0; position: relative; text-align: center; font-size: 19px;}
#point .box_list .box h4 .pink_number{position: absolute; left: 0px; top: 0px; }
#point .box_list .box h4 .tt{font-size: 19px; position: relative; z-index: 1;line-height: 132%;}
#point .box_list .box img{margin:20px 0 0; border-radius: 5px;}
#point .box_list .box p{font-size: 12px; line-height: 200%;font-family: 'Noto-Sans-JP-Regular'; padding: 20px 0 0;}
#point .box_list .box a{background: #F0D0FF; border-radius: 1000px; display: block; max-width: 263px; margin: 20px auto 0; font-size: 18px; line-height: 128%;padding: 10px 54px 8px 29px; position: relative;}
#point .box_list .box a span{display: block; width: 22px; height: 22px; position: absolute; top: 50%; transform: translateY(-50%); right: 19px; background: #fff; border-radius: 100px;}
#point .box_list .box a span:before{content: ""; display: block; position: absolute; top: 50%; left: 45%; transform: translate(-50%,-50%) rotateZ(-45deg); right: 30px; width: 8px; height: 8px; border-right: 2px solid #F0D0FF; border-bottom: 2px solid #F0D0FF;}

/* ----------------------------- #merit ------------------------------- */
#merit{padding: 60px 0 0;}
#merit .box_list{padding: 30px 0 0;}
#merit .box_list .box{width: 84.7%; margin: 0 auto;}
#merit .box_list .box:not(:last-child){padding: 0 0 33px;}
#merit .box_list .box h4{ display: flex; align-items: center;}
#merit .box_list .box h4 span.tt{display: inline-block; margin: 0 0 0 20px;}
#merit .box_list .box img{border-radius: 5px; margin: 20px 0 0;}
#merit .box_list .box p{font-family: 'Noto-Sans-JP-Regular'; font-size: 12px; line-height: 200%; padding: 20px 0 0;}

/* ----------------------------- #how_to ------------------------------- */
#how_to{padding: 51px 0 0;}
#how_to .period{margin: 30px 0 0; }
#how_to .period h4{background: #000; color: #fff; text-align: center; font-size: 16px; padding: 8px 0 6px;}
#how_to .period p{border: 1px solid #707070; padding: 14px 14px 19px; text-align: center;}
#how_to .period p span{font-family: "corporate-logo-ver2", sans-serif; font-weight: 700; font-style: normal; font-size: 36px; text-align: left; display: inline-block; }
#how_to .qualification{border: 1px solid #707070; margin: 11px 0 0; padding: 17px 24px 22px 23px ;}
#how_to .qualification h4{padding: 0 0 14px; border-bottom: 1px solid #707070; text-align: center;}
#how_to .qualification ul{padding: 14px 0 0;}
#how_to .qualification ul li{font-size: 11px; line-height: 200%; padding-left: 16px; position: relative;font-family: 'Noto-Sans-JP-Regular';}
#how_to .qualification ul li:not(:last-child){margin: 1px 0 3px;}
#how_to .qualification ul li:before{content: ""; display: block; width: 5px; height: 5px; border-radius: 1000px; background: #000; position: absolute; top: 8px; left: 0px;}

/* ----------------------------- #flow ------------------------------- */
#flow{padding: 60px 0;}
#flow .box_list{width: 84.7%; margin: 0 auto; padding: 32px 0 0;}
#flow .box_list .box{position: relative; }
#flow .box_list .box:not(:last-child){padding: 0 0 25.6%;}
#flow .box_list .box:not(:last-child):before{content: ""; display: block; background: url(../images/top/flow_pin_1.svg) no-repeat center center; background-size: cover; transform: translateX(-50%); left: 50%; width: 22%; height: auto; bottom: 6.5%; position: absolute; padding: 6.4% 0 0;}
#flow .box_list .box h4{position: relative;}
#flow .box_list .box h4 span.tt{display: inline-block; font-size: 19px; z-index: 1; line-height: 132%; top: 50%; transform: translateY(-50%); position: absolute; left: 128px; width: max-content; }
#flow .box_list .box:nth-child(1) h4 span.tt{left: 110px;}
#flow .box_list .box img{padding: 32px 0 0;}
#flow .box_list .box p{padding: 16px 0 0; line-height: 200%; font-size: 12px;font-family: 'Noto-Sans-JP-Regular';}


#flow .qualification{border: 1px solid #707070; padding: 17px 21px 27px 23px; width: 90.6%; margin: 60px auto 0;}
#flow .qualification h4{padding: 0 0 14px; border-bottom: 1px solid #707070; text-align: center;}
#flow .qualification ul{padding: 16px 0 0;}
#flow .qualification ul li{font-size: 11px; line-height: 190%; padding-left: 17px; position: relative;font-family: 'Noto-Sans-JP-Medium';}
#flow .qualification ul li:not(:last-child){margin: 0 0 5px;}
#flow .qualification ul li:before{content: ""; display: block; width: 5px; height: 5px; border-radius: 1000px; background: #000; position: absolute; top: 8px; left: 0px;}


#flow .img_box{padding: 65px 0 0; text-align: center;}
#flow .img_box img{border-radius: 5px;}
#flow .img_box .text_box{padding: 23px 0 0;}
#flow .img_box .text_box p:not(:last-child){padding: 0 0 28px;}
#flow .img_box .text_box p{line-height: 200%; font-size: 16px;}
#flow .img_box .text_box p span{line-height: 140%; font-size: 16px; background: #FFF364; display: inline-block;}
/* ----------------------------- #faq ------------------------------- */
#faq{ padding: 60px 0 50px;}
#faq p.text{font-size: 14px; letter-spacing: 0.04em; line-height: 186%;font-family: 'Noto-Sans-JP-Regular'; padding: 18px 0 0;}
#faq .title_tt{font-size: 12px; line-height: 217%; padding: 22px 0 0; text-align: center;letter-spacing: 0.04em;font-family: 'Noto-Sans-JP-Regular';}
#faq ul{padding: 23px 0 0 ;}
#faq ul li.clos_btn{padding: 21px 16px;border-radius: 18px; background: #fff; border: 1px solid #000;}
#faq ul li.clos_btn:not(:last-child){margin: 0 0 17px;}
#faq ul li.clos_btn .tt_box {position: relative;}
#faq ul li.clos_btn .tt_box span.big_tt{ padding: 0 17px 0 0; position: absolute; left: 0px; top: 0px; transition: 0.5s;}
#faq ul li.clos_btn .tt_box span.big_tt.none{opacity: 0;}
#faq ul li.clos_btn.active .tt_box span.big_tt.none{opacity: 1; transition: 0.5s;}
#faq ul li.clos_btn.active .tt_box span.big_tt.block{opacity: 0; transition: 0.5s;}
#faq ul li.clos_btn .tt_box.question {font-family: 'Noto-Sans-JP-Medium'; font-size: 16px; line-height: 150%; padding: 0 20px 0 30px;}
#faq ul li.clos_btn .tt_box.question span.clos{width: 24px; height: 24px; display: block; position: absolute;right: 0px; top: 0px;}
#faq ul li.clos_btn .tt_box.question span.clos:before,
#faq ul li.clos_btn .tt_box.question span.clos:after{content: ""; display: block; width: 100%; height: 2px; background: #FA82E2; position: absolute; top: 50%; left: 50%;transform: translate(-50%,-50%); transition: 0.5s;}
#faq ul li.clos_btn .tt_box.question span.clos:after{transform: translate(-50%,-50%) rotateZ(90deg);}
#faq ul li.clos_btn.active .tt_box.question span.clos:after{transform: translate(-50%,-50%) rotateZ(0deg); transition: 0.5s;}
#faq ul li.clos_btn .tt_box.content_tt{padding: 0 0 0 30px; font-size: 12px; letter-spacing: 0.04em; line-height: 186%; display: none; margin: 14px 0 0; font-family: 'Noto-Sans-JP-Regular';}
#faq ul li.clos_btn .tt_box.content_tt span.big_tt{color: #E87700; top:0;}
