@charset "utf-8";
html {
font-size: 62.5%;
line-height: 1.8;
}
html[lang="ja"] body, html[lang="ja"] button, html[lang="ja"] input, html[lang="ja"] select, html[lang="ja"] textarea {
font-family: YakuHanJP_Narrow, "游ゴシック Medium", "Yu Gothic Medium","游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", YuGothic,'Lato','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
font-weight:500;
}
body{
color:#000;
font-size: 1.4rem;
background:#fff;
-webkit-text-size-adjust: 100%;
}
.barlow{
font-family: 'Barlow Condensed',YakuHanJP_Narrow, "游ゴシック Medium", "Yu Gothic Medium","游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", YuGothic,'Lato','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
font-weight: 400;
}
.barlow.u-fwBold{
font-weight: 700;
}
.robot{
font-family: 'Roboto',YakuHanJP_Narrow, "游ゴシック Medium", "Yu Gothic Medium","游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", YuGothic,'Lato','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
font-weight: 400;
}

/* mainBodyCover */
#mainBody .mainBodyCover{
background: rgba(0,0,0,0.5);
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
z-index: -10;
transition: opacity 0.6s ease 0.2s;
}
@media only screen and (max-width:980px){
#mainBody .mainBodyCover{
display: none;
}
}
#mainBody.menu-open .mainBodyCover{
opacity: 1;
z-index: 100;
}
/* headerUpper */
.headerUpper{
height: 40px;
position: relative;
padding-top: 22px;
z-index: 101;
box-sizing: border-box;
}
@media only screen and (max-width:980px){
.headerUpper{
height: auto;
padding-top: 10px;
}
}
.hLinks{
top: 22px;
right: 5%;
}
.hLinks li{
margin-right: 2em;
}
.hLinks li:last-child{
margin-right:0;
}
.hLinks .slidedownIn{
padding-bottom: 5px;
}
.hLinks .icon-slidedown{
width: 7px;
margin-left: 10px;
}
.hLinks .targetLinks{
width: 240px;
top: 23px;
right: -3vw;
}
.hLinks .targetLinks li{
margin-right: 0;
}
.hLinks .targetLinks a{
height: 43px;
line-height: 43px;
z-index:100;
}
.hLinks .targetLinks a:hover{
background: #e6e6e6;
}
/* fixHeader */
.fixHeader{
width: 100%;
height: 80px;
z-index: 100;
}
@media only screen and (max-width:980px){
.fixHeader{
position: fixed !important;
top: 0;
left: 0;
border-bottom: 1px solid #e6e6e6;
}
}
@media only screen and (max-width:767px){
.fixHeader{
height: 50px;
}
}
.fixHeader .logo{
top: 20px;
left: 3%;
width: 325px;
z-index: 90;
}
@media only screen and (max-width:1300px){
.fixHeader .logo{
width: 225px;
}
}
@media only screen and (max-width:1060px){
.fixHeader .logo{
width: 200px;
}
}
.index .fixHeader .logo{
display: none;
}
@media only screen and (max-width:980px){
.index .fixHeader .logo,
.fixHeader .logo{
display: block;
width: 250px;
}
}
@media only screen and (max-width:767px){
.index .fixHeader .logo,
.fixHeader .logo{
top: 9px;
width: 210px;
}
}
.fixHeader .headerBg{
background: rgba(0,0,0,0.5);
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -10;
opacity: 0;
transition: opacity 0.6s ease 0.2s;
}
#mainBody.menu-open .fixHeader .headerBg{
opacity: 1;
z-index: 100;
}
.hNavi{
margin: 0 490px 0 auto;
float: right;
}
@media only screen and (max-width:1340px){
.hNavi {
margin: 0 430px 0 auto;
}
}
@media only screen and (max-width:1170px){
.hNavi{
margin: 0 320px 0 auto;
}
}
.hNavi li{
z-index:90;
}
@media only screen and (max-width:1200px){
.hNavi li{
font-size: 1.2rem;
}
}
.hNavi li:hover{
z-index: 100;
}
.groupe-about .hNavi li.navi-about .txtIn,
.groupe-gakka .hNavi li.navi-gakka .txtIn,
.groupe-career .hNavi li.navi-career .txtIn,
.groupe-exam .hNavi li.navi-exam .txtIn,
.groupe-blog .hNavi li.navi-blog .txtIn{
font-weight: bold;
}
.hNavi li .dot{
width: 6px;
height: 6px;
top: -3px;
right: -7px;
border-radius: 50%;
opacity: 0;
}
.groupe-about .hNavi li.navi-about .dot,
.groupe-gakka .hNavi li.navi-gakka .dot,
.groupe-career .hNavi li.navi-career .dot,
.groupe-exam .hNavi li.navi-exam .dot,
.groupe-blog .hNavi li.navi-blog .dot{
opacity: 1;
}
.hNavi li .fadedownIn{
height: 80px;
padding: 30px 0.5em 0;
box-sizing: border-box;
}
.hNavi li .fadedownIn .bg{
top:0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
transition: all 0.4s ease;
}
.hNavi li:hover .fadedownIn .bg{
opacity: 1;
}
.hNavi .subMenu{
position: absolute;
top:80px;
left:0;
margin:0;
width:100%;
height:0;
z-index:999;
background:#fff;
overflow:hidden;
display: none;
transition: all 0.4s ease 0.05s;
}
.menu-open .hNavi .subMenu{
height:265px;
}
.menu-open .hNavi .subMenu.short{
height:215px;
}
.menu-open .hNavi .subMenu.long{
height:325px;
}
.menu-open .hNavi .subMenu.gakka {
height: 755px;
}
@media only screen and (max-width:1170px){
.hNavi .subMenu .areaInner{
max-width: 800px;
}
.menu-open .hNavi .subMenu.gakka {
height: 885px;
}
}
@media only screen and (max-height:960px){
.menu-open .hNavi .subMenu.gakka {
height: 380px;
}
}
@media only screen and (max-width:1170px)and (max-height:960px){
.menu-open .hNavi .subMenu.gakka {
height: 560px;
}
}
.hNavi .subMenuTtl{
margin-top: 60px;
width: 218px;
}
@media only screen and (max-width:1170px){
.hNavi .subMenuTtl{
margin:30px 0;
width: 100%;
}
.hNavi .navi-gakka  .subMenuTtl{
margin: 30px 0 0;
}
.hNavi .subMenuTtl .gakkaList{
display: flex;
flex-wrap: wrap;
margin-left: auto;
margin-right: auto;
}
.hNavi .subMenuTtl .gakkaList .long{
width: 100%;
}
.hNavi .subMenuTtl .gakkaList .gakka{
width: 33.3333%;
margin-bottom: 20px;
}
.hNavi .subMenuTtl .gakkaList .gakka:nth-child(9){
width: 66.6666%;
}
.hNavi .subMenuTtl .gakkaList .gakka.sub{
padding-left: 1em;
box-sizing: border-box;
}
}
.hNavi .subMenuList{
margin-top: 55px;
width: calc(100% - 218px);
}
@media only screen and (max-width:1170px){
.hNavi .subMenuList{
width: 100%;
margin-top: 0;
}
}
.hNavi .subMenuList li{
position: relative;
width: 26%;
margin-right: 7.3333%;
margin-top:30px;
opacity:0;
transition: all 0.7s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0.15s;
}
.hNavi .subMenuList li a{
padding: 15px 0;
}
.hNavi .subMenu.gakka .subMenuList li{
width: 32%;
margin-right: 2%;
}
.hNavi .subMenuList li:nth-child(3n), .hNavi .subMenuList li:last-child {
margin-right: 0;
}
.hNavi .subMenu.gakka .subMenuList li:nth-child(3n) {
margin-right: 0;
}
.menu-open .hNavi .subMenuList li{
margin-top:0;
opacity:1;
transition: all 0.7s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0.15s;
}
.menu-open .hNavi .subMenuList li img{
transform: scale(1,1);
transition: all 0.6s ease;
}
.menu-open .hNavi .subMenuList li a:hover img{
transform: scale(1.05,1.05);
}
.hNavi .subMenuList li .icon-arrow-cl{
top: 50%;
right: 0;
transform: translate(0,-50%);
}
@media only screen and (max-height:960px){
.hNavi .subMenu.gakka .subMenuList li{
width: 19.2%;
margin-right: 1%;
}
.hNavi .subMenu.gakka .subMenuList li:nth-child(3n){
margin-right: 1%;
}
.hNavi .subMenu.gakka .subMenuList li:nth-child(5n){
margin-right: 0;
}
.hNavi .subMenu.gakka .subMenuList li p{
font-size: 1rem;
}
}
.hBtnOuter{
top: 20px;
right:0;
z-index: 90;
}
.hBtn a{
border-radius: 20px;
height: 40px;
line-height: 40px;
padding: 0 20px;
margin-right: 10px;
width: auto;
}
@media only screen and (max-width:1170px){
.hBtn a{
font-size: 1.2rem;
margin-right: 5px;
padding: 0 10px;
}
}
.hBtn a .bg{
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
transition: all 0.3s ease;
}
.hBtn a:hover .bg{
opacity: 1;
}
.hBtn a .icon{
width: 20px;
top: -2px;
margin-right: 5px;
}
@media only screen and (max-width:1340px){
.hBtn a .icon {
display: none;
}
}
/*discription*/
.discription{
top: 22px;
right: calc(5% + 225px);
}
.index .discription{
top: -98px;
}
@media only screen and (max-width:980px){
.discription{
position: static;
text-align: left;
margin: 20px auto 0;
width: 90%;
}
}
@media only screen and (max-width:980px){
.page .discription{
margin-bottom: 30px;
}
}
/* spNavi */
a.c_nav-bt{
position:fixed;
width:64px;
height:70px;
right:0;
bottom:0;
z-index:10000;
cursor:pointer;
transition: width 0.3s ease,height 0.3s ease,right 0.3s ease,bottom 0.3s ease,border 0.3s ease;
}
@media only screen and (max-width:980px){
a.c_nav-bt.close{
display:block!important;
background: #fff;
right:4px;
bottom:4px;
width:60px;
height:60px;
border-radius: 50%;
}
}
#panel-btn-icon{
display: block;
position: absolute;
top: 26px;
left:22px;
width: 20px;
}
@media only screen and (max-width:980px){
.close #panel-btn-icon{
left:20px;
top: 21px;
}
}
#panel-btn-icon:before,
#panel-btn-icon:after{
display: block;
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height:1px;
background: #fff;
transition: .3s;
}
#panel-btn-icon:after{
margin-top:5px;
}
.close #panel-btn-icon:before,
.close #panel-btn-icon:after{
margin-top: 0;
background: #000;
}
.close #panel-btn-icon:before{
transform: rotate(45deg);
}
.close #panel-btn-icon:after{
transform: rotate(-45deg);
}
.panel-btn-txt{
position: absolute;
top:37px;
left: 0;
width: 100%;
text-align: center;
font-size: 7pt;
transition: all 0.6s ease;
}
.close .panel-btn-txt.off{
opacity: 0;
}
.panel-btn-txt.on{
opacity: 0;
color: #000;
}
.close .panel-btn-txt.on{
opacity: 1;
top:32px;
}
div.accordion{
position: fixed;
overflow-y: scroll;
top: 0;
right: 0;
bottom:0;
z-index: 9999;
padding: 0;
width:100vw;
height:auto;
min-height:100vh;
}
.accordionLogo{
margin-left: 5%;
width:200px;
margin-bottom: 50px;
}
/*spMenu*/
.spMenu{
padding: 100px 0;
}
.accordion .spMenu{
padding: 50px 0 0;
}
@media only screen and (max-width:767px){
.spMenu{
padding: 50px 0;
}
.accordion .spMenu{
padding: 12px 0 0;
}
.spMenu .fNaviOuter{
width: 100%;
}
}
.spMenu .fNavi{
width: 63.5%;
}
@media only screen and (max-width:1170px){
.spMenu .fNavi{
width: 70%;
}
}
@media only screen and (max-width:980px){
.spMenu .fNavi{
width: 100%;
}
}
.spMenu .naviBlockOuter{
margin-left: 5.3333%;
}
@media only screen and (max-width:980px){
.spMenu .naviBlockOuter{
margin-left:0;
margin-right: 8%;
}
}
@media only screen and (max-width:767px){
.spMenu .naviBlockOuter{
margin-right: 0;
width: 100% !important;
}
}
.spMenu .naviBlockOuter:nth-child(2){
width: 25%;
}
.spMenu .naviBlockOuter:nth-child(3){
width: 31%;
}
.spMenu .naviBlockOuter:nth-child(4){
width: 28%;
}
@media only screen and (max-width:980px){
.spMenu .naviBlockOuter:nth-child(4){
margin-right: 0;
}
}
@media only screen and (max-width:767px){
.spMenu .naviBlock{
border-bottom: 1px solid #e6e6e6;
padding:0 5% 10px;
margin-bottom: 25px;
box-sizing: border-box;
}
.spMenu .naviBlock.blog{
margin-bottom:0;
}
.spMenu .naviBlock.ryugakusei{
padding-top: 25px;
background: #0000ff;
}
.spMenu .mainNavi:after{
content: "";
position: absolute;
top:50%;
right: 0;
transform: translate(0,-50%);
width: 12px;
height: 2px;
background: #000;
}
.accordion .mainNavi:after{
background: #fff;
}
.spMenu .mainNavi:before{
content: "";
position: absolute;
top:50%;
right: 0;
transform: translate(0,-50%) rotate(90deg);
width: 12px;
height: 2px;
background: #000;
transition: all 0.3s ease;
}
.accordion .mainNavi:before{
background: #fff;
}
.spMenu .mainNavi.open:before{
transform: translate(0,-50%);
}
.spMenu .subNaviList{
display: none;
padding-bottom: 20px;
}
.spMenu .subNaviListIn{
display: flex;
flex-wrap: wrap;
margin-left: auto;
margin-right: auto;
justify-content: space-between;
}
.spMenu .subNavi{
width: 49%;
font-size: 1.3rem;
}
.spMenu .subNavi.long{
width: 100%;
}
}
.spMenu .infomation{
width: 36.5%;
}
@media only screen and (max-width:1170px){
.spMenu .infomation{
width: 30%;
}
}
@media only screen and (max-width:980px){
.spMenu .infomation{
width: 100%;
margin-top: 50px;
}
}
@media only screen and (max-width:980px){
.spMenu .infomation{
width: 90%;
margin: 50px auto 0;
}
}
.spMenu .infomation .logo{
max-width: 325px;
}
.spMenu .infomation .icon-arrow-cl{
margin-left:8px;
top: 3px;
}
.spMenu .snsInfo .icon{
margin-right: 20px;
font-size: 2.7rem;
}
@media only screen and (max-width:767px){
.spMenu .snsInfo .icon{
font-size: 1.8rem;
}
}
.spMenuBottom{
max-width: 1200px;
}
@media only screen and (max-width:980px){
.spMenuBottom{
margin-bottom: 70px;
}
.accordion .spMenuBottom{
margin-bottom: 0;
}
}
.spMenuBottom .copyBox{
margin: 0 auto;
padding: 30px 0;
max-width: 1100px;
}
@media only screen and (max-width:767px){
.spMenuBottom .copyBox{
padding: 50px 0 30px;
}
.accordion .spMenuBottom .copyBox{
padding: 50px 0 70px;
}
}
@media only screen and (max-width:980px){
.spMenuBottom .copyRight{
width: 100%;
margin-top: 15px;
}
}
@media only screen and (max-width:767px){
.spMenuBottom .copyRight{
}
}
.spMenuBottom .spMenuLinks{
margin-right: 0;
}
@media only screen and (max-width:980px){
.spMenuBottom .spMenuLinks{
width: 100%;
justify-content: center;
}
}
@media only screen and (max-width:767px){
.spMenuBottom .spMenuLinks{
display: block;
}
}
.spMenuBottom .link{
margin-left: 2em;
}
@media only screen and (max-width:1100px){
.spMenuBottom .link{
margin-left: 1em;
font-size: 1rem;
}
}
@media only screen and (max-width:767px){
.spMenuBottom .link{
margin-left:0;
margin-bottom: 10px;
}
}
.spMenuBottom .btn{
width: 48%;
}
@media only screen and (max-width:767px){
.spMenuBottom .btnBox{
margin-bottom: 15px;
}
.spMenuBottom .btn{
width: 100%;
margin-bottom: 10px;
height: auto;
}
}
.spMenuBottom .btn .parts{
position: absolute;
top: 0;
left: 5%;
width: 16%;
transform: translate(0,-10%);
}
@media only screen and (max-width:980px){
.spMenuBottom .btn .parts{
width: 20%;
transform: translate(0,-5%);
}
}
.spMenuBottom .btn a{
transition: all 0.3s ease;
}
.pcContent .spMenuBottom .btn a:hover{
background: #fff;
}
.spMenuBottom .btn a .bg{
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
transition: all 0.3s ease;
}
.pcContent .spMenuBottom .btn a:hover .bg{
opacity: 0.8;
}
/*pagefootNavi*/
.pagefootNavi{
padding: 100px 0;
}
.pagefootNavi .navi{
width: calc((100% - 10px) / 3);
margin-right: 5px;
}
@media only screen and (max-width:980px){
.pagefootNavi .navi{
width: calc((100% - 5px) / 2);
margin-right: 5px;
}
}
.pagefootNavi .navi:nth-child(3n){
margin-right: 0;
}
@media only screen and (max-width:980px){
.pagefootNavi .navi:nth-child(3n){
margin-right: 5px;
}
.pagefootNavi .navi:nth-child(2n){
margin-right: 0;
}
}
.pagefootNavi .navi a{
height: 65px;
line-height: 65px;
box-sizing: border-box;
padding: 0 20px;
}
.pagefootNavi .navi a:hover{
background: rgba(255,255,255,0.5);
}
.pagefootNavi .navi.on a{
background: #0000ff;
color: #fff !important;
}
.pagefootNavi .navi a .arrow{
right: 20px;
top: 0;
line-height: 65px;
}
/*footerUpper*/
.footerUpper{
height: 420px;
}
.page .footerUpper{
border-top:1px solid #e6e6e6;
}
@media only screen and (max-width:980px){
.footerUpper{
height: auto;
}
}
.footerUpper .links{
width: 33.33333%;
}
.footerUpper .links a{
height: 100%;
box-sizing: border-box;
padding: 110px 20px 0 40px;
border-right-style: solid;
border-right-width: 1px;
}
@media only screen and (max-width:980px){
.footerUpper .links a{
padding:50px 0;
}
}
@media only screen and (max-width:767px){
.footerUpper .links a{
padding:20px 0;
}
}
.footerUpper .links:last-child a{
border: none;
}
.footerUpper .links a .bg{
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
transition: all 0.3s ease;
}
@media only screen and (max-width:980px){
.footerUpper .links a .txtBox{
position: static;
}
}
.pcContent  .footerUpper .links a:hover .bg{
opacity: 0.8;
}
.footerUpper .links .icon-arrow-cl{
font-size: 50px;
}
@media only screen and (max-width:980px){
.footerUpper .links .icon-f-arrow{
font-size: 50px;
}
}
@media only screen and (max-width:767px){
.footerUpper .links .icon-f-arrow{
font-size: 30px;
}
}
@media only screen and (max-width:1330px){
.footerUpper .links a .ttl{
font-size: 2.8vw;
}
}
@media only screen and (max-width:980px){
.footerUpper .links a .ttl{
font-size: 2.4rem;
text-align: center;
margin-bottom: 0;
color: #000 !important;
}
}
@media only screen and (max-width:767px){
.footerUpper .links a .ttl{
font-size: 1.4rem;
line-height: 1.2;
}
}
.fixBtn{
margin-right: 64px;
bottom: 0;
left: 0;
width: calc(98% - 70px);
z-index: 900;
padding:0 calc(1% + 6px) 0 1%;
border-top: 1px solid #e6e6e6;
}
.fixBtn .link{
height: 69px;
width: 47%;
}
.fixBtn .link a{
border-radius: 24px;
width: 100%;
padding: 12px 0;
margin-top: 12px;
}
/*snsFix*/
.snsFix{
top: 50%;
right: 0;
transform: translate(0,-50%);
padding: 23px 12px;
border-top-left-radius: 10px;
border-bottom-left-radius: 10px;
font-size: 2.7rem;
z-index: 9998;
}
@media only screen and (max-width:980px){
.snsFix{
top: 24px;
right: 0;
transform: translate(0,0);
display: flex;
flex-wrap: wrap;
margin-left: auto;
margin-right: auto;
padding:0;
border: none;
background: none;
}
.snsFix .icon{
margin-bottom: 0;
margin-right: 15px;
}
}
@media only screen and (max-width:767px){
.snsFix{
top: 17px;
font-size: 1.8rem;
}
.snsFix .icon{
margin-bottom: 0;
margin-right: 10px;
}
}
/*fixBnr*/
.fixBnr {
bottom: 20px;
right: 20px;
width: 300px;
height: 230px;
z-index: 80;
opacity: 0;
display: none;
}
@media only screen and (max-width:980px){
.fixBnr {
width: 280px;
bottom: 70px;
}
}
@media only screen and (max-width:767px){
.fixBnr {
width: 315px;
height: 70px;
right:5px;
bottom: 75px;
}
}
.fixBnr a{
box-sizing: border-box;
border: 3px solid #0000ff;
height: 100%;
}
@media only screen and (max-width:767px){
.fixBnr a{
display: flex;
flex-wrap: wrap;
margin-left: auto;
margin-right: auto;
border: 2px solid #0000ff;
}
}
.fixBnr a:hover{
opacity: 0.7;
}
@media only screen and (max-width:767px){
.fixBnr .img{
width: 78px;
height: 66px;
overflow: hidden;
}
.fixBnr .img img{
width: 159px;
max-width: 159px;
margin-left: -40px;
}
}
.fixBnr .txtBox{
padding: 15px 10px;
}
@media only screen and (max-width:767px){
.fixBnr .txtBox{
padding: 5px 6px;
width: calc(100% - 78px);
box-sizing: border-box;
}
.fixBnr .txtBox .ttl{
font-size: 1.3rem;
margin-bottom: 0;
padding-top: 3px;
}
.fixBnr .txtBox .note{
font-size: 1.05rem;
}
}
.fixBnr.is-show {
opacity: 1;
display: block;
transition: all 0.15s ease;
}

.fix-close {
width: 100%;
height:30px;
line-height: 30px;
top: 3px;
right: 0;
transform: translate(0,-100%);
transition: all 0.15s ease;
}
@media only screen and (max-width:767px){
.fix-close {
width: 25px;
height:25px;
line-height: 25px;
top: 0;
right: -3px;
border-radius: 50%;
transform: translate(0,-50%);
}
}
.fix-close:hover {
background: #000;
}
/* ゆっくり消える */
.cc-hide2 {
animation: hide 0.6s linear 0s;
animation-fill-mode: forwards;
}
@keyframes hide {
from {
opacity: 1;
}
to {
opacity: 0;
visibility: hidden;
}
}