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

/*================ ローディング画面のためのCSS ===============*/
/*body{
    overflow: hidden;
}
#body__splash {
	position: fixed;
	width: 100%;
	height: 100%;
	background: #333;
	z-index: 10;
	text-align:center;
	color:#fff;
}

#body__splash--logo {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}*/

/* 画面遷移のためのCSS */

/*.body__splash--bg {
    display: none;
}*/

/*bodyにappearクラスがついたら出現*/
.appear>.body__splash--bg {
    display: block;
    content: "";
    position:absolute;
	z-index: 1;
    width: 100%;
    height: 150vh;
    top: 0;
	left: 0;
    transform: scaleX(0);
    background-color: #ea2127;/*伸びる背景色の設定*/
	animation-name:PageAnime;
	animation-duration:1.5s;
	animation-timing-function:ease;
	animation-fill-mode:forwards;
}

@keyframes PageAnime {
	0% {
		transform-origin:left;
		transform:scaleX(0);
        transform:translate(100%, 0) skew(330deg, 0deg);
	}
    100% {
		transform-origin:left;
        transform:translate(-89.5%, 0) skew(330deg, 0deg);
	}
}

/*画面遷移の後現れるコンテンツ設定*/

.container{
	opacity: 0;/*はじめは透過0に*/
}

/*bodyにappearクラスがついたら出現*/
body.appear .container {
	animation-name:PageAnimeAppear;
	animation-duration:1s;
	animation-delay: 0.8s;
	animation-fill-mode:forwards;
	opacity: 0;
}
body.appear{
    overflow: auto;
}


@keyframes PageAnimeAppear {
	0% {
	opacity: 0;
	}
	100% {
	opacity: 1;
    }
}



/*========================================================*/

/*-------------------header-------------------*/

.header__menu--wrap{
    position: relative;
}


/*----------------------キャッチコピー----------------------*/
.firstview--wrap {
    position: relative;
    z-index: 10;
    width: 100%;
    max-width: 1080px;
    margin: 0 auto;
}

.firstview__logo,
.firstview__logo img {
    width: 100%;
    max-width: 580px;
    position: absolute;
    top: 40px;
    left: 0;
    z-index: 999;
}

.firstview__copy {
    position: absolute;
    top: 420px;
    left: 0;
    z-index: 999;
}
.firstview__copy h2 {
    font-size: 6.3rem;
    color: #fff;
    font-family: 'Shippori Mincho', serif;
}

.firstview__heading {
    width: 100%;
    max-width: 1080px;
    text-align: left;
    position: absolute;
}
.firstview__heading h2 {
    position: absolute;
    top: 650px;
    left: 10px;
    width: 100%;
	max-width: 660px;
}
.firstview__heading h2 img{
    width: 100%;
    max-width: 660px;
}
.firstview__heading p {
    font-family: 'Shippori Mincho', serif;
    font-weight: 500;
    font-size: 1.8rem;
    line-height: 2.4em;
    position: absolute;
    top:730px;
    left: 5px;
}


.sp-920-slider {
    display: none!important;
}


/*--------------------main---------------------*/
main {
    padding-top: 50px;
}
.main__firstview {
    width: 100%;
    margin: 0 auto;
    position: relative;
    z-index: 99;
    overflow: hidden;
}

.main__firstview--topimg-wrap {
    position: relative;
    z-index: 70;
}

.main__firstview--topimg,
.main__firstview--topimg img {
    width: 100%;
    height: 580px;
    object-fit: cover;
    position: relative;
    z-index: -999;
    margin-bottom: 250px;
}

/*================ お知らせbannerのアニメーション ===============*/

.main__firstview--participant {
    width: 600px;
    height: 40px;
    background-color:#ea2127; 
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 50;
    transition: .5s;
}
.main__firstview--participant a {
    display: block;
    line-height: 40px;
    text-align:left;
    color: #fff;
    font-family: 'Kosugi Maru', sans-serif;
    font-size: 1.6rem;
    padding-left: 30px;
}
.main__firstview--participant02 {
    width: 600px;
    height: 40px;
    background-color:#ea2127; 
    position: fixed;
    bottom: 20px;
    right: -600px;
    z-index: 50;
    transition: .5s;
}
.main__firstview--participant02 a {
    display: block;
    line-height: 40px;
    text-align:left;
    color: #fff;
    font-family: 'Kosugi Maru', sans-serif;
    font-size: 1.6rem;
    padding-left: 30px;
}
/*-------------------- moveクラス付与 -------------------- */

.main__firstview--participant.move{
    right: -600px;
}
.main__firstview--participant02.move{
    right: 0;
    display: block;
}
.main__firstview--participant02.move.fadeout {
    right: -600px;
}
/*========================================================*/

.main__news {
    width: 100%;
    max-width: 1200px;
    margin:  20px auto;
}
.main__news--important {
    width: 100%;
    max-width: 1200px;
    margin:  0 auto;
    border: 2px solid #e9282a;
    display: flex;
    justify-content: flex-start;
    padding: 7px 0;
}
.main__news--important-text {
    font-size: 17px;
    font-weight: bold;
    line-height: 40px;
}
.main__news--important-mark {
    color: #fff;
    text-align: center;
    font-size: 30px;
    font-weight: bold;
    font-family: 'Saira Semi Condensed', sans-serif;
    display: block;
    width: 38px;
    height: 38px;
    line-height: 38px;
    background-color: #e9282a;
    border-radius: 20px;
    margin:auto 25px;
}
.main__news--list-wrap {
    width: 100%;
    max-width: 1200px;
    margin:  30px auto;
    display: flex;
    justify-content: flex-start;
}
.main__news--list-wrap h3 {
    margin: 0 -60px 0 0px;
    color: #1d1d1d;
    font-size: 17px;
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: bold;
}
.main__news--list-wrap ul {
    width: 100%; 
    max-width: 970px;
    margin: 0 auto;
}
.main__news--list-wrap li {
    width: 100%;
    max-width: 970px;
    border-bottom: solid 1px #000;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 20px 0; 
}
.main__news--list-wrap li:nth-child(1) {
    padding-top: 0;
}
.main__news--list-wrap li:last-child {
    border-bottom: none;
    justify-content: flex-end;
    padding: 10px 0;
}
.main__news--list-wrap li:last-child span {
    color: #e9282a;
}
.main__news--list-wrap li>p {
    color: #1d1d1d;
    font-size: 13px;
    font-family: 'Saira Semi Condensed', sans-serif;
}
.main__news--list-wrap li>a {
    color: #1d1d1d;
    font-size: 16px;
    font-family: 'Saira Semi Condensed', sans-serif;
    margin-left: 2rem;
}
.list-icon::after {
    content: "";
    width: 0;
    height: 0;
    border-left: 8px solid #EA2127;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    margin-left: 10px;
    display: inline-block;
}

