@charset "UTF-8";

/* Infomation 
---------------------------------------------------------------------
File Name :  layout.css
Create date :  2015/09/2
---------------------------------------------------------------------
*/

/*==================================
 ブレークポイント
==================================*/

/*　一般（大枠レイアウト）　　：480px、768px、992px、1200px　*/
/*　BABY−G（大枠レイアウト）：640px、1000px　*/
/*　レイ（大枠レイアウト）　　：768px　1000px*/

/* タブレット／スマートフォン用の記述 */
@media screen and (max-width: 1000px) {
}

/* スマートフォン用の記述 */
@media screen and (max-width: 480px) {
}
/*==================================
 Fonts
==================================*/

/*【font01】page:allpage .heading */
.font01 {
  font-family: 'Source Sans Pro', sans-serif;
}
/*【font02】page:instructor/detail .headingName  page:dance-style #imageList .title */
.font02 {
  font-family: 'PT Sans', sans-serif;
}
/*【font03】page:lesson .timeOclock, .timeHalf */
.font03 {
}
/*【font04】page:event/main #eventNavi */
.font04 {
  font-family: 'Tangerine', cursive;
}
/*【font05】page:event .heading02 */
.font05 {
  font-family: 'Abril Fatface', cursive;
}
/*==================================
 リンク関係
==================================*/

a:link, a:visited, .textOn:link, .textOn:visited {
  color: #141311;
  text-decoration: none;/*-webkit-tap-highlight-color: transparent;*//* スマホタップ時のハイライト */
}
a:hover, a:active, .textOn:hover, .textOn:active {
  color: #141311;
  text-decoration: underline;/* -webkit-tap-highlight-color: transparent;*//* スマホタップ時のハイライト */
}
a:hover p, a:active p {
  text-decoration: underline;
}
@media screen and (min-width: 1001px) {
  a:hover img,
  a:hover .imageBg,
  .mouseover:hover {
    opacity: 0.7;
    filter: alpha(opacity=70);        /* ie lt 8 */
    -ms-filter: "alpha(opacity=70)";  /* ie 8 */
    -moz-opacity: 0.7;                 /* FF lt 1.5, Nets */
  }
}
a, a img, a p, a span {
  -webkit-transition: all .3s ease;
  -moz-transition: all .3s ease;
  -o-transition: all .3s ease;
  -ms-transition: all .3s ease;
  transition: all .3s ease;
}

/* ページ内リンク用余白 */
.localink {
  display: block;
  position: relative;
  width: 100%;
  height: auto;
  margin-top: -81px !important;
  padding-top: 81px !important;
  z-index: -999;
}

@media screen and (max-width: 1000px) {
  .localink {
    padding-top: 46px !important;
    margin-top: -46px !important;
  }
}

/*==================================
 スクロールバー
==================================*/
body *::-webkit-scrollbar{ 
    width: 5px;
}
body *::-webkit-scrollbar-thumb{ 
    background: #000;
    border-radius: 5px;
}
body *::-webkit-scrollbar-track-piece:start{
    background: #333;
}
body *::-webkit-scrollbar-track-piece:end{
    background: #666;
}

#header *::-webkit-scrollbar{ 
    width: 0;
}
#header*::-webkit-scrollbar-thumb{ 
    background: #000;
    border-radius: 0;
}

/*==================================
 基本レイアウト
==================================*/
html {
  position: relative;
  background: #ffffff;
  color: #141311;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", "ＭＳ Ｐゴシック", Arial, Helvetica, sans-serif;
  font-size: 62.5%;
  min-width: 320px;
  overflow-x: hidden;
  overflow-y: scroll;
}
body {
  width: 100%;
  /*font-size: 140%;*//*rem未対応ブラウザ用←こっちの方がいいかも？*/
  font-size: 14px;/*rem未対応ブラウザ用*/
  font-size: 1.4rem;
  line-height: 1.4;
  /* line-height: 1.8;*/
  overflow: hidden;
}

/*==================================
 ヘッダー
==================================*/
#header {
  position: fixed;
  height: 70px;
  width: 100%;
  line-height: 1;
  z-index: 999;
  background-color: #fff;
  /* border-top: 10px solid #aeaeae; */
  border-bottom: 1px solid #d6d6d6;
}

@media screen and (max-width: 1000px) {
#header {
  width: 100%;
  height: 45px !important;
  border-top: 0;
  text-align: center;
}
}

/*==================================
 コンテンツ
==================================*/
#contents {
  position: relative;
  width: 100%;
  max-width: 1350px;
  min-height: 100%;
  margin: 0 auto;
  padding-top: 81px;
  box-sizing: border-box;
}
#contents section:last-child {
  padding-bottom: 80px;
}
@media screen and (min-width: 1000px) {
.headerNormal + #contents {
  padding-top: 70px;
}
}

/* スマートフォン用の記述 */
@media screen and (max-width: 768px) {
  #contents section:last-child {
  padding-bottom: 20px;
}

}
/* タブレット／スマートフォン用の記述 */
@media screen and (max-width: 1000px) {
#contents {
  position: relative;
  min-height: 100%;
  padding-left: 0;
  padding-top: 45px;
}
}
.contentArea {
  padding: 30px 9%;
}
/* タブレット／スマートフォン用の記述 */
@media screen and (max-width: 1200px) {
.contentArea {
  /*padding: 30px 5%;*/
  padding: 30px 2%;
}
}
/* タブレット／スマートフォン用の記述 */
@media screen and (max-width: 1000px) {
.contentArea {
  padding: 20px 2%;
}
}
/* --------------------------
 左右の余白
-------------------------- */
.sPadding {
  padding: 20px 4%;/*margin: 40px 0;*/
}
/* pcのみ */
.sPaddingPc {
  padding: 20px 4%;/*margin: 40px 0;*/
}

/* タブレット／スマートフォン用の記述 */
@media screen and (max-width: 1000px) {
.sPadding {
  padding: 20px 2%;/*margin: 20px 0 40px;*/
}
.sPaddingPc {
  padding: 0 0;
}
/* tbのみ */
.sPaddingTb {
  padding: 20px 2%;
}
}