﻿/*===========================================================
HEADER MAIN-NAV　--ヘッダー・ナビ
lead-contents　--ヘッダー下のリードエリア
SECTION　--セクションの共通設定
それ以降は各セクションごとの設定
===========================================================*/


/* GENERAL STYLES
================================================== */
html{overflow-x: hidden;}

body {font-size:15px;overflow-x: hidden;}

/*レスポンシブ*/
.sp-none{display:none;}
.pc-none{display:block;}


@media screen and (max-width:600px) {
    h1.header_tit{width:29%;}
    h1.header_tit a{font-size:11px;}

    .navRight{width:auto;padding:5px;}
    .navRight-top{
        display: block;
    }
    .navRight-bottom{display: none;}

    .navRight-top .btnTel{margin-bottom: 3px;}
    .navRight-top .btnTel a{ 
        font-size: 13px;
        padding:2px 10px;
    }
    .navRight-top .btnTel a img{width:17px;}
    
    .navRight-top .btnContact a{
        width:auto;
        font-size: 13px;
        padding:6px 10px;
    }

    .contInner_inner{margin-top: 40px;}
}


/*google翻訳*/
#google_translate_element {
    position:absolute;
	top: 10px; right: 10px;
}

.mainv{margin-top: 70px;}

/*スライドショー*/
.slick-dots { bottom: 5px !important; }
.slick-next:before{display: none;}
.slick-dots li, .slick-dots li button, .slick-dots li button:before{width:8px !important; height:8px !important;}


.gutter {
    height: 300px;
  }
.cd-fixed-bg{
      height: 300px!important; 
    width: 100%;
    background-size: auto;
}


/*SECTION
================================================== */

.contBlock{padding:40px 0 50px;}
..contInner{padding:40px 0 30px;}

/*見出し*/
h2{
    font-size:30px;
    padding-bottom: 20px;
}
h2 span{
    font-size: 11px;
    margin-top: 15px;
}

h3{
    font-size:18px;
    margin-bottom: 30px;
}


/*NEWS
================================================== */
.topics-list{margin-left: 10px;}
.topics-list li{padding:10px 10px 16px;}
.topics-list .blog_day{
    font-size: 14px;
    margin-bottom: 10px;
}

.topics-title{
    font-size:16px;
}

.snsListCont{
    text-align: center;
}
.snsListCont .snsList {
    height: 35px;
    padding: 5px 20px;
}

/*ジム紹介
================================================== */

.about_txt{
    text-align: center;
    font-size:16px;
}
.boldtext01{
    font-size:18px;
}

/*会長紹介
================================================== */
.profBox01{
    margin-bottom: 30px;
}

.profBox01 figure img{width:200px;}
.profBox01 figure figcaption{
    font-size:13px;
}
.profBox01 p{
    font-size:15px;
}

@media screen and (max-width:600px) {
    .profBox01{
        width:90%;
        padding:20px;
    }
    .profBox01 figure{
        width:100%;
        text-align: center;
    }

    .personList{width:90%;}
    .personList_name{font-size:13px;bottom:4px;}

    .calendarBox{
        width:90%;
    }
}


/* TWITTER SECTION
================================================== */
#twitter-widget-0, #twitter-widget-1 {
    width: 640px!important;
}

/* トレーナー紹介
================================================== */


/*single*/
@media screen and (max-width:800px) {
.personList.detail li{
    display: block;
}
.personList.detail li>*{
    display: block;
}
.personList.detail .personList_img{
    width:50%;
    margin:0 auto 20px;
}
.personList.detail .personList_cont{
    width: 100%;
    padding: 10px;
    margin-left: 0;
}
.personList_cont_name{text-align: center;}

.personList.detail .personList_img{width:70%;}
}

@media screen and (max-width:800px) {
    .personList li{width:47%;}
}

/* 料金
================================================== */
table[class^="table0"] th, table[class^="table0"] td{padding:6px 8px;}

/* アクセス
================================================== */
.accesArea iframe{
    height:300px;
}

@media screen and (max-width:600px) {
    .accesArea{display: block;}
    .accesArea .map{width:100%;margin: 10px auto;}
}

/*footter
================================================== */
.footerMenu{
    display: block;
    padding:10px 20px;
}
.footerMenu-left{width:100%;margin-bottom: 15px;}

.footerNav{text-align: left;}
.footerNav li{margin-bottom: 5px;}
.footerSubmenu{text-align: left;}

@media screen and (max-width:600px){
    .footerMenu-left{display: block;}    
    .footerMenu-left>*{display: block;}
    .footerLogo{margin:0 auto;}
}