/*お知らせページボタン*/
.news__btn {
    position: relative;
    z-index: 80;
}
.news__btn a {
    display: block;
    width: 186px;
    height: 38px;
    line-height: 38px;
    margin: 0 auto;
    color: #fff;
    background-color: #d7b98f;
    border-radius: 20px;
    text-align: center;
    font-weight: 500;
}

.main__youwakai-omoi {
    width: 100%;
    margin: 20px auto;
    background-color: #d7b98f;
    text-align: center;
}

.main__youwakai-omoi img{
    width: 100%;
    max-width: 1000px;
}

.main__guidance{
    width: 100%;
    margin: 50px 0 50px auto;
    overflow: hidden;
}
.main__guidance--beginner{
    width: 100%;
    margin-bottom: 15px;
    color: #fff;
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 2rem;
    line-height: 45px;
    text-align:center; 
    transform: skewX(-150deg);
    position: relative;
}
.main__guidance--beginner::before {
    width: 0%;
    height: 45px;
    background-color: #ea2127;
    position: absolute;
    left:-15px;
    content:"";
    transition: 0.6s;
}
.main__guidance--beginner.fade::before {
    width: 80%;
}
.main__guidance--beginner a{
    display: block;
    transform: skewX(150deg)
}
.main__guidance--member{
    width: 100%;
    color: #fff;
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 2rem;
    line-height: 45px;
    text-align:center; 
    transform: skewX(-150deg);
    position: relative;
}
.main__guidance--member::before{
    width:0%;
    height: 45px;
    background-color: #ec6d74;
    position: absolute;
    left:-15px;
    content:"";
    transition: 0.7s;
}
.main__guidance--member.fade::before{
    width: 82%;
}
.main__guidance--member a{
    display: block;
    transform: skewX(150deg)
}



.main__course-article {
    width: 100%;
    margin: 0 auto 1%;
}
.main__course-banner--wrap{
    width: 100%;
    margin: 0 auto;
    position: relative;
}
.main__course-banner-img,
.main__course-banner-img img{
    width: 100%;
    margin: 0 auto;
    text-align: center;
}

.main__course-banner-menu01{
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    position: absolute;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    z-index: 50;
}
.course-banner-menu01--contents{
    width: 100%;
    max-width: 500px;
    margin: 0 auto 0 0;
}
.course-banner-menu01--contents h3{
    font-size: 2.5rem;
    font-weight: 600;
    color: #ea2127;
    margin-bottom: 30px;
}
.course-banner-menu01--contents div{
    width: 100%;
    max-width: 300px;
    text-align: left;
}
.course-banner-menu01--contents p{
    font-size: 1.5rem;
    font-weight: 600;
    color: #ea2127;
    margin-bottom: 25px;
}
.course-banner-menu01--contents ul{
    width: 100%;
    max-width: 360px;
    text-align: left;
	margin-top: 4rem;
}
.course-banner-menu01--contents ul li{
    width: 100%;
    max-width: 450px;
    height: 40px;
    line-height: 40px;
    border: 1px solid #ea2127;
    text-align: left;
    margin-bottom: 10px;
}
.course-banner-menu01--contents ul li a{
    font-size: 1.4rem;
    font-weight: 600;
    display: flex;
    justify-content: space-between;
    padding-left: 10px;
    color: #000;
}
.course-banner-menu01--contents ul li a>span{
    font-size: 1.5rem;
    font-weight: 600;
    color: #ea2127;
    padding-right: 10px;
}

.main__course-banner-menu02{
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    position: absolute;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    z-index: 50;
}
.course-banner-menu02--contents{
    width: 100%;
    max-width: 500px;
    margin: 0 auto 0 0;
}
.course-banner-menu02--contents h3{
    font-size: 2.5rem;
    font-weight: 600;
    color: #ea2127;
    margin-bottom: 30px;
}
.course-banner-menu02--contents div{
    width: 100%;
    max-width: 180px;
    text-align: left;
    margin-bottom: 5px;
}
.course-banner-menu02--contents p{
    font-size: 1.5rem;
    font-weight: 600;
    color: #ea2127;
    margin-bottom: 25px;
}
.course-banner-menu02--contents nav{
    width: 100%;
    max-width: 390px;
	margin-top: 4rem;
}
.course-banner-menu02--contents nav p{
    margin-bottom: 5px;
}
.course-banner-menu02--contents ul{
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    text-align: left;
}
.course-banner-menu02--contents ul li{
    max-width: 186px;
    height: 40px;
    line-height: 40px;
    border: 1px solid #ea2127;
    text-align: left;
    margin-bottom: 10px;
}
.course-banner-menu02--contents ul li a{
    font-size: 1.5rem;
    font-weight: 600;
    display: flex;
    justify-content: space-between;
    padding-left: 10px;
    color: #000;
}
.course-banner-menu02--contents ul li a>span{
    font-size: 1.5rem;
    font-weight: 600;
    color: #ea2127;
    padding-right: 10px;
}
.banner-menu02--contents--list__right li:nth-child(3){
    pointer-events: none;
    opacity: 0;
}

