@charset "UTF-8";
//@import 'https://fonts.googleapis.com/css?family=Khand:300,400,500,600,700';

@import url(https://fonts.googleapis.com/css?family=Khand:300,400,500,600,70);
@import "mixin";

html {
  background: #fff;
}

body {
  min-width: 1024px;
}
body,
#contens.top {
	background:none;
  min-height:0;
  height: auto;
}


/* 下層 調整 */

#contens {
  //width: 1024px;
  width: 960px;
}

#main {
   //width: 730px;
   width: 666px;
   .contents_box {
     background:none;
     padding-bottom: 0;
     border: 1px solid #ebebeb;
     border-top: 5px solid #197DC2;
   }
   .contents_box_in {
     background: none;
     //padding: 0 30px 30px 30px;
     padding: 0 0 30px 0;
   }
   .contents_area {
  	padding: 0;
  }
}

.h_centering {
  width: 1024px;
}

.centering {
  width: 1024px;
}

.mainbnr {
  margin-top: -60px;
  section {
    h1 {
      height:240px;
      text-align: center;
      color: #fff;
      padding-top: 100px;
      font-size: 264%;
      font-weight: bold;
      line-height: 1;
      letter-spacing: .05em;
      font {
        margin-bottom: 5px;
        display: block;
        font-family: 'Khand', sans-serif;
        font-weight: normal;
        font-weight: 400;
        font-size:50%;
      }
    }
  }
  /* カテゴリ-メイン背景画像*/
  &.school {
    background: url(../images/share/mv/bg_school.jpg) center top;
  }
  &.course {
    background: url(../images/share/mv/bg_course.jpg) center top;
  }
  &.qualification {
    background: url(../images/share/mv/bg_qualification.jpg) center top;
  }
  &.senior {
    background: url(../images/share/mv/bg_senior.jpg) center top;
  }
  &.admission {
    background: url(../images/share/mv/bg_admission.jpg) center top;
  }
  &.opencampus {
    background: url(../images/share/mv/bg_opencampus.jpg) center top;
  }
  &.other {
    background: url(../images/share/mv/bg_other.jpg) center top;
  }
}

/* /下層 調整 */




.icon-arrow{
position: relative;
display: inline-block;
padding: 0 0 0;
color: #000;
vertical-align: middle;
text-decoration: none;
}
.icon-arrow::before,
.icon-arrow::after{
position: absolute;
top: 0;
bottom: 0;
left: 0;
margin: auto;
content: "";
vertical-align: middle;
}

/* ::::::::::::::::::::::::::::::::::::::::::

  #ホバー動作　共通

:::::::::::::::::::::::::::::::::::::::::: */
.button {
	width: auto;
	height: auto;
	text-align: center;
	outline: none;
}
.button::before,
.button::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.button,
.button::before,
.button::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .6s;
	transition: all .6s;
}

/* ::::::::::::::::::::::::::::::::::::::::::

  #ホバー動作

:::::::::::::::::::::::::::::::::::::::::: */
.button {
	position: relative;
	z-index: 2;
	background-color: none;
	border: 2px solid #333;
	color: #333;
	overflow: hidden;
}
.button:hover {
	color: #fff;
	border-color: #fff;
}
.button::after {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.button:hover::after {
	-webkit-transform: scale(2) rotate(180deg);
	transform: scale(2) rotate(180deg);
	background: #016fbc;
}


/* ::::::::::::::::::::::::::::::::::::::::::

  #header

:::::::::::::::::::::::::::::::::::::::::: */
#header {
	position: relative;
  width:100%;
	z-index: 100000;/*1008追加*/
  height:auto;
}

