@charset "utf-8";

/* -------------------------------------
	case 736px (スマホサイズ)			*/
@media screen and (max-width: 736px) {
/*----------------------------------------*/

.pc{
	display:none;
}
.sp{
  display: block;
}
/* -------------------------------------
  sns
---------------------------------------- */

.sns_area{
  position: absolute;
  top: 0;
  right: 32px;
}

.sns_area a{
  width: 60px;
  height: 40px;
  margin-top: 6px;
}

.sns_area a span{
  display: none;
}

/* -------------------------------------
  ページトップ
---------------------------------------- */
.pagetop{
  right:20px;
  bottom:20px;  
}
.pagetop a{
  font-size:3rem;
  height:40px;
  line-height:40px;
  width:40px;
}


/* ハンバーガーメニュー */
.btn_hum {
  background-color: #8aa8ad;
  position: absolute;
  top: 0;
  right: 0;
  padding: 10px;
  margin-left: -25px;
  width: 46px; /* クリックエリアの横幅*/
  height: 46px; /* クリックエリアの高さ*/
  cursor: pointer;
}
.line {
  position: absolute;
  top: 0;
  right: 12px;
  display: block;
  width: 18px; /* 横幅 */
  height: 2px; /* 1本辺りの高さ */
  background: #fff; /* 線の色 */
  border-radius: 6px;

  /* 適用するプロパティ、変化する時間、変化する速度 */
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
 }



.line_01 { top: 16px; }
.line_02 { top: 22px; }
.line_03 { top: 28px; }

/* 最上部の線のスタイル ---------------------- */
.btn_hum.active .line_01 {
  top: 22px; /* 上から2番目の線の位置に変更 */

  /* 線を45度回転 */
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

/* 上から2番目の線のスタイル ---------------------- */
.btn_hum.active .line_02 {
  opacity: 0; /* 不透明度を下げて線を消す */
}

/* 最下部の線のスタイル ---------------------- */
.btn_hum.active .line_03 {
  top: 22px; /* 上から2番目の線の位置に変更 */

  /* 線を135度回転 */
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
}



.gnav{
  display: none;
  position: absolute;
  top: 46px;
  right: 0;
  z-index: 12;
  width: 100%;
}
.gnav .item{
  position: relative;
  font-size: 1.4rem;
  text-align: left;
  border-bottom: 1px solid #d1dfef;
  background: #6eaab4;
}
.gnav .item:after{
  position: absolute;
  top: 34%;
  right: 20px;
  content: "\f0da";
  display: inline-block;
  font-family: Fontawesome;
  color: #fff;
}
.gnav .item a{
  padding: 23px 24px;
    text-decoration: none;
    color: #fff;
    display: block;
}

.gnav .item{
  text-align: center;
}







.bx-prev{
  left: 0;
}
.bx-next{
  right: 0;
}












.header_inner,
.footer_inner,
.content_inner{
	margin:auto;
	width:100%;
	padding:0 3.125%;
}



.header{
	position: relative;
}

.footer{
  position: static;
}









.inner{
  padding-right: 0;
  padding-left: 0;
}



.message{
  text-align: left;
  font-size:  1.4rem;
}
.message strong{
  text-align: center;
  padding-bottom: 2px;
  margin-bottom: 6px;
  display: block;
}

.transfer{
  font-size: 1.6rem;
}



.visual_area{
  margin-top: 16px;
  text-align: center;
}
.header_inner .tel{
  display: none;
}
.header_inner{
  height: 46px;
}
.header_inner .logo{
  max-height: 46px;
  padding-top: 6px;
  padding-bottom: 3px;
}

.footer_inner{
  text-align: center;
}
.foot_nav_wrap{
  text-align: center;
}
.foot_nav{
  display: inline-block;
  padding-bottom: 12px;
}
.foot_nav .item{
  display: inline-block;
  text-align: center;
  font-size: 1.4rem;
}
.foot_nav .item a{
  display: block;
  padding-right: 12px;
}
.foot_nav .item:last-child a{
  padding-right: 0;
}



.map_block{
  text-align: center;
}
.map.foot{
  width: 88%;
  height: 212px;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: 18px;
}


.recruit_ttl{
    background-size: cover;
    min-height: 210px;
 }
.recruit_ttl p{
  padding-top: 35px;
  font-size: 1.6rem;
}






.main_txt{
  margin-bottom: 30px;
}


.concept{
  margin-bottom: 36px;
}

.blog_news{
  margin-bottom: 30px;
}
.blog_news dd{
    font-size: 1.4rem;
 }



.breadcrumb{
  margin-bottom: 30px;
}

.breadcrumb ol li{
  font-size: 1.4rem;
}

 .page_ttl{
  margin-bottom: 40px;
  font-size: 1.8rem;
}

.price .ttl{
  font-size: 1.8rem;
}

.base_table th,
.base_table td{
  display: block;
  border-bottom: 0;
}
.base_table th{
  background: #DFF0F3;
  color: #4d94a2;
}


.tel a{
  font-weight: bold;
  font-size: 2rem;
}

.access{
  text-align: center;
}

.notes{
  text-align: center;
}

.access .ttl{
  text-align: left;
}

.access .tel{
  text-align: center;
}
.access .tel a{
  font-size: 3rem;
}

.access .tel .min{
  font-size: 1.8rem;
}

.access .tel .tel_number{
  line-height: 1;
  display: inline-block;
}


.square_btn {
  font-size: 3rem;
    position: relative;
    display: inline-block;
    padding: 0.25em 0.7em;
    text-decoration: none;
    color: #FFF;
    background: #ff8e54;
    border-radius: 8px;
    text-shadow: 2px 4px 3px rgba(0,0,0,0.3);
    box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), inset 0 -2px 0 rgba(0, 0, 0, 0.05);
    font-weight: bold;
    border: solid 2px #fff;
}
.square_btn:before{
  content: "\f098";
  display: block;
  font-family: FontAwesome;
  position: absolute;
  top: 3%;
  left: 2%;
  text-shadow: 0 0 0 rgba(0,0,0,0.3);
}
.access a.square_btn{
    color: #FFF;
}
.access a.square_btn span{
    font-size: 1.5rem;
}



.base_table.link_site{
  border: 0;
  border-bottom: 1px solid #e1e1e1;
}
.base_table.link_site .link_bnr{
  background: transparent;
}
.base_table.link_site .link_site_text{
  text-align: center;
  font-size: 1.4rem;
  padding-top: 0;
}


.special_course{
}
.special_course_name{
  background-color: #ffebe9;
  padding: 10px 15px;
  margin-bottom: 10px; 
  display: block;
}


/* -------------------------------------
  店舗引越し時のメッセージ
---------------------------------------- */

.news_message{
  font-size: 1.6rem;
  padding: 12px 3%;
}







/*----------------------------------------*/
}
/*	end case 736px (スマホサイズ ここまで)
----------------------------------------*/





/* -------------------------------------
	case 640px (スマホの小さめのサイズ)   */
@media screen and (max-width: 640px) {
/*----------------------------------------*/


/*----------------------------------------*/
}
/*	end case 640px (スマホの小さめのサイズ ここまで)
----------------------------------------*/