.main__course-banner-menu03{
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    position: absolute;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    z-index: 50;
}
.course-banner-menu03--contents{
    width: 100%;
    max-width: 590px;
    margin: 0 auto 0 0;
}
.course-banner-menu03--contents h3{
    font-size: 2.5rem;
    font-weight: 600;
    color: #ea2127;
    margin-bottom: 30px;
}
.course-banner-menu03--contents div{
    width: 100%;
    max-width: 340px;
    text-align: left;
    margin-bottom: 20px;
}
.course-banner-menu03--contents p{
    font-size: 1.5rem;
    font-weight: 600;
    color: #ea2127;
    margin-bottom: 25px;
}
.course-banner-menu03--contents nav{
    width: 100%;
    max-width: 583px;
	margin-top: 4rem;
}
.course-banner-menu03--contents nav p{
    margin-bottom: 10px;
}
.course-banner-menu03--contents ul{
    width: 100%;
    text-align: left;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.course-banner-menu03--contents ul li{
    width: 100%;
    max-width: 187px;
    height: 40px;
    line-height: 40px;
    border: 1px solid #ea2127;
    text-align: left;
    margin-bottom: 10px;
}

.course-banner-menu03--contents ul li a{
    font-size: 1.5rem;
    font-weight: 600;
    display: flex;
    justify-content: space-between;
    padding-left: 10px;
    color: #000;
}
.course-banner-menu03--contents ul li a>span{
    font-size: 1.5rem;
    font-weight: 600;
    color: #ea2127;
    padding-right: 10px;
}
.course-list__font-size>a{
    font-size: 1.2rem!important;
}

.main__course-banner-menu04{
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    position: absolute;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    z-index: 50;
}
.course-banner-menu04--contents{
    width: 100%;
    max-width: 500px;
    margin: 0 auto 0 0;
}
.course-banner-menu04--contents h3{
    font-size: 2.5rem;
    font-weight: 600;
    color: #ea2127;
    margin-bottom: 60px;
}
.course-banner-menu04--contents div{
    width: 100%;
    max-width: 440px;
    text-align: left;
}
.course-banner-menu04--contents p{
    font-size: 1.5rem;
    font-weight: 600;
    color: #ea2127;
    margin-bottom: 25px;
}
.course-banner-menu04--contents ul{
    width: 100%;
    max-width: 330px;
    display: flex;
    text-align: left;
    justify-content: space-between;
	margin-top: 4rem;
}
.course-banner-menu04--contents ul li{
    width: 100%;
    max-width: 160px;
    height: 40px;
    line-height: 40px;
    border: 1px solid #ea2127;
    text-align: left;
    margin-bottom: 10px;
}
.course-banner-menu04--contents ul li a{
    font-size: 1.5rem;
    font-weight: 600;
    display: flex;
    justify-content: space-between;
    padding-left: 10px;
    color: #000;
}
.course-banner-menu04--contents ul li a>span{
    font-size: 1.5rem;
    font-weight: 600;
    color: #ea2127;
    padding-right: 10px;
}

.main__course-banner-menu05{
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    position: absolute;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    z-index: 50;
}
.course-banner-menu05--contents{
    width: 100%;
    max-width: 500px;
    margin: 0 auto 0 0;
}
.course-banner-menu05--contents h3{
    font-size: 2.5rem;
    font-weight: 600;
    color: #ea2127;
    margin-bottom: 60px;
}
.course-banner-menu05--contents div{
    width: 100%;
    max-width: 410px;
    text-align: left;
}
.course-banner-menu05--contents p{
    font-size: 1.5rem;
    font-weight: 600;
    color: #ea2127;
    margin-bottom: 30px;
    margin-top: 15px;
}
.course-banner-menu05--contents ul{
    width: 100%;
    max-width: 160px;
    text-align: left;
	margin-top: 4rem;
}
.course-banner-menu05--contents ul li{
    width: 100%;
    height: 40px;
    line-height: 40px;
    border: 1px solid #ea2127;
    text-align: left;
    margin-bottom: 10px;
}
.course-banner-menu05--contents ul li a{
    font-size: 1.5rem;
    font-weight: 600;
    display: flex;
    justify-content: space-between;
    padding-left: 10px;
    color: #000;
}
.course-banner-menu05--contents ul li a>span{
    font-size: 1.5rem;
    font-weight: 600;
    color: #ea2127;
    padding-right: 10px;
}

.main__course-banner-menu06{
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    position: absolute;
    top: 30px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    z-index: 50;
}
.course-banner-menu06--contents{
    width: 100%;
    max-width: 500px;
    margin: 0 auto 0 0;
}
.course-banner-menu06--contents h3{
    font-size: 2.5rem;
    font-weight: 600;
    color: #ea2127;
    margin-bottom: 30px;
}
.course-banner-menu06--contents div{
    width: 100%;
    max-width: 140px;
    text-align: left;
}
.course-banner-menu06--contents p{
    font-size: 1.5rem;
    font-weight: 600;
    color: #ea2127;
    margin-bottom: 25px;
}
.course-banner-menu06--contents ul{
    width: 100%;
    max-width: 160px;
    text-align: left;
    margin-top: 30px;
}
.course-banner-menu06--contents ul li{
    width: 100%;
    height: 40px;
    line-height: 40px;
    border: 1px solid #ea2127;
    text-align: left;
    margin-bottom: 10px;
}
.course-banner-menu06--contents ul li a{
    font-size: 1.5rem;
    font-weight: 600;
    display: flex;
    justify-content: space-between;
    padding-left: 10px;
    color: #000;
}
.course-banner-menu06--contents ul li a>span{
    font-size: 1.5rem;
    font-weight: 600;
    color: #ea2127;
    padding-right: 10px;
}



.main__course-banner--wrap ul li>a{
    position: relative;
}

.main__course-banner--wrap ul li{
    position: relative;
    width: 100%;
    z-index: 99;
}
.main__course-banner--wrap ul li::before{
    width: 0%;
    height: 100%;
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    transition: .7s
}
.main__course-banner--wrap ul li:hover::before{
    width: 100%;
    background-color:#ea2127; 
}
.main__course-banner--wrap ul li:hover a,
.main__course-banner--wrap ul li:hover a>span{
    color: #fff;
}





.main__video{
    width: 100%;
    max-width: 1200px;
    margin: 70px auto;
}

.main__video-text{
    width: 100%;
    height: 160px;
    line-height: 160px;
}
.fa-play-circle{
    font-size: 50px;
    padding-right: 20px;
    padding-top: 5px;
    transition: 0.7s;
}
.main__video-text:hover>.fa-play-circle {
     transform: rotateX(360deg);
}



.main__facility {
    width: 100%;
    max-width: 1200px;
    margin: 50px auto 50px;
}
.main__facility h2,
.main__service h2,
.main__school-other h2 {
    font-size: 30px;
    text-align: left;
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 700;
    color: #ea2127;
    padding-left: 20px;
    margin-bottom: 20px;
}
.main__service--h2{
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}
.main__school-other--h2{
    width: 100%;
    max-width: 1200px;
    margin:  0 auto 0 0;
}
.main__facility h3 {
    font-size: 19px;
    text-align: left;
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 700;
    color: #1d1d1d;
    padding-left: 20px;
    margin-bottom: 20px;
}
.main__facility--wrap,
.main__service--wrap,
.main__school-other--wrap {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}
.main__service--wrap{
    margin-top: 40px;
}
.main__facility--sugamo,
.main__facility--chofu {
    width: 100%;
    max-width: 580px;
    margin: 0 auto;
    text-align: center;
}
.main__facility--sugamo>a,
.main__facility--chofu>a {
    font-size: 19px;
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 600;
}
.main__facility--sugamo-img,
.main__facility--chofu-img {
    width: 100%;
    max-width: 580px;
    margin: 0 auto 10px;
    text-align:center;
    position: relative;
    overflow: hidden;
}
.sugamo-img,
.sugamo-img img,
.chofu-img,
.chofu-img img{
    width: 100%;
    max-width: 580px;
    margin: 0 auto;
    transition: 0.7s;
}

.sugamo-img.expansion img,
.chofu-img.expansion img {
    transform:scale(1.2,1.2);
    overflow: hidden;
}
.sugamo-title {
    width: 100%;
    max-width: 445px;
    margin: 0 auto;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    z-index: 30;
}
.chofu-title{
    width: 100%;
    max-width: 287px;
    margin: 0 auto;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    z-index: 30;
}
.sugamo-title img,
.chofu-title img{
    width: 100%;
}

.main__facility--textbox{
    width: 100%;
    max-width: 318px;
    margin: 10px auto 0;
    text-align: left;
}
.main__facility--textbox a{
    font-size: 16px;
    word-wrap: break-word;
}

.main__service{
    width: 100%;
    margin: 0 auto6;
    background-color:rgba(238,225,208,0.30);
    padding: 50px 0;
}
.main__service--massage-img,
.main__service--restaurant-img,
.main__service--shop-img{
    width: 100%;
    max-width: 380px;
    margin: 0 auto 10px;
    text-align:center;
    position: relative;
    overflow: hidden;
} 

.main__service--massage,
.main__service--restaurant,
.main__service--shop {
    width: 100%;
    max-width: 380px;
    margin: 0 auto;
    text-align:center; 
}
.main__service--massage-img img,
.main__service--restaurant-img img,
.main__service--shop-img img{
    width: 100%;
    transition: 0.7s;
}
.main__service--massage-img.expansion img,
.main__service--restaurant-img.expansion img,
.main__service--shop-img.expansion img{
    transform:scale(1.2,1.2);
    overflow: hidden;
}
.main__service--massage a,
.main__service--restaurant a,
.main__service--shop a {
    font-size: 19px;
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 600;
}

.main__service--textbox {
    width: 100%;
    max-width: 340px;
    margin: 10px auto 0;
    text-align: left;
}
.main__service--textbox a{
    font-size: 16px;
    word-wrap: break-word;
    font-weight: 400;
}

.main__school-other{
    width: 100%;
    max-width: 1200px;
    margin: 50px auto;
    text-align: left;
}
.main__school-other--tournament,
.main__school-other--session{
    width: 100%;
    max-width: 584px;
    overflow: hidden;
    text-align: center;
}

.main__school--tournament-img,
.main__school--session-img{
    width: 100%;
    margin-bottom: 10px;
    overflow: hidden;
}
.main__school--tournament-img img,
.main__school--session-img img{
     transition: 0.7s;
}
.main__school--tournament-img.expansion img,
.main__school--session-img.expansion img{
    transform:scale(1.2,1.2);
    overflow: hidden;
}
.main__school-other--tournament a,
.main__school-other--session a{
    font-size: 19px;
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 600;
}
.main__school-other--textbox{
    width: 100%;
    max-width: 542px;
    margin: 10px auto 0;
    text-align: left;
}
.main__school-other--textbox a{
    font-size: 16px;
    word-wrap: break-word;
    font-weight: 400;
}



/*========= 無限ループ横スクロール　スライドショーCSS ==========*/
.main__firstview--slideshow-wrap {
    display: flex;
    align-items: center;
    overflow: hidden;
    margin-bottom: 5rem;
    position: relative;
}
.main__firstview--slideshow {
    display: flex;
    padding: 0;
}
.main__firstview--slideshow li,.main__firstview--slideshow li img {
    width:250px;
}
.main__firstview--slideshow li{
    margin: 0 5px;
}

.main__firstview--slideshow {
    display: flex;
    animation: loop-slide 50s infinite linear 1s both;
}
@keyframes loop-slide {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}

/*==================================================================*/
@media screen and ( min-width:1921px ){
    .main__course-banner-menu01,
    .main__course-banner-menu02,
    .main__course-banner-menu03,
    .main__course-banner-menu04,
    .main__course-banner-menu05,
    .main__course-banner-menu06 {
        max-width: 1300px;
    }
    .course-banner-menu01--contents,
    .course-banner-menu02--contents,
    .course-banner-menu03--contents,
    .course-banner-menu04--contents,
    .course-banner-menu05--contents,
    .course-banner-menu06--contents {
        transform: scale(1.2);
    }
}
/*==================================================================*/

@media screen and ( max-width:1800px ){
    .main__course-banner-menu01,
    .main__course-banner-menu02,
    .main__course-banner-menu03,
    .main__course-banner-menu04,
    .main__course-banner-menu05 {
        transform: scale(0.9);
        left: 10%;
        top: 0px;
    }
    .main__course-banner-menu06 {
        transform: scale(0.9);
        left: 10%;
        top: 10px;
    }
}
@media screen and ( max-width:1600px ){
    .main__course-banner-menu01,
    .main__course-banner-menu04 {
        transform: scale(0.85);
        top: -10px;
    }
    .main__course-banner-menu02,
    .main__course-banner-menu03,
    .main__course-banner-menu05 {
        transform: scale(0.85);
        top: -20px;
    }
    .main__course-banner-menu06 {
        transform: scale(0.85);
        top: 0;
    }
}
@media screen and ( max-width:1520px ){
    .main__course-banner-menu01,
    .main__course-banner-menu04 {
        transform: scale(0.75);
        top: -25px;
        left: 5%;
    }
    .main__course-banner-menu02,
    .main__course-banner-menu03,
    .main__course-banner-menu05 {
        transform: scale(0.75);
        top: -40px;
        left: 5%;
    }
    .main__course-banner-menu06 {
        transform: scale(0.75);
        top: -5px;
        left: 5%;
    }
    
    .main__news--important {
        width: 100%;
        max-width: 970px;
    }
    .main__news--list-wrap {
        width: 100%;
        max-width: 970px;
        display: block; 
    }
    .main__news--list-wrap h3 {
        font-size: 2rem;
        margin-bottom: 1rem;
        width: 100%;
    }
}
@media screen and ( max-width:1400px ){
    .main__course-banner-menu01,
    .main__course-banner-menu04 {
        transform: scale(0.75);
        top: -35px;
        left: 5%;
    }
    .main__course-banner-menu02,
    .main__course-banner-menu03,
    .main__course-banner-menu05 {
        transform: scale(0.75);
        top: -50px;
        left: 5%;
    }
    .main__course-banner-menu06 {
        transform: scale(0.75);
        top: -15px;
        left: 5%;
    }
}
@media screen and ( max-width:1350px ){
    .main__course-banner-menu01,
    .main__course-banner-menu04 {
        transform: scale(0.75);
        top: -35px;
        left:0;
    }
    .main__course-banner-menu02,
    .main__course-banner-menu03,
    .main__course-banner-menu05 {
        transform: scale(0.75);
        top: -40px;
        left:0;
    }
    .main__course-banner-menu06 {
        transform: scale(0.75);
        top: -5px;
        left:0;
    }
    .course-banner-menu02--contents {
        max-width: 520px;
    }
    .course-banner-menu02--contents h3 {
        margin-bottom: 15px;
    }
    .course-banner-menu02--contents nav {
        max-width: 520px;
        margin-top: 3rem;
    }
    .course-banner-menu02--contents ul {
        justify-content:flex-start;
    }
    .course-banner-menu02--contents ul li {
        margin-right: 7px;
    }
}
@media screen and ( max-width:1240px ){
    .main__course-banner-menu01,
    .main__course-banner-menu04 {
        transform: scale(0.7);
        top: -45px;
        left:-100px;
    }
    .main__course-banner-menu02,
    .main__course-banner-menu03,
    .main__course-banner-menu05 {
        transform: scale(0.7);
        top: -60px;
        left:-100px;
    }
    .main__course-banner-menu06 {
        transform: scale(0.7);
        top: -15px;
        left:-100px;
    }
}
@media screen and ( max-width:1100px ){
    
    
    .main__course-banner-menu01,
    .main__course-banner-menu04 {
        transform: scale(0.6);
        top: -55px;
        left:-80px;
    }
    .main__course-banner-menu02,
    .main__course-banner-menu03,
    .main__course-banner-menu05 {
        transform: scale(0.6);
        top: -75px;
        left:-80px;
    }
    .main__course-banner-menu06 {
        transform: scale(0.6);
        top: -20px;
        left:-80px;
    }
    
    .course-banner-menu02--contents h3 {
        margin-bottom: 25px;
    }
    
  
    .main__firstview--topimg{
        margin-bottom: 320px;
    }
    .main__firstview--topimg img {
        margin-bottom: 350px;
    }
    
    .firstview__logo, 
    .firstview__logo img {
        left: 30px;
    }
    .firstview__copy {
        position: absolute;
        top: 330px;
        left: 50px;
        width: 100%;
        max-width: 700px;
    }

    .firstview__heading h2 {
        left: 70px;
    }
    .firstview__heading p {
        left: 65px;
    }
    
    .news{
        margin: 50px auto;
    }
    .main__news--important{
        max-width: 850px;
    }
    
     .main__news--important {
        width: 100%;
        max-width: 750px;
    }
    .main__news--list-wrap{
        max-width: 750px;
    }
    .main__news--list-wrap ul {
        max-width: 750px;
    }
    
    .main__youwakai-omoi img {
        height: 250px;
    }
    
    .main__guidance--member.fade::before {
        width: 84%;
    }
    
    .main__video{
        max-width: 750px;
    }
    .main__video img{
        vertical-align:baseline;
    }
    .main__facility,
    .main__school-other {
        max-width: 900px;
        padding: 0 10px;
    }
    .main__service--h2,
    .main__service--wrap{
        max-width: 900px;
    }
    
    .main__facility--wrap{
        max-width: 900px;
        margin-top: 20px;
    }
    .main__facility h2, 
    .main__service h2,
    .main__school-other h2{
        padding-left: 0;
        margin: 0 auto;
        text-align: center;
        font-size: 2.8rem;
    }
    .main__facility h3{
        padding-left: 0;
        margin: 0 auto;
    }
    .main__facility--sugamo, .main__facility--chofu {
        max-width: 430px;
        margin: 0;
    }
    .sugamo-title {
        max-width: 380px;
    }
    .chofu-title {
        max-width: 260px;
    }
    
    .main__service--wrap {
        max-width: 900px;
        margin-top: 40px;
    }
    
    .main__service--massage,
    .main__service--restaurant,
    .main__service--shop {
        max-width: 290px;
    }
    .main__service--massage a,
    .main__service--restaurant a, 
    .main__service--shop a {
        font-size: 1.6rem;
    }
    
    .main__school-other--tournament, .main__school-other--session {
        max-width: 430px;
    }
    
    .main__school-other--h2 {
        width: 100%;
        max-width: 730px;
        margin: 0 auto;
    }
    .main__school-other--h2 h2{
        text-align: left;
    }
    
    
}
@media screen and ( max-width:1000px ) {
    .course-banner-menu02--contents h3 {
        margin-bottom: 15px;
    }
    .course-banner-menu02--contents nav {
        margin-top: 1.5rem;
    }
}
/*iPad用*/
@media screen and ( max-width:920px ){
    
    .sp-920-slider {
        display: inline-block!important;
    }
    .pc-920-slider {
        display: none!important;
    }
    
    .main__firstview--participant{
        width: 300px;
    }
    .main__firstview--participant02{
        width: 300px;
        right: auto;
        left: -300px;
        bottom: 100px;
    }
    .main__firstview--participant02 a{
        text-align: left; 
        padding-left: 14px;
		font-size: 1.7rem;
		line-height: 4rem;
    }
    .main__firstview--participant02.move{
        left: 0;
        display: block;
    }
    .main__firstview--participant02.move.fadeout {
        left: -600px;
    }
    .firstview__heading p{
        width: 100%;
        max-width:600px;
    }
    
    /*================== コース一覧  mobile CSS ==================*/
    
    .main__course-list{
        display: none;
    }
    
    .sports-club--wrap ul ,
    .golf--list--wrap ul{
        display: flex;
        width: 100%;
        max-width: 740px;
    }
    
    .main__course--article-sp{
        margin-bottom: 20px;
    }
    .main__course--list h2{
        font-size: 2.2rem;
        color: #ea2127;
        font-weight: 700;
        padding: 0 40px;
        margin: 0 auto 20px;
    }
    
    .main__course--list-sp{
        width: 100%;
        margin: 0 auto;
    }
    .main__course-btn {
        width: 100%;
        margin: 0 auto;
        position: relative;
    }
    .sports-club-title,
    .adult-school-title,
    .kids-school-title,
    .sports-club-title,
    .fitness-support-title{
        position: absolute;
        bottom: 0;
        left: 0
    }
    .sports-club-1mg,
    .adult-school-img,
    .kids-school-img,
    .sports-club-img,
    .fitness-support-img{
        width: 100%;
        margin: 0 auto;
    }
    
    .main__course--contents nav{
        width: 100%;
        margin: 15px auto 0;
        padding: 0 20px;
        display: none;
    }
    .main__course--contents nav>h3{
        font-size: 1.8rem;
        font-weight: 600;
        color: #ea2127;
    }
    .main__course--contents nav li{
        width: 362px;
        height: 30px;
        line-height: 27px;
        border: solid 1px #ea2127;
        margin: 15px auto 5px 0;
    }
    .main__course--contents nav li a{
        font-size: 1.2rem;
        font-weight: 600;
        padding-left: 10px;
        padding-right: 10px;
        display: flex;
        justify-content: space-between;
    }
    .main__course--contents nav li a>span{
        color: #ea2127;
        font-size: 1.3rem;
    }
    
    .adult-school--list--wrap{
        width: 100%;
        max-width: 750px;
        margin:  0 auto 0 0;
        display: flex;
    }
    .adult-school--list--wrap p{
        font-size: 1.5rem;
        font-weight: 600;
        color: #ea2127;
        margin-top: 17px;
        margin-right: 1rem;
        margin-left: 2rem;
    }
    .adult-school--list--wrap ul li{
        width: 180px;
    }
    .banner-menu02--contents--list__left{
        width: 100%;
        max-width: 380px;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }
    .adult-school--list__right li:nth-child(3){
        opacity: 0;
        pointer-events: none;
    }
    
    .kids-school--list--wrap{
        width: 100%;
        max-width: 750px;
        display: flex;
    }
    .kids-school--list--wrap ul{
        width: 100%;
    }
    .kids-school--list--wrap ul:nth-of-type(1){
        width: 100%;
        max-width: 390px;
        display: flex;
        flex-wrap: wrap;
    }
     .kids-school--list--wrap ul:nth-of-type(1) li{
        margin-right: 1rem;
    }
    .kids-school--list--wrap ul:nth-of-type(2){
        width: 100%;
        max-width: 200px;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }
    .kids-school--list--wrap ul li{
        width: 180px;
    }
    .kids-school--list--wrap p{
        font-size: 1.5rem;
        font-weight: 600;
        color: #ea2127;
        margin-top: 17px;
        margin-right: 1rem;
        margin-left: 2rem;
    }
    .course-list__font-size{
        font-size: 1.2rem!important;
    }
    
    .golf--list--wrap ul li{
        width: 260px;
    }
    .fitness-support--wrap ul li{
        width: 260px;
    }
    

    /*================== コース一覧  mobile CSS end ==================*/
    
    .main__guidance--beginner.fade::before{
        width: 92%;
    }
    .main__guidance--member.fade::before {
        width: 100%;
    }
    
    .main__facility--textbox {
        max-width: 330px;
    }
    
    .main__facility {
        padding: 0px 15px;
    }
    .main__facility h2, 
    .main__service h2, 
    .main__school-other h2 {
        margin: 0 auto 1rem;
        text-align: left;
        font-size: 1.8rem;
    }
    
    .main__facility--sugamo {
        margin: 0 auto;
        margin-bottom: 3rem;
    }
    .main__facility--chofu {
        margin: 0 auto;
    }
    
    .main__service--h2{
        width: 100%;
        max-width: 750px;
    }
    .main__service--wrap {
        margin-top: 10px;
    }
    .main__service--massage-img, 
    .main__service--restaurant-img, 
    .main__service--shop-img {
        max-width: 340px;
    }
    .main__service--textbox {
        max-width: 320px;
        margin: 5px auto 20px;
    }
    
    .main__school-other--h2 {
        padding: 0px;
    }
    
    .main__school-other--textbox {
        margin: 10px auto 40px;
    }
    
    .main__school-other--tournament, 
    .main__school-other--session {
        margin: 0 auto;
    }
    
    
}
@media screen and ( max-width:820px ){
    /*.course-banner-menu01--contents,
    .course-banner-menu02--contents,
    .course-banner-menu03--contents,
    .course-banner-menu04--contents,
    .course-banner-menu05--contents,
    .course-banner-menu06--contents {
        transform: scale(0.49);
    }
    .main__course-banner-menu01,
    .main__course-banner-menu02,
    .main__course-banner-menu03,
    .main__course-banner-menu04,
    .main__course-banner-menu05,
    .main__course-banner-menu06 {
        left: 40%;
    }
    
    .course-banner-menu02--contents h3 {
        margin-bottom: 5px;
    }
    .course-banner-menu02--contents div {
        margin-bottom: 5px;
    }
    .course-banner-menu02--contents p {
        margin-bottom: 5px;
    }
    .main__course-banner-menu01 {
        top:50%;
    }
    .main__course-banner-menu03 {
        top: 50%;
    }
    .main__course-banner-menu05 {
        top: 52%;
    }
    .main__course-banner-menu06{
        top: 35%;
    }*/
    
    .firstview__copy {
        width: 100%;
    }
    
    .main__video {
        margin: 70px auto 0;
    }
    
    @keyframes PageAnime {
        0% {
            transform-origin:left;
            transform:scaleX(0);
            transform:translate(100%, 0) skew(330deg, 0deg);
        }
        100% {
            transform-origin:left;
            transform:translate(-120.5%, 0) skew(330deg, 0deg);
        }
    }
    
    .main__news--important {
        max-width: 740px;
    }
    
    .main__facility{
        padding: 0 10px;
        width: 100%;
        max-width: 750px;
    }
    .main__facility--wrap {
        max-width: 750px;
        margin-top: 20px;
    }
    .main__facility--sugamo, 
    .main__facility--chofu {
        max-width: 350px;
    }
      .main__facility--sugamo, 
    .main__facility--chofu {
        margin: 0;
    }
    
    .main__service--wrap {
        max-width: 770px;
    }
    .main__service--massage-img, 
    .main__service--restaurant-img, 
    .main__service--shop-img {
        max-width: 230px;
    }
    .main__service--textbox {
        max-width: 230px;
    }
    
    .main__school-other--wrap{
        max-width: 750px;
        margin: 0;
        justify-content: space-between;
    }
    .main__school-other--tournament,
    .main__school-other--session {
        max-width: 350px;
    }
}
@media screen and ( max-width:750px ){
    .main__firstview--participant02{
        width: 210px;
    }
  
    
    .main__facility {
        padding: 0 12px;
    }
    
    .main__service--massage-img, 
    .main__service--restaurant-img, 
    .main__service--shop-img {
        max-width: 380px;
        margin: 0;
    }
    .main__service--textbox {
        max-width: 380px;
        margin: 0;
    }

    .main__facility--sugamo, 
    .main__facility--chofu {
        margin: 0 auto;
    }
    
    .main__service--h2 {
        padding: 0 12px;
    }
    
    .main__facility h2,
    .main__facility h3 {
        padding-left: 10px;
    }
    /*================== コース一覧  mobile CSS ==================*/
    
    .main__course-list{
        display: none;
    }
    
    .sports-club--wrap ul,
    .golf--list--wrap ul {
        display: block;
    }
    .main__course--article-sp{
        margin-bottom: 20px;
    }
    .main__course--list h2{
        font-size: 2.2rem;
        color: #ea2127;
        font-weight: 700;
        padding: 0 10px;
        margin: 0 auto 20px;
    }
    
    .main__course--list-sp{
        width: 100%;
        margin: 0 auto;
    }
    .main__course-btn {
        width: 100%;
        margin: 0 auto;
        position: relative;
    }
    .sports-club-title,
    .adult-school-title,
    .kids-school-title,
    .sports-club-title,
    .fitness-support-title{
        position: absolute;
        bottom: 0;
        left: 0
    }
    .sports-club-1mg,
    .adult-school-img,
    .kids-school-img,
    .sports-club-img,
    .fitness-support-img{
        width: 100%;
        margin: 0 auto;
    }
    
    .main__course--contents nav{
        width: 100%;
        margin: 15px auto 0;
        padding: 0 10px;
        display: none;
    }
    .main__course--contents nav>h3{
        font-size: 1.8rem;
        font-weight: 600;
        color: #ea2127;
    }
    .main__course--contents nav li{
        width: 350px;
        height: 30px;
        line-height: 27px;
        border: solid 1px #ea2127;
        margin: 15px auto 5px 0;
    }
    .main__course--contents nav li a{
        font-size: 1.1rem;
        font-weight: 600;
        padding-left: 10px;
        padding-right: 10px;
        display: flex;
        justify-content: space-between;
    }
    .main__course--contents nav li a>span{
        color: #ea2127;
        font-size: 1.3rem;
    }
    
    .adult-school--list--wrap{
        width: 100%;
        max-width: 350px;
        margin:  0 auto 0 0;
        display: block;
    }
    .adult-school--list--wrap p{
        font-size: 1.5rem;
        font-weight: 600;
        color: #ea2127;
        margin: 0;
        margin-top: 10px;
    }
    .adult-school--list--wrap ul li{
        width: 160px;
    }
    .banner-menu02--contents--list__left{
        width: 100%;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }
    .adult-school--list__right li:nth-child(3){
        opacity: 0;
        pointer-events: none;
    }
    
    .kids-school--list--wrap{
        width: 100%;
        max-width: 350px;
        display: block;
    }
    .kids-school--list--wrap ul{
        width: 100%;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }
    .kids-school--list--wrap ul li{
        width: 157px;
    }
    .kids-school--list--wrap p{
        font-size: 1.5rem;
        font-weight: 600;
        color: #ea2127;
        margin: 0;
        margin-top: 10px;
    }
    
    .course-list__font-size{
        font-size: 1.2rem!important;
    }
    
    .golf--list--wrap ul li{
        width: 150px;
    }
    .fitness-support--wrap ul li{
        width: 150px;
    }
    
    /*================== コース一覧  mobile CSS end ==================*/
       .chofu-img img {
	margin-top: 2rem;
}
   .sugamo-title {
        max-width: 300px;
    }
    .chofu-title {
        max-width: 200px;
    }
   
    
}
@media screen and ( max-width:620px ){
    @keyframes PageAnime {
        0% {
            transform-origin:left;
            transform:scaleX(0);
            transform:translate(100%, 0) skew(330deg, 0deg);
        }
        100% {
            transform-origin:left;
            transform:translate(-146.5%, 0) skew(330deg, 0deg);
        }
    }
    
    .main__firstview--topimg {
        margin-bottom: 200px;
    }
}
@media screen and ( max-width:430px ){
    .pc,
    .main__course-list {
        display: none;
    }
    
    @keyframes PageAnime {
        0% {
            transform-origin:left;
            transform:scaleX(0);
            transform:translate(100%, 0) skew(330deg, 0deg);
        }
        100% {
            transform-origin:left;
            transform:translate(-146.5%, 0) skew(330deg, 0deg);
        }
    }
    .firstview__logo, .firstview__logo img {
        max-width: 290px;
        top: 10px;
        left: 10px;
    }
    .firstview__copy h2 {
        font-size: 3.5rem;
    }
    .firstview__copy {
        top: 130px;
        left: 30px;
        width: 100%;
        max-width: 290px;
    }
    
    .firstview__heading h2 img {
        width: 100%;
        max-width: 250px;
    }
    
    .firstview__heading p {
        left: 30px;
        top: 400px;
        font-size: 1.5rem;
        max-width: fit-content;
    }
    
    .main__firstview--topimg, 
    .main__firstview--topimg img {
        height: 300px;
    }
    
    
    
    .firstview__heading h2 {
        left: 35px;
        top: 310px;
        width: auto;
    }
    
    .main__facility--wrap{
        display: block;
    }
    
    .main__service--wrap {
        display: block;
    }
    .main__service--massage, 
    .main__service--restaurant, 
    .main__service--shop {
        max-width: 380px;
        padding: 10px;
    }
    .main__school-other--wrap {
        display: block;
        padding: 10px;
    }
    
    .main__news {
        padding: 10px;
    }
    .main__news--important {
        max-width: 750px;
        padding: 15px 0;
        justify-content: space-between;
        align-items: center;
    }
    
    .main__news--important-text {
        font-size: 1.5rem;
        line-height: 2.5rem;
    }
    .main__news--important-mark {
        font-size: 2rem;
        width: 48px;
        height: 28px;
        line-height: 28px;
        border-radius: 20px;
        margin: 0px 10px 0;
    }

    .main__news--list-wrap {
        display: block;
    }
    .main__news--list-wrap li {
        max-width: 750px;
        display: block;
        padding: 20px 15px;
    }
    .main__news--list-wrap li>a{
        margin-left: 0;
    }
    .main__news--list-wrap h3 {
        margin: 0 auto;
        display: block;
        max-width: 750px;
        width: 100%;
        padding: 0 10px 5px;
        font-size: 2.3rem;
    }
    .main__news--list-wrap li:nth-child(6) {
        text-align: right;
    }
    
    .main__youwakai-omoi img {
        height: 180px;
    }
    .main__youwakai-omoi__text {
        font-size: 3.5rem;
        display: block;
        width: 100%;
        max-width: 350px;
    }
    
    .main__firstview--topimg {
        margin-bottom: 200px;
    }
    .main__firstview--topimg-wrap {
        height: 500px;
    }
    

}

@media screen and ( max-width:390px ){
    .main__news--important-mark {
        width: 51px;
    }
     @keyframes PageAnime {
        0% {
            transform-origin:left;
            transform:scaleX(0);
            transform:translate(100%, 0) skew(330deg, 0deg);
        }
        100% {
            transform-origin:left;
            transform:translate(-143.5%, 0) skew(330deg, 0deg);
        }
    }
    .main__firstview--topimg {
        margin-bottom: 200px;
    }
}

@media screen and ( max-width:375px ){

     @keyframes PageAnime {
        0% {
            transform-origin:left;
            transform:scaleX(0);
            transform:translate(100%, 0) skew(330deg, 0deg);
        }
        100% {
            transform-origin:left;
            transform:translate(-124.5%, 0) skew(330deg, 0deg);
        }
    }
}

@media screen and ( max-width:360px ){
     @keyframes PageAnime {
        0% {
            transform-origin:left;
            transform:scaleX(0);
            transform:translate(100%, 0) skew(330deg, 0deg);
        }
        100% {
            transform-origin:left;
            transform:translate(-134.5%, 0) skew(330deg, 0deg);
        }
    }
}