#header .head-bar-block {
  height:50px;
  background: #000;
  .inner {
    width:1024px;
    margin: 0 auto;
  }
  h1 {
    //height:40px;
    float:left;
    width:303px;
    padding: 7px 0 0 7px;
    @media only screen and (max-width: 350px) {
      width: 253px;
      padding: 10px 0 0 7px;
      img {
        height: auto;
      }
    }
  }
  .h-func {
    float:right;
    .link_btns {
    float: left;
    li {
      float: left;
      line-height: 50px;
      a {
        padding-left: 1em;
        margin-right: 20px;
        text-decoration: none;
        color: #fff;
        &:hover {
          //@include opacity(1);
          color: #ccc;
          text-decoration: underline;
        }
      }
      span {
        position: relative;
        top:3px;
        margin-right: 5px;
      }
    }
  }
  .visitor_menu {
    position: relative;
    float: left;
    width:170px;
    .btn {
      position: relative;
      line-height: 50px;
      cursor: pointer;
      text-align: center;
      color: #fff;
      &:hover {
        //color: #ff3280;
      }
      span {
        position: relative;
        top:3px;
        margin-right: 5px;
      }
    }

    .visitor_list {
      position: absolute;
      top: 100%;
      left: 0;
      z-index: 10;
      display: none;
      width: 100%;
      background: #282828;
      background: rgba(000, 000, 000, .90);
      box-sizing: border-box;

      li {
        border-top: 1px solid #555;


        &:first-child {
          border-top: none;
        }
      }

      a {
        display: block;
        padding:10px 15px;
        text-decoration: none;
        color:  #ccc;
        &:hover {
          color: #fff;
          //color: #fff;
          background: #09f;
          @include opacity(1);
        }
      }
    }
  }
  }
}

#header .g-nav{
//background: url(../images/share/bg_black_alpha.png) left center;
background: rgba(000,000,000,0.70);
    ul {
      width: 1024px;
      margin: 0 auto;

      li.items {
        display:inline-block;
        text-align:center;
        width:167px;
        font-size: 109%;
        //height:60px;
        margin: 0;
        padding:0;
        &.nav04 ,
        &.nav06 {
          //width:172px;
        }

        a.nav {
          position:relative;
          display:block;
          //width:170px;
          font-weight:bold;
          padding-top:15px;
          height:45px;
          line-height: 1;
          text-decoration: none;
          color:#fff;
           &:hover {
             //background: #000;
             //background: #09f url(../images/share/g-nav-active.png) left bottom repeat-x;
             background: url(../images/share/g-nav-active.png) left bottom repeat-x;
           }
           &.active {
             //background: #09f;
             //background: #157ac1;
             background: url(../images/share/g-nav-active.png) left bottom repeat-x;
           }
        }
        span {
          display:block;
          font-family: 'Khand', sans-serif;
          font-weight: 500;
          font-size:92%;
          margin-bottom: 5px;
          letter-spacing: .05em;
          color: #39f;
        }
      }
    }
  }

