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

/*----------------------------------------------------------------------------
***                                                              mainsection
----------------------------------------------------------------------------*/

/*--- ファーストビュー ---*/
#mainView{}
#mainView *{margin:0; padding:0;}
#mainView .mainViewInner {max-width:1200px;margin:0 auto;position: relative;}
#slideView{max-width:992px; width:100%;}
#catchcopyView{width:100%;padding: 20px 0;}
#newsBox h2{ text-align: center;}
#newsBox{position:absolute;left: 490px;top: 237px;background: rgba(255,255,255,0.93);width: 485px;height: 165px;padding: 1em 1em;box-shadow: 3px 3px 6px 0px rgba(0,0,0,0.5);z-index: 1;}
#newsBox .ttlBox{width: 75px;padding-right: 5px;}
#newsBox .contentsBox{max-width: 380px;padding-left: 15px;border-left: 2px solid #ccc;height: 130px; overflow: auto;}
#newsBox .newsSlide {height:100%;}
#newsBox .txtDate{color:#ce5a5c;margin:0 0.5em 0 0;font-size: 13px; line-height:  1.2em;}
#newsBox .txtMidashi{color:#231815; margin:0 0 0 0;font-size: 15px;}
#newsBox .txtContents{font-size:12px; margin-bottom: 3px; line-height:  1.2em;}
#newsBox .slick-dots{display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;top: 0;right: -1.2em;bottom: 0;width: auto;height: 100%;}
#newsBox .slick-dots li button:before{color:transparent;border:2px solid #ce5a5c;border-radius:50%;width: 1em;height: 1em;font-size: 8px;}
#newsBox .slick-dots li.slick-active button:before{background:#ce5a5c;}
#newsBox .slick-dots li button:hover:before,
#newsBox .slick-dots li button:focus:before{background:#ce5a5c;}

/*--- 事業一覧 ---*/
#jigyouBox  .boxInner{padding:0 0 0;}
#jigyouBox .secBox{width: 240px;height: 240px;}
#jigyouBox .secBox > .sectionInner{position:relative;  max-width: 1200px; height: 100%; margin: 0 auto; padding: 1em 1em 1em;}
#jigyouBox .secBox > .sectionInner h2{position:relative; z-index:1;}
#jigyouBox .secBox .contentsBox{position:absolute;top:0;left:0;width:100%;height:100%;padding: 6em 1em 1em;overflow: hidden;-webkit-transition:all .6s ease-in-out;transition:all .6s ease-in-out;}

#jigyouBox .bgFront{cursor: pointer;}
#jigyouBox .bgFront .sectionInner:before{content:""; position:absolute; right:1em; bottom:1em; display:block; width:2em; height:2em; border-right:2px solid #fff; border-bottom:2px solid #fff;}
#jigyouBox .bgFront > .sectionInner{background:rgba(255,255,255,0);}
#jigyouBox .bgFront .contentsBox{opacity:0;}
/*#jigyouBox .bgFront .contentsBox:before{content:"";position:absolute;right:1em;top:1em;display:block;width:0em;height:0em;border: 1em solid transparent;border-top-color:#fff;border-right-color:#fff;}*/
#jigyouBox .bgFront:hover .contentsBox{opacity:1; filter: brightness(110%) contrast(110%) opacity(0.9);}

#jigyouBox .bgBack{cursor: pointer;}
#jigyouBox .bgBack .sectionInner:before{content:""; position:absolute; right:1em; bottom:1em; display:block; width:2em; height:2em; border-right:2px solid #fff; border-bottom:2px solid #fff;}
/*#jigyouBox .bgBack .contentsBox:before{content:"";position:absolute;right:1em;top:1em;display:block;width:0em;height:0em;border: 1em solid transparent;border-top-color:#fff;border-right-color:#fff;}*/
#jigyouBox .bgBack:hover .contentsBox{opacity:1; filter: brightness(110%) contrast(110%) opacity(0.9);}

#jigyouBox .topicsList{height:100%; overflow:hidden;}
#jigyouBox .topicsList li{width:100%;}
#jigyouBox .topicsList .txtTtl{font-size:16px;}
#jigyouBox .topicsList .txtContents{height: auto;font-size: 14px;line-height: 1.2; display: -webkit-box; display: -ms-flexbox; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-line-clamp: 6; text-overflow: ellipsis;}

