@charset "utf-8";

/*----------------------------------------------------
コンテンツエリア
----------------------------------------------------*/
.Main { display:block; position:relative;
	z-index:300; /* .Main, .FooterOuter HeaderOuter での比較 */ }
.Main__bg { height:100vh; position:fixed;
	z-index:210; }
.Main__bg::after { content:""; display:block; width:100%; height:100vh; background:rgba(0,0,0,.3); position:absolute; top:0; left:0; } /*黒のカバー*/
/*.Main__bg.-video::after { background:rgba(0,0,0,.4); }*/
.Main__body { display:block; position:relative;
	z-index:220; }



/*固有設定*/
/*レンダリング用小さいサイズ*/
.Main__bg.-home { width:100%; height:100vh; position:fixed; top:0; left:0; z-index:201; transform:translate3d(0, 0, 0); /*バグ対策*/ }
.Main__bg.-company { width:100%; height:100vh; position:fixed; top:0; left:0; background:url(/static/img/company/bg_pageheader_small.jpg) center no-repeat #000; background-size:cover; z-index:201; transform:translate3d(0, 0, 0); /*バグ対策*/ }
.Main__bg.-news { width:100%; height:100vh; position:fixed; top:0; left:0; background:url(/static/img/news/bg_pageheader_small.jpg) center no-repeat #000; background-size:cover; z-index:201; transform:translate3d(0, 0, 0); /*バグ対策*/ }
.Main__bg.-schedule { width:100%; height:100vh; position:fixed; top:0; left:0; background:url(/static/img/schedule/bg_pageheader_small.jpg) center no-repeat #000; background-size:cover; z-index:201; transform:translate3d(0, 0, 0); /*バグ対策*/ }
.Main__bg.-library { width:100%; height:100vh; position:fixed; top:0; left:0; background:url(/static/img/library/bg_pageheader_small.jpg) left center no-repeat #000; background-size:cover; z-index:201; transform:translate3d(0, 0, 0); /*バグ対策*/ }
.Main__bg.-work_history { width:100%; height:100vh; position:fixed; top:0; left:0; background:url(/static/img/work_history/bg_pageheader_small.jpg) center no-repeat #000; background-size:cover; z-index:201; transform:translate3d(0, 0, 0); /*バグ対策*/ }
.Main__bg.-staff { width:100%; height:100vh; position:fixed; top:0; left:0; background:url(/static/img/staff/bg_pageheader_small.jpg) center no-repeat #000; background-size:cover; z-index:201; transform:translate3d(0, 0, 0); /*バグ対策*/ }
.Main__bg.-video { width:100%; height:100vh; position:fixed; top:0; left:0; background:url(/static/img/video/bg_pageheader_small.jpg) center no-repeat #000; background-size:cover; z-index:201; transform:translate3d(0, 0, 0); /*バグ対策*/ }
.Main__bg.-special { width:100%; height:100vh; position:fixed; top:0; left:0; background:url(/static/img/special/bg_pageheader_small.jpg) center no-repeat #000; background-size:cover; z-index:201; transform:translate3d(0, 0, 0); /*バグ対策*/ }
.Main__bg.-support { width:100%; height:100vh; position:fixed; top:0; left:0; background:url(/static/img/support/bg_pageheader_small.jpg) left center no-repeat #000; background-size:cover; z-index:201; transform:translate3d(0, 0, 0); /*バグ対策*/ }
.Main__bg.-contact { width:100%; height:100vh; position:fixed; top:0; left:0; background:url(/static/img/contact/bg_pageheader_small.jpg) center no-repeat #000; background-size:cover; z-index:201; transform:translate3d(0, 0, 0); /*バグ対策*/ }

/*レンダリング用大さいサイズ*/
.Main__bg > .inner { opacity:0; }
.Main__bg.-company > .inner { width:100%; height:100vh; background:url(/static/img/company/bg_pageheader.jpg) center no-repeat; background-size:cover; }
.Main__bg.-news > .inner { width:100%; height:100vh; background:url(/static/img/news/bg_pageheader.jpg) center no-repeat; background-size:cover; }
.Main__bg.-schedule > .inner { width:100%; height:100vh; background:url(/static/img/schedule/bg_pageheader.jpg) center no-repeat; background-size:cover; }
.Main__bg.-library > .inner { width:100%; height:100vh; background:url(/static/img/library/bg_pageheader.jpg) left center no-repeat; background-size:cover; }
.Main__bg.-work_history > .inner { width:100%; height:100vh; background:url(/static/img/work_history/bg_pageheader.jpg) center no-repeat; background-size:cover; }
.Main__bg.-staff > .inner { width:100%; height:100vh; background:url(/static/img/staff/bg_pageheader.jpg) center no-repeat; background-size:cover; }
.Main__bg.-video > .inner { width:100%; height:100vh; background:url(/static/img/video/bg_pageheader.jpg) center no-repeat; background-size:cover; }
.Main__bg.-special > .inner { width:100%; height:100vh; background:url(/static/img/special/bg_pageheader.jpg) center no-repeat; background-size:cover; }
.Main__bg.-support > .inner { width:100%; height:100vh; background:url(/static/img/support/bg_pageheader.jpg) left center no-repeat; background-size:cover; }
.Main__bg.-contact > .inner { width:100%; height:100vh; background:url(/static/img/contact/bg_pageheader.jpg) center no-repeat; background-size:cover; }


.Main__bg.-company::after { background:rgba(0,0,0,0); }

@media screen and (max-width:1023px) { /* tablet tablet */
	.Main__bg.-company { background-image:url(/static/img/company/bg_pageheader_sp_small.jpg); }
	.Main__bg.-company > .inner { background-image:url(/static/img/company/bg_pageheader_sp.jpg); }

	.Main__bg.-company { background-position:center; }
	.Main__bg.-company > .inner { background-position:center; }

	.Main__bg.-staff { background-position:left 20% center; }
	.Main__bg.-staff > .inner { background-position:left 20% center; }

	.Main__bg.-video { background-position:right 45% center; }
	.Main__bg.-video > .inner { background-position:right 45% center; }

	.Main__bg.-support { background-position:left 45% center; }
	.Main__bg.-support > .inner { background-position:left 45% center; }

	.Main__bg.-contact { background-position:right 30% center; }
	.Main__bg.-contact > .inner { background-position:right 30% center; }
}




/*----------------------------------------------------
.PageHeader
----------------------------------------------------*/
.PageHeader { position:relative; overflow:hidden;
	z-index:210; /* PageBody PageHeader Breadcrumbとの比較 */ }
.PageHeader > .inner { /*height:100vh; jsでも操作*/ /*max-height:820px; min-height:650px;*/ height:100vh; position:relative; }
/*　フルスクリーン解除　*/
.FitScreen_Disabled .PageHeader > .inner { height:72px; }



.PageHeader.-home { /*min-height:655px;*/ min-height:574px; }
.PageHeader.-home > .inner { /*min-height:655px;*/ min-height:574px; }
@media screen and (max-width:1023px) { /* tablet */
	.PageHeader.-home { min-height:0; }
	.PageHeader.-home > .inner { min-height:0; }
}
@media screen and (max-width:767px) { /* 6Plus */
	.FitScreen_Disabled .PageHeader > .inner { height:72px; /*height:56px;*/ }
}



/*ベース
---------*/
.PageHeader .txtArea { width:100%; position:absolute; top:50%; left:0; right:auto; margin:auto; transform:translateY(-50%); z-index:300; box-sizing:border-box; padding:0 112px; text-align:left; max-width:1200px; /*background:rgba(255, 0, 0, .3);*/ }
.PageHeader .category { font-family:'Poppins', sans-serif; font-size:16px; font-weight:bold; color:#fff; line-height:1; margin-bottom:20px; text-shadow:0px 0px 16px rgba(0,0,0,.3); letter-spacing:.2em; }
.PageHeader .ttl { font-family:'Poppins', sans-serif; font-size:80px; font-feature-settings:"palt"; color:#fff; line-height:1; margin-bottom:40px; text-shadow:0px 0px 16px rgba(0,0,0,.3); letter-spacing:.2em; }
.PageHeader .lead { font-size:16px; font-weight:bold; font-feature-settings:"palt"; color:#fff; text-shadow:0px 0px 16px rgba(0,0,0,.7); line-height:2; letter-spacing:.2em; }
.PageHeader .lead.-en { letter-spacing:0em; }
@media screen and (max-width:1199px) { /* tablet横表示 ＆ PC小 */ 
	.PageHeader .txtArea { padding:0 112px 0 40px; }
}
@media screen and (max-width:767px) { /* 6Plus */
	.PageHeader .txtArea { padding:0 16px; }
	.PageHeader .ttl { font-size:17vw; font-weight:500; letter-spacing:0; margin-bottom:.4em; }
	.PageHeader .lead { font-size:16px; letter-spacing:.04em; line-height:1.5; }
	.PageHeader .lead.-en { letter-spacing:0em; }
}


/*向きの調整
---------*/
.PageHeader.-company .txtArea { left:auto; right:0; text-align:right; }
.PageHeader.-company .category { margin-right:-.2em; }
.PageHeader.-company .ttl { margin-right:-.2em; }
.PageHeader.-company .lead { margin-right:-.2em; }
@media screen and (max-width:1023px) { /* tablet */
	.PageHeader.-company .txtArea { text-align:left; }
	.PageHeader.-company .category { margin-right:0; }
	.PageHeader.-company .ttl { margin-right:0; }
	.PageHeader.-company .lead { margin-right:0; }
}
@media screen and (max-width:767px) { /* 6Plus */
	.PageHeader.-company .category { margin-bottom:10px; }

}

.PageHeader.-schedule .txtArea { left:auto; right:0; text-align:right; }
.PageHeader.-schedule .category {}
.PageHeader.-schedule .ttl { margin-right:-.2em; }
.PageHeader.-schedule .lead { margin-right:-.2em; }
@media screen and (max-width:1023px) { /* tablet */
	.PageHeader.-schedule .txtArea { text-align:left; }
	.PageHeader.-schedule .ttl { margin-right:0; }
	.PageHeader.-schedule .lead { margin-right:0; }
}

.PageHeader.-library .txtArea { left:0; right:0; text-align:center; }
.PageHeader.-library .category {}
.PageHeader.-library .ttl { text-indent:.2em; }
.PageHeader.-library .lead { text-indent:.2em; }
@media screen and (max-width:1199px) { /* tablet横表示 ＆ PC小 */
	.PageHeader.-library .txtArea { padding:0 112px; }
}
@media screen and (max-width:1023px) { /* tablet */
	.PageHeader.-library .txtArea { text-align:left; padding:0 112px 0 40px; }
	.PageHeader.-library .ttl { text-indent:0; }
	.PageHeader.-library .lead { text-indent:0; }
}
@media screen and (max-width:767px) { /* 6Plus */
	.PageHeader.-library .txtArea { padding:0 16px; }
}

.PageHeader.-staff .txtArea { left:auto; right:0; text-align:right; }
.PageHeader.-staff .category {}
.PageHeader.-staff .ttl { margin-right:-.2em; }
.PageHeader.-staff .lead { margin-right:-.2em; }
@media screen and (max-width:1023px) { /* tablet */
	.PageHeader.-staff .txtArea { text-align:left; }
	.PageHeader.-staff .ttl { margin-right:0; }
	.PageHeader.-staff .lead { margin-right:0; }
}


.PageHeader.-contact .txtArea { left:0; right:0; text-align:center; }
.PageHeader.-contact .category {}
.PageHeader.-contact .ttl { text-indent:.2em; }
.PageHeader.-contact .lead { text-indent:.2em; }
@media screen and (max-width:1199px) { /* tablet横表示 ＆ PC小 */
	.PageHeader.-contact .txtArea { padding:0 112px; }
}
@media screen and (max-width:1023px) { /* tablet */
	.PageHeader.-contact .txtArea { text-align:left; padding:0 112px 0 40px; }
	.PageHeader.-contact .ttl { text-indent:0; }
	.PageHeader.-contact .lead { text-indent:0; }
}
@media screen and (max-width:767px) { /* 6Plus */
	.PageHeader.-contact .txtArea { padding:0 16px; }
}


/*上下の位置調整
---------*/
.PageHeader.-schedule .txtArea { top:auto; bottom:64px; transform:none; }
@media screen and (max-width:1023px) { /* tablet */
	.PageHeader.-schedule .txtArea { top:50%; bottom:auto; transform:translateY(-50%); }
}

.PageHeader.-work_history .txtArea { top:auto; bottom:120px; transform:none; }
@media screen and (max-width:1023px) { /* tablet */
	.PageHeader.-work_history .txtArea { top:50%; bottom:auto; transform:translateY(-50%); }
}

.PageHeader.-staff .txtArea { top:auto; bottom:64px; transform:none; }
@media screen and (max-width:1023px) { /* tablet */
	.PageHeader.-staff .txtArea { top:50%; bottom:auto; transform:translateY(-50%); }
}

/*改行調整
---------*/
.PageHeader.-company .lead.-en { min-height:64px; }
/*.PageHeader.-company .lead br { display:none; }*/
@media screen and (max-width:1023px) { /* tablet */
	.PageHeader .lead br { display:none; }
	.PageHeader .lead br.required { display:block; }
	/*.PageHeader.-company .lead br { display:block; }*/
}






/*----------------------------------------------------
.PageBody
----------------------------------------------------*/
.PageBody {}
.PageBody { padding-bottom:0; position:relative;
	z-index:220; /* PageBody PageHeader Breadcrumbとの比較 */ }
.PageBody > .inner { width:calc(100% - 72px); min-height:200px; }

/* safariで何故かこの設定が必要　チラつき対策 */
.PageBody::after { content:""; display:block; width:0; height:0; position:absolute; z-index:-1;
	background:url(/static/img/common/dammy.jpg) center no-repeat; background-size:cover; background-attachment:fixed; 
}



/* normal */
.normal .PageBody > .inner { background:#fff; }

/* dark */
.dark .PageBody > .inner { background:#222; }

@media screen and (max-width:767px) {
	.PageBody {}
	.PageBody > .inner { width:100%; min-height:200px; }
}



/*--------------------------------------------------------------------------------------------------------
パンくず
--------------------------------------------------------------------------------------------------------*/
.Breadcrumb { width:calc(100% - 72px); padding:8px 40px; box-sizing:border-box; display:flex; align-items:center; overflow:hidden; position:relative; z-index:230; /* PageBody PageHeader Breadcrumbとの比較 */ background:rgb(0,0,0,.7); }

.Breadcrumb ul { display:table; min-height:56px; }
.Breadcrumb li { display:table-cell; font-family:'Roboto', sans-serif; letter-spacing:.1em; font-size:10px; color:#999; position:relative; vertical-align:middle; line-height:1.3; white-space:nowrap; }
.Breadcrumb li:last-child { padding-right:0; white-space:normal; }
/* arrow */
.Breadcrumb li::after { content:''; display:inline-block; vertical-align:middle; width:4px; height:4px; border-top:1px solid rgba(255,255,255,.7); border-right:1px solid rgba(255,255,255,.7); -webkit-transform:rotate(45deg) translateY(-50%); transform:rotate(45deg) translateY(-50%); /*position:absolute; top:50%; right:12px;*/ margin:2px 13px 0 8px; }
.Breadcrumb li:last-child::after { display:none; }

/* リンクエリア */
.Breadcrumb a { display:inline-block; text-decoration:none; color:inherit; color:#fff !important; }
.Breadcrumb .inner { display:inline-block; }
.Breadcrumb i { margin-right:4px; }

/* 動き */
.Breadcrumb a > .inner { position:relative; }
.Breadcrumb a > .inner::after { content:''; display:block; width:0; height:1px; position:absolute; right:0; left:auto; bottom:-8px; transition:all .3s cubic-bezier(.2,1,.20,1); background:#fff; }
.hover .Breadcrumb a:hover > .inner::after { width:100%; left:0; }

@media screen and (max-width:767px) { /* 6Plus */
	.Breadcrumb { width:100%; padding:8px 16px; }
	.Breadcrumb li { letter-spacing:0; }
}


/*--------------------------------------------------------------------------------------------------------
汎用
--------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------
.Layout2Colum
----------------------------------------------------*/
/* 左カラムは追従する */

.Layout2Colum { display:flex; flex-wrap:wrap; min-height:100vh; box-sizing:border-box; }
.Layout2Colum__nav {}
.Layout2Colum__contents { display:flex; flex:1; }

.Layout2Colum__navFollow { position:-webkit-sticky; /* Safari */ position:sticky; top:0;  }
.Layout2Colum__navFollow > .inner { width:100%; height:100vh; display:table; }
.Layout2Colum__navFollow > .inner > .inner { display:table-cell; vertical-align:middle; }

/* normal */
.normal .Layout2Colum__nav { background:#223A5F; }
.normal .Layout2Colum__contents { background:#fff; }
.normal .Layout2Colum { background:#fff; }

/* dark */
.dark .Layout2Colum__nav { background:#333; }
.dark .Layout2Colum__contents { background:#222; }
.dark .Layout2Colum { background:#222; }


@media screen and (max-width:1023px) { /* tablet */
	.normal .Layout2Colum__nav { background:none; }
	.dark .Layout2Colum__nav { background:none; }
}








.PageBody .backButton { width:calc(100% - 32px); max-width:120px; margin:auto; }
.PageBody .backButton a { display:flex; height:40px; width:100%; justify-content:center; align-items:center; color:rgba(255,255,255,.9); font-family:'Roboto', sans-serif; font-size:14px; letter-spacing:.1em; text-indent:.1em; text-decoration:none; }
.PageBody .backButton a::before { content:''; display:inline-block; margin:6px 2px 0 4px; vertical-align:middle; width:7px; height:7px; border-top:1px solid rgba(255,255,255,.7); border-left:1px solid rgba(255,255,255,.7); -webkit-transform:rotate(-45deg) translateY(-50%);transform:rotate(-45deg) translateY(-50%); }
.hover .PageBody .backButton a:hover { opacity:.7; }
@media screen and (max-width:1023px) { /* tablet */ 
	.PageBody .backButton { width:200px; max-width:none; margin:auto; }
	.PageBody .backButton a { display:flex; justify-content:center; align-items:center; height:40px; width:100%; border:none; font-size:12px; font-family:'Roboto', sans-serif; font-weight:300; letter-spacing:.2em; text-indent:.2em; box-sizing:border-box; }
	.PageBody .backButton a::before { width:6px; height:6px; margin:5px 4px 0 0; }
	.normal .PageBody .backButton a { border:1px solid rgba(0,0,0,.2); color:#333; }
	.normal .PageBody .backButton a::before { border-color:rgba(0,0,0,.7); }
	.dark .PageBody .backButton a { border:1px solid rgba(255,255,255,.2); color:#DEDEDE; }
	.dark .PageBody .backButton a::before { border-color:rgba(255,255,255,.7); }
}





@media screen and (max-width:1023px) { /* tablet */
	.Layout2Colum { display:block; }
	.Layout2Colum__nav {}
	.Layout2Colum__contents { display:block; }
	.Layout2Colum__navFollow { position:static; }
	.Layout2Colum__navFollow > .inner { width:100%; height:auto; display:block; }
	.Layout2Colum__navFollow > .inner > .inner { display:block; vertical-align:middle; }

	/* news */
	.Layout2Colum.-news_detail { position:relative; padding-bottom:120px; } 
	.Layout2Colum.-news_detail .Layout2Colum__nav { position:absolute; bottom:0; left:0px; width:calc(100% - 0px); /*border-top:1px solid rgba(255,255,255,.2);*/ height:120px; /*padding-top:40px;*/ box-sizing:border-box; }

	/* library */
	.Layout2Colum.-library_detail { position:relative; padding-bottom:120px; } 
	.Layout2Colum.-library_detail .Layout2Colum__nav { position:absolute; bottom:0; left:0px; width:calc(100% - 0px); /*border-top:1px solid rgba(255,255,255,.2);*/ height:120px; /*padding-top:40px;*/ box-sizing:border-box; }

	/* support */
	.Layout2Colum.-support_detail { position:relative; padding-bottom:120px; } 
	.Layout2Colum.-support_detail .Layout2Colum__nav { position:absolute; bottom:0; left:0px; width:calc(100% - 0px); /*border-top:1px solid rgba(255,255,255,.2);*/ height:120px; /*padding-top:40px;*/ box-sizing:border-box; }

	/* news */
	.Layout2Colum.-staff_detail { position:relative; padding-bottom:120px; } 
	.Layout2Colum.-staff_detail .Layout2Colum__nav { position:absolute; bottom:0; left:0px; width:calc(100% - 0px); /*border-top:1px solid rgba(255,255,255,.2);*/ height:120px; /*padding-top:40px;*/ box-sizing:border-box; }
}
@media screen and (max-width:767px) { /* 6Plus */
	.Layout2Colum.-news_detail { position:relative; padding-bottom:80px; } 
	.Layout2Colum.-news_detail .Layout2Colum__nav { height:80px; }

	/* news */
	.Layout2Colum.-staff_detail { padding-bottom:80px; } 
	.Layout2Colum.-staff_detail .Layout2Colum__nav { height:80px; }

	/* news */
	.Layout2Colum.-library_detail { padding-bottom:80px; } 
	.Layout2Colum.-library_detail .Layout2Colum__nav { height:80px; }

	/* news */
	.Layout2Colum.-support_detail { padding-bottom:80px; } 
	.Layout2Colum.-support_detail .Layout2Colum__nav { height:80px; }
}







.pageSlideArea { width:100%; }








/*----------------------------------------------------
.modal-video
----------------------------------------------------*/
.modal-video { background-color:rgba(0,0,0,0.8) !important; height:100%; }
.modal-video-close-btn { position:absolute; z-index:2; top:-48px; right:0; display:inline-block; width:40px; height:40px; background:transparent; overflow:hidden; border-radius:50%; border:1px solid rgba(255,255,255,.3); cursor:pointer; outline:none; }
.modal-video-close-btn:before,
.modal-video-close-btn:after { content:''; position:absolute; height:1px; width:10px; top:50%; left:50%; margin:-0 0 0 -5px; }
.modal-video-close-btn:before { transform: rotate(45deg); }
.modal-video-close-btn:after { transform: rotate(-45deg); }
.hover .modal-video-close-btn:hover { background:rgba(255,255,255,.1); }
.modal-video-body { padding:16px; box-sizing:border-box; }