/* アコーディオン */
#header .g-nav {
    .sub-gnav {
      position: absolute;
      display: none;
      z-index:100;
      //top: 0;
      left: 0;
      right:0;
      margin:auto;
      background: rgba(0,0,0,0.80);
      //background: url(../images/share/bg_black_alpha.png) left center;
      background: -moz-linear-gradient(top,rgba(000,000,000,0.7),rgba(000,000,000,1)); /* Firefox用 */
      background: -o-linear-gradient(rgba(000,000,000,0.7),rgba(000,000,000,1)); /* Opera */
      background: -webkit-gradient(linear,left top,left bottom,from(rgba(000,000,000,0.7)),to(rgba(000,000,000,1))); /* Safari,Google Chrome用 */
      background: linear-gradient(top,rgba(240,240,240,0.7),rgba(24,24,24,1));
      -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#000000', GradientType=0)"; /* IE8用 */
      //background: #fff;

      .inner {
        width: 1024px;
        box-sizing: border-box;
        margin: 0 auto;
        padding:30px 0 50px;
        //background: #000;
        text-align: left;
        .ttl {
          border-bottom: 1px solid #444;
          padding-bottom: 5px;
          margin-bottom:20px;
          color: #fff;
          font-size: 117%;
        }
        //.ph {margin-bottom:10px;}
        //.ttl img {vertical-align:bottom;}
        //.ph img {vertical-align:bottom;}
        ul {
          width: 100%;
          display: table;
          li {
            //height:0;
            //height: auto;
            width:0;
            width:auto;
            display: block;
            background:url(../images/share/grobal/gnav-arrow.png) no-repeat left 0.2em;
            //border-bottom:dotted 1px #9ac2ef;
            margin-bottom:5px;
            //padding-left:14px;
            padding:0 0 5px 15px;
            line-height: 1;
            float:none;
            text-align: left;
            &.last {
              margin-bottom:0;
            }
            a {
              height:0;
              padding-top:0;
              height:auto;
              line-height: 1.4;
              color:#fff;
              //font-size: 92%;
              font-weight: normal;
              text-decoration:none;
              &:hover {
                background: none;
                color:#ccc;
              }
            }
          }
        }
      }
    }
    .nav01 {
      .colum01 {width:482px; float:left;}
      .colum02 {width:482px; float:right;}
      //.colum03 {width:216px; float:left; margin-right:0;}
      .img {
        float:left;
        width:240px;
      }
      ul {
        float:right;
        width: 220px !important;
      }
    }

    .nav02 {
      .colum01 {width:482px; float:left;}
      .colum02 {width:482px; float:right;}
      .img {
        //height:150px;
        a {
          //padding:0;
          //margin: 0;
        }
      }
      .bnr {
        margin:30px auto 0;
        text-align: center;
      }
    }
    .nav03 {
      .colum01 {width:302px; float:left; margin-right:59px;}
      .colum02 {width:302px; float:left; margin-right:59px;}
      .colum03 {width:302px; float:left; margin-right:0;}
      .img {
        margin-bottom: 10px;
      }
      ul {
        margin-left: 10px;
      }
    }
    .nav04 {
      .colum01 {width:482px; float:left; }
      .colum02 {width:482px; float:right; }
      .img {
        float:left;
        width:280px;
      }
      .t-box {
        float:right;
        width: 182px !important;
        ul {
          margin-left: 10px;
        }
      }
    }
    .nav05 {
      .colum01 {width:211px; float:left; margin-right:60px;}
      .colum02 {width:482px; float:left; margin-right:60px;}
      .colum03 {width:211px; float:left; margin-right:0;}
      .colum02 .fL {width:200px; float:left;}
      .colum02 .fR {width:200px; float:right;}
      .img {
        margin-bottom: 10px;
      }
      ul {
        margin-left: 10px;
      }
    }
    .nav06 {
      .colum01 {width:302px; float:left; margin-right:59px;}
      .colum02 {width:302px; float:left; margin-right:59px;}
      .colum03 {width:302px; float:left; margin-right:0;}
      .img {
        margin-bottom: 10px;
      }
      ul {
        margin-left: 10px;
      }
    }

  }



/* ::::::::::::::::::::::::::::::::::::::::::

  footer_block

:::::::::::::::::::::::::::::::::::::::::: */