.box .secBox *{color:#595757;}
.bgAnimation *{padding: 0!important;}
.bgAnimation .loopBox{margin:0;padding:0;display:-webkit-box;display:-ms-flexbox;display:flex;height: 100%;}
.bgAnimation .loopBox img:first-child{animation-name: bgLoop1;animation-duration: 10s;animation-delay: -5s;animation-timing-function:linear;animation-iteration-count: infinite;max-width: none;width: auto;height: 100%;}
.bgAnimation .loopBox img:last-child{animation-name: bgLoop2; animation-duration: 10s;animation-delay: 0s; animation-timing-function:linear; animation-iteration-count: infinite; max-width: none;width: auto;height: 100%;}

@keyframes bgLoop1 {
    0% {
        transform:translateX(100%);
    }
    100% {
        transform:translateX(-100%);
    }
}
@keyframes bgLoop2 {
    0% {
        transform:translateX(0%);
    }
    100% {
        transform:translateX(-200%);
    }
}

.bgVideo *{padding: 0!important;}
.bgVideo .videoBox{background:#000;}
.bgVideo .videoBox a{position:relative; display:flex; justify-content:center; align-items:center; width:100%; height:100%;}
.bgVideo .videoBox a:before{content:"";display:block;width:100%;height:100%;background: rgba(0,0,0,0.2);background:url(/images/renewal2020/movie/bk3.png) center /9px 9px,rgba(255,255,255,0.7);position:absolute;top:0;left:0;opacity: 0.4;}
.bgVideo .videoBox video{/* object-fit: cover; */width: auto;height: 100%;}


/*- 英会話スクール事業 -*/
#novaSec {background:url(/images/renewal2020/bg_nova.jpg) no-repeat center center / cover;}
#novaSec .contentsBox {background:#34b3cc;}
#novaSec *{color:#fff;}

/*- 教育事業 -*/
#studySec {background:url(/images/renewal2020/bg_study.jpg) no-repeat center center / cover;}
#studySec .contentsBox {background: #d3ef50;}

/*- 留学事業 -*/
#abroadSec {background:url(/images/renewal2020/bg_abroad.jpg) no-repeat center center / cover;}
#abroadSec .contentsBox {background: #bb3945;}
#abroadSec *{color:#fff;}

/*- オンライン英会話事業 -*/
#onlineSec {background:url(/images/renewal2020/bg_online.jpg) no-repeat center center / cover;}
#onlineSec .contentsBox {background: #1bd3a0;}
#onlineSec *{color:#fff;}

/*- 法人向けサービス事業 -*/
#btobSec {background:url(/images/renewal2020/bg_btob.jpg) no-repeat center center / cover;}
#btobSec .contentsBox {background: #bc76ce;}

/*- イベント事業 -*/
#eventsSec {background:url(/images/renewal2020/bg_events.jpg) no-repeat center center / cover;}
#eventsSec .contentsBox {background: #ff7bac;}
#eventsSec *{color:#fff;}

/*- 研修事業 -*/
#trainingSec {background:url(/images/renewal2020/bg_training.jpg) no-repeat center center / cover;}
#trainingSec .contentsBox {background: #5b88db;}
#trainingSec *{color:#fff;}

/*- スポーツ事業 -*/
#sportsSec {background:url(/images/renewal2020/bg_sports.jpg) no-repeat center center / cover;}
#sportsSec .contentsBox {background: #ff8b00;}
#sportsSec *{color:#fff;}

/*- 出版事業 -*/
#bookSec {background:url(/images/renewal2020/bg_book.jpg) no-repeat center center / cover;}
#bookSec .contentsBox {background: #63e238;}

/*- アプリ・コンテンツ事業 -*/
#appSec {background:url(/images/renewal2020/bg_content.jpg) no-repeat center center / cover;}
#appSec .contentsBox {background: #54d1e2;}

/*- オープン情報 -*/
#openSec {background: #ffd829;}
#openSec .contentsBox {background: #ffd829;}

/*- 校舎数 -*/
#schoolNumSec {background:url(/images/renewal2020/bg_schools.jpg) no-repeat center center / cover;}
#schoolNumSec .contentsBox {background: #414d65;}
#schoolNumSec h2{transform: rotate(90deg) translate(-35px, -15px);transform-origin: left;display: block;}
#schoolNumSec h2 .numberBox{font-size: 50px;line-height:1;}
#schoolNumSec h2 .txtBox{font-size: 24px;line-height:1;}
#schoolNumSec *{color:#fff;}

/*- フランチャイズ事業 -*/
#franchiseSec {background:url(/images/renewal2020/bg_franchise.jpg) no-repeat center center / cover;}
#franchiseSec .contentsBox {background: #ffaaa6;}

/*- キャラクター -*/
#characterSec .loopBox img{display:block;}
#characterSec .loopBox img:first-child{animation-duration: 40s;animation-delay: -20s;}
#characterSec .loopBox img:last-child{animation-duration: 40s;animation-delay: 0s;}

/*- ロゴ -*/
#logoSec .loopBox img:first-child{animation-duration: 20s;animation-delay: -10s;}
#logoSec .loopBox img:last-child{animation-duration: 20s;animation-delay: 0s;}

/*- 動画 -*/
#jigyouBox #videoSec{}
#jigyouBox #video02Sec{}


/*--- ポップアップ関連 ---*/
/*- プラグイン部分 -*/
#popupBtnDummy{display:none;}
.mfp-container{background:url('/images/renewal2020/popup/ico_loding4.gif') no-repeat center center;}
.mfp-container.load-stop{background:none;}
.mfp-fade.mfp-bg {opacity: 0;-webkit-transition: all 0.15s ease-out;-moz-transition: all 0.15s ease-out;transition: all 0.15s ease-out;}
.mfp-fade.mfp-bg.mfp-ready {opacity: 0.8;}
.mfp-fade.mfp-bg.mfp-removing {opacity: 0;}
.mfp-fade.mfp-wrap .mfp-content {opacity: 0;-webkit-transition: all 0.15s ease-out;-moz-transition: all 0.15s ease-out;transition: all 0.15s ease-out;}
.mfp-fade.mfp-wrap.mfp-ready .mfp-content {opacity: 1;}
.mfp-fade.mfp-wrap.mfp-removing .mfp-content {opacity: 0;}

/*- ポップアップ対象 -*/
#popBox{width: 1200px; margin: 0 auto; position: relative;}
#popBox .popSecBox{width: 1200px;height: 800px;margin: 0 auto;background: #00a1c9;}
#popBox .mfp-close{background: url(/images/renewal2020/popup/btn_close.png) no-repeat center/cover;color: transparent;position: absolute;top: 0;right: 0;opacity: 1;width: 10vw;height: 10vw;max-width: 89px;max-height: 89px;}