.footer-block {
	width:100%;
  .wrap {
    width:1024px;
    margin: 0 auto;
    //padding:0 10px;
  }
	.visitor-block {
    //border-top:1px solid #eee;
    background-color: #eee;
    height:60px;
    line-height: 60px;
    /*.wrap {
      width:1024px;
      margin: 0 auto;
    }*/
    ul {
      background: url(../images/share/icon_visiter_black.png) left 20px no-repeat;
      padding-left:30px;
      background-size: 13px 15px;
      li {
        float:left;
        padding-top:16px;
        font-size: 109%;
        //line-height: 60px;
        margin-right: 22px;
        a {
          padding-left: 10px;
          color: #333;
          &::before{
            left: 0;
            box-sizing: border-box;
            width: 4px;
            height: 4px;
            border: 4px solid transparent;
            border-left: 4px solid #000;
          }
        }
      }
    }
	}
  .sitemap-block {
    position: relative;
    height: 540px;
    min-width:1024px;
    background: url(../images/share/bg-footer-sitemap.jpg) top center no-repeat;
    //padding:56px 10px 0;
    /*.wrap {
      width:1024px;
      margin: 0 auto;
    }*/
    .ft_sub {
      margin-left: 8px;
    }
    .colum {
      padding-top: 56px;
      width: 188px;
      float:left;
      margin-right: 20px;
      &.colum05 {
        //display: none;
        //width: 188px;
        margin-right: 0;
      }
    }
    .box {
      &.bottom {
        margin-top: 50px;
      }
      p {
        a {
          padding-left: 26px;
          color: #fff;
          font-size: 125%;
          &::before{
            top: -3px;
            box-sizing: border-box;
            width: 16px;
            height: 16px;
            border: 1px solid #fff;
            //-webkit-border-radius: 50%;
            @include round(50%);
            //border-radius: 50%;
          }
          &::after{
            top: -3px;
            left: 7.8px;
            box-sizing: border-box;
            width: 3px;
            height: 3px;
            border: 3px solid transparent;
            border-left: 3px solid #fff;
          }
        }
      }
      ul {
        margin-top: 10px;
        li {
          line-height: 1.5;
          font-size: 92%;
          color: #fff;
          margin-bottom: 8px;
          a {
            color: #fff;
            text-decoration: none;
            &:hover {
              text-decoration:underline;
            }
          }
          span {
            position: relative;
            top:-2px;
            margin-right: 8px;
            font-size: 45%;
          }
        }
      }
    }
    .group-link-block {
      position: absolute;
      width: 100%;
      border-top: 1px solid #666;
      bottom:0;
      height: 60px;
      ul {
        li {
          float:left;
          font-size: 109%;
          line-height: 60px;
          margin-right: 22px;
          a {
            padding-left: 10px;
            color: #fff;
            &::before{
              left: 0;
              box-sizing: border-box;
              width: 4px;
              height: 4px;
              border: 4px solid transparent;
              border-left: 4px solid #fff;
            }
            &.window {
              background: url(../images/share/icon_window.png) right center no-repeat;
              padding-right:15px;
              background-size: 12px 10px;
            }
          }
        }
      }
    }
  } // sitemap-block
  .bottom-block {
    background: #000;
    border-bottom: 1px solid #000;
    padding: 40px 0;
    color: #fff;
    .f-left { float:left; width:512px;}
    .f-right { float:right; width:512px; padding-top: 45px;}
    h2 {}
    .add {
      margin-top: 20px;
      font-size: 109%;
      line-height: 1;
    }
    .contact-block {
      margin-top: 20px;
      li {
        float:left;
        margin-right: 25px;
        font-family: 'Khand', sans-serif;
        font-weight: 500;
        font-size: 200%;
        line-height: 1;

        span {
          font-family: 'Khand', sans-serif;
          font-weight: 500;
        }
        a {
          font-family: 'Khand', sans-serif;
          font-weight: 500;
          text-decoration: none;
          color: #fff;
        }
        b {
          position: relative;
          top:3px;
          margin-right: 5px;
        }
      }
    }
    .func-nav01 {
      li {
        float:right;
        line-height: 1;
        border-right: 1px solid #ccc;
        padding-right:14px;
        margin-right: 14px;
        font-size: 109%;
        &.last {
          border-right: none;
          padding-right:0;
          margin-right: 0;
        }
        a {
          text-decoration: none;
          color:#fff;
          &:hover {
            text-decoration: underline;
          }
        }
      }
    }
    .func-nav02 {
      margin-top: 20px;
      li {
        float:right;
        margin-right: 22px;
        font-size: 109%;
        line-height: 1;
        &.last{
          margin-right: 0;
        }
        a {
          padding-left: 10px;
          color: #fff;
          &::before{
            top:-.3em;
            left: 0;
            box-sizing: border-box;
            width: 4px;
            height: 4px;
            border: 4px solid transparent;
            border-left: 4px solid #fff;
          }
        }
      }
    }
    .copy {
      margin-top: 25px;
      text-align: right;
      line-height: 1;
    }
  } // bottom-block

}
// end:footer_block



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

  body {
    min-width: inherit;
    width: 100%;
    border-top: none;
  }

  /* 下層 調整 */

  #contens {
    width: 100%;
  }

  #main {
     width: 100%;
     .contents_box {
       background:none;
       padding-bottom: 0;
       border: none;
       border-top: 5px solid #197DC2;
     }
     .contents_box_in {
       background: none;
       padding: 0;
     }
     .contents_area {
    	padding: 0;
    }
  }

  .h_centering {
    width: 100%;
  }

  .centering {
    width: 100%;
  }

  .mainbnr {
    section {
      h1 {
        //background: #eaf3f9;
      }
    }
  }


  .mainbnr {
    border: none;
    margin-top: 0;
    section {
      h1 {
        height:0;
        height: auto;
        padding-top: 0;
        line-height: 1;
      }
    }
  }

  /* /下層 調整 */

  /* ::::::::::::::::::::::::::::::::::::::::::

    #header

  :::::::::::::::::::::::::::::::::::::::::: */
  #header .head-bar-block {
    height:50px;
    //background: #fff;
    .inner {
      width:100%;
      margin: 0 auto;
    }
    h1 {
      //height:40px;
      width: 240px;
      height: auto;
      padding-top: 11px;
      img {
        height: auto;
      }
    }
    .sp-menu {
      position: absolute;
      right:0;
    }
    .h-func {
      display: none;
    }
  }
  #header .g-nav {
    display: none;
  }

  #modal {
    background: #fff;
    top:50px;
    .sp-menu {
      position: absolute;
      top:-50px;
      right:0;
    }
  }
  .sp_gNav .cv_btns {
    //margin-top: -2px;
    font-size: 0;
    border-top: none;
    border-bottom: none;
  }

  .sp_gNav .cv_btns > div {
    display: inline-block;
    width: 50%;
    font-size: 12px;
    text-align: center;
    box-sizing: border-box;
  }

  .sp_gNav .cv_btns .btn_req {
    border-right: 1px solid #fff;
  }

  .sp_gNav .cv_btns a {
    display: block;
    padding: 1em 0;
    width: 100%;
    color: #fff;
    font-size: 117%;
    line-height: 1.2;
    /*background: #2f89c9;*/
    background: #17c945;
    margin: 2px 0
  }

  .sp_gNav .cv_btns a img {
    margin-right: .5em;
    width: auto;
    height: 1.2em;
    vertical-align: bottom;
  }

  /* ::::::::::::::::::::::::::::::::::::::::::

    footer_block

  :::::::::::::::::::::::::::::::::::::::::: */

  .footer-block {
    .wrap {
      width:96%;
      margin: 0 auto;
      //padding:0 10px;
    }
    .visitor-block {
      .wrap {
        width: 100%;
      }
      //width:96%;
      margin: 0 auto;
      border-top:none;
      height:0;
      height:auto;
      line-height: auto;
      .trigger {
      	//background-color: #eee;
      	//border: solid 1px #ccc;
        height: 44px;
        line-height: 44px;
        padding-left:40px;
        font-size:125%;
        font-weight: bold;
        background: #eee url(../images/share/icon_visiter_black.png) left 18px center no-repeat;
        background-size: 13px 15px;

        //color:#fff;
      }
      .visitor-aco {
      	padding: 0 0 0;
      	font-size: 100%;
      }
      .open-close {
      	float: right;
      	text-indent: -9999px;
      	display: block;
      	margin-top: 0px;
      	height: 44px;
      	width: 44px;
      	background: url(../images/share/visitor-closed.png) no-repeat;
      	-webkit-background-size: 44px 44px;
      }
      .trigger.active .open-close {
      	background: url(../images/share/visitor-open.png) no-repeat;
      	-webkit-background-size: 44px 44px;
      }

      ul {
        background: none;
        padding-left:0;
        background-size: auto;
        border: solid 1px #ccc;
        border-top: none;
        li {
          float:none;
          padding-top:0;
          font-size: 109%;
          height:40px;
          line-height: 40px;
          margin-right: 0;
          border-bottom: 1px dotted #ccc;
          padding-left:20px;
          &.last {
            border-bottom: none;
          }
          a {
            padding-left: 10px;
            display: block;
            color: #333;
            &::before{
              left: 0;
              box-sizing: border-box;
              width: 4px;
              height: 4px;
              border: 4px solid transparent;
              border-left: 4px solid #000;
            }
          }
        }
      }
  	} //visitor-block

    .sp-page-top {
      background: #333;
      height: 40px;
      line-height: 40px;
      text-align: center;
      a {
        display: block;
      }
    }

    .sitemap-block {
      display: none;
    }
    .bottom-block {
      background: #444;
      padding: 20px 0 80px;
      .f-left { float:none; width:100%;}
      .f-right { float:none; width:100%; padding-top: 0;}
      h2 {
        text-align: center;
        margin: 0 auto;
        img {
          width: 80%;
          margin: 0 auto;
          height: auto;
          text-align: center;
        }
      }
      .add {
        font-size: 100%;
        color: #fff;
        text-align: center;
      }
      .contact-block {
        margin: 30px auto 0;
        text-align: center;
        li {
          float:none;
          width:45%;
          display: inline-block;
          *zoom:1;
          margin: 0 10px;
          padding:.8em 0;
          margin-right: 0;
          font-size: 156%;
          line-height: 1;
          background: #fff;
          text-align: center;
          @include round(50px);
          &.pc {
            display: none;
          }
          span {
            font-family: 'Khand', sans-serif;
            font-weight: 500;
            color: #333;
          }
          a {
            font-family: 'Khand', sans-serif;
            font-weight: 500;
            text-decoration: none;
            color: #333;

          }
          b {
            display: block;
            position: static;
            top:3px;
            margin-right: 0;
            &.pc {
              display: none;
            }
          }
        }
      }
      .func-nav01 {
        display:none;
      }
      .func-nav02 {
        display:none;
      }
      .copy {
        margin-top: 30px;
        text-align: center;
        font-size: 100%;
        color:#fff;
        line-height: 1.5;
      }
    }
  }

  /* footer 固定*/
  .bottom-fix-nav {
  	width: 100%;
		background: #003976;
  	position: fixed;
  	bottom: -200px;
  	z-index: 9999;
  	left: 0px;
		padding: 19/640*100% 0;
		-webkit-box-shadow:10px 10px 10px 10px rgba(0,0,0,0.85);
		-ms-box-shadow:10px 10px 10px 10px rgba(0,0,0,0.85);
		-moz-box-shadow:10px 10px 10px 10px rgba(0,0,0,0.85);
		box-shadow:10px 10px 10px 10px rgba(0,0,0,0.85);
		.photo {
			width:110/640*100%;
			position: absolute;
			bottom: 0;
			left:0;
			z-index:-1
		}
		.photo-women {
			width:110/640*100%;
			float: right;
			position: absolute;
			bottom: 0;
			right:0;
			z-index: -1;
		}
    ul {
      overflow: hidden;
      height: auto;
      width:477/640*100%;
			margin: 0 auto;
      li {
        float: left;
        height: auto;
        margin-right:10/477*100%;
        &.li01 {width:116/477*100%;}
        &.li02 {width:150/477*100%;}
        &.li03 {width:191/477*100%;
				margin-right:0;}
      }
    }
  }



}

@media print, screen and (min-width: 1400px) {
  .footer-block .sitemap-block {
 /* #content .talkBlock#page-2 ,
 #content .talkBlock#page-4 {*/
   background-size: 100%;
 }
}

/*@media print, screen and (max-width: 768px) {
	html,body {
		transform: scale(0.8,0.8);
		transform-origin: left top;
		overflow-x: hidden;
		overflow-y: auto;
	}
}
@media print, screen and (max-width:640px) {
	html,body {
		transform: none;
		overflow-x:auto;
	}
}
*/