@media screen and (max-width: 960px) {
	/* 960px以下 タブレット向けのものを記述 */
#page		{ display:block; width: auto; max-width:960px; margin:0 auto; padding:0; overflow:hidden; }
body		{ font-size:1.4rem;/* 14px*/ line-height: 2; }

#header		{ width: auto; height: auto; margin:0 auto; padding: 10px ; }
.headerInner{ width: auto; margin: 0 auto; }
.headerLogo img{ width: 150px; height: auto; margin-top: 10px; }

h1{ display: block; }

#gNavSp		{ display: block; }
#contents	{ float:none; width: auto; padding:10px 0 0 0; margin:0; }
#main		{ float:none; width: auto; padding:0; margin:0; }
#topMain	{ float:none; width: auto; padding:0; margin:0; }
#footer		{ float:none; width: auto; padding:0; margin:0; }

/* pegetop
----------------------------------------------------*/
.pageTop a{ 
	animation: move1 5s linear infinite;
	display:block;
	cursor:pointer;
    position: fixed; /*固定表示*/
    bottom: 20em;
    right: 2em;
	text-align:center;
	line-height: 50px;
	width: 50px; height: 50px;
  	border-radius: 50%; 
	font-size: 0.5em;
	font-weight: bold;
	color: #fff; 
	background:rgba(199,242,252,0.6);
}
.pageTop span{ display: none; }

/* 汎用
----------------------------------------------------*/
.imgR {	float: none; margin: 0 10px 10px 10px; }
.imgL {	float: none; margin: 0 10px 10px 10px; }
.imgP { margin: 0 10px 10px 10px; width:300px; height:169px; }
br.sp{ display: block; }


/* #header ヘッダー
----------------------------------------------------*/
.headerContact{ display: none; }
#header #gNav { display: none; }
#header ul#gNav { display: none; }


/* #main メイン
----------------------------------------------------*/

.area{ width: auto; padding: 0 10px; }
.areaInner{ width: auto; margin: 0 0 0 5px; padding: 0; }
.areaInner h2{ font-size: 1.8em; margin-bottom: 20px; }
.areaInner p{ font-size: 1.1em; color: #fff; padding:10px 10px 20px 10px; text-align: left; }
.areaInner p br{ display: none; }
.areaInner.fee p br{ display: inline-block; }

ul.img3{ width: 100%; height: auto; margin-bottom: 30px; }
ul.img3 li{ font-size: 2.0em; font-weight: bold; color: #0089e0; line-height: 1.2em; width: 100%; overflow: hidden; }
ul.img3 li img{ width: 95%; height: auto; }
ul.img3 li h3{ font-size: 0.6em; padding: 10px 0 10px 5px; line-height: 1.0em; }
ul.img3 li h3 span{ font-size: 0.7em; padding: 0; }
.areaInner ul.img3 li p{ font-size: 0.5em; padding: 0 7px 0 0; }
	
ul.img4{ width: 100%; height: auto; margin-bottom: 30px; }
ul.img4 li{ font-size: 2.0em; font-weight: bold; color: #0089e0; line-height: 1.2em; width: 100%; overflow: hidden; text-align: center;}
ul.img4 li img{ width: 95%; height: auto;}

ul.text4{ width: 100%; height: auto; margin:0 0 30px 0; flex-wrap:wrap; justify-content: center; align-items: stretch;}
ul.text4 li{ width: 45%; margin-bottom: 10px; overflow: hidden;  text-align: center; }
ul.text4 li:nth-child(2){ margin-right: 10px; }
ul.text4 li:last-child{ margin-right: 10px; }
ul.text4 li img{ margin: 10px auto;}
ul.text4 li .kouka_explain { text-align: left; }

ul.nyukaiList{ width: 100%; height: auto; margin:0 0 30px 0; flex-wrap:wrap;}
ul.nyukaiList li{ width: 45%; margin-bottom: 10px; overflow: hidden; }
ul.nyukaiList li:nth-child(2){ margin-right: 10px; }
ul.nyukaiList li:last-child{ margin-right: 10px; }

ul.img5{
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
	width: 450px; padding: 0; margin: 0 auto;}
ul.img5 li img{ width: 120px; height: auto; padding: 0 10px;}

ul.img6{ width: 100%; height: auto; margin-bottom: 30px; }
ul.img6 li{ font-size: 2.0em; font-weight: bold; color: #0089e0; line-height: 1.2em; width: 100%; overflow: hidden; }
ul.img6 li p{ color: #0089e0; font-size: 1em; padding-bottom: 0; }
.img6 .item{width: 144px; height: 204px;}

#mainImg{ width: 100%; height: auto; background: none; margin: -10px 0 20px 0; content: url("../img/top/mainImgSp.png") ; }

/* トップページ おしらせ */
#topInfo h2{ display: block; width: 100%; height:auto; padding: 20px 0; text-indent: -1000000px; background: url("../img/top/topInfoTitleSp.png") 50% 50% no-repeat; background-size: 130px; float: none; margin-bottom: 0; }
#topInfo dl{ margin-left: 0; font-size: 1.5rem; font-weight: bold;  }
#topInfo dl dt{ width: 100%; padding-top: 15px; float: none; border-bottom: 2px dotted #0089e0; text-align: center; }
#topInfo dl dd{ width: 100%; padding-top: 5px; margin-left: 0; line-height: normal; text-align: center; }
#topInfo dl dd br{ display: none; }

/* トップページ 新飯塚スイミングスクールについて */
#topAbout{ background-size: 750px 75px,750px 75px; padding: 75px 0 100px 0;}

/* トップページ　スイミングの効果 */
#topKouka{ padding: 0 0 30px 0;}
#topKouka ul li br{ display: none; }
#topKouka .areaInner ul.img3 li p{ font-size: 0.4em; }
#topKouka ul.img3{ margin-top: 10px; width: auto; margin-right: 10px; }
#topKouka ul.img3 li{ width: 33%; }
#topKouka .areaInner ul.img3 li p{ top:140px; left:0; font-size: 0.8em; line-height: 1.2em; width: 250px; }
#topKouka .areaInner ul.img3 li p span{ font-size: 0.6em; line-height: 1.4em; }
#topKouka .areaInner ul.img3 li p br{ display: block; }
	
#topKouka ul.img3 li { 
  content: '';
  display: inline-block;
  height: 250px;
  background-size: contain;
  vertical-align: middle;
}

/* トップページ　コロナ対策 */
#topCorona{ background-size: 750px 75px,750px 75px; padding: 75px 0 100px 0;}
	
#topCourse{}
ul.cation li { padding-right:15px; line-height: 1.2em; padding-bottom: 10px;  }
#topCourse ul{ width: 100%; height: auto; margin-bottom: 30px; }
#topCourse ul li{ font-size: 2.0em; font-weight: bold; color: #0089e0; line-height: 1.2em; width: 100%; overflow: hidden; }
#topCourse ul li img{ width: 95%; height: auto; }
#topCourse ul li h3{ font-size: 0.8em; padding: 10px 0 10px 5px; line-height: 1.0em; text-align: center; }
#topCourse ul li h3 span{ font-size: 0.7em; padding: 0; }
#topCourse ul li p{ font-size: 0.5em; padding: 0 7px 20px 0; }
	
	
/* コース紹介ページ */
#introduction{ padding: 20px 0 20px 0; }
#introduction h2{ font-size: 2.2em; }
	
#introduction ul{ margin:0 5px; }
#introduction ul li a{ font-size: 0.7em; line-height: 1.0em; padding: 13px 0 30px 0; margin-right: 10px; }
#introduction ul li a span{ font-size:0.6em; }

#course1{
background-image:url("../img/top/bg_top_about1.png") ,url("../img/top/bg_top_about2.png") ; 
background-size: 750px 75px,750px 75px;
padding: 70px 0 120px 0; }
#course1 h2{ background: url("../img/page/h2_course1.png") 50% top no-repeat; background-size:350px;}
	
#course2{ padding: 100px 0 30px 0; }
#course2 h2{ background: url("../img/page/h2_course2.png") 50% top no-repeat; background-size:400px;}
	
#course3{
background-image:url("../img/top/bg_top_about1.png") ,url("../img/top/bg_top_about2.png") ; 
background-size: 750px 75px,750px 75px;
	padding: 70px 0 100px 0; }
#course3 h2{ background: url("../img/page/h2_course3.png") 50% top no-repeat; background-size:350px;}

	
.detail{ width: auto; padding:0 10px 0 5px; display: block; }
.course h3{ font-size: 1.9em; border-bottom: 1px dotted #fff; padding-bottom: 10px; text-align: center; width: 100%; }
.text{ width: 100%; }
.schedule{ padding:10px; }
.schedule table{ width: 100%; }
.schedule table tr td span,
.schedule table tr th span{ font-size:0.5em; line-height: 1.2em; padding: 5px 0; }
.course #course2 h3{ border-bottom: 1px dotted #000; }
.course .schedule h3{ border: none; }
.course #course2 .schedule h3{ border: none; }
	
#courseMessage{ height: 330px; }
.areaInner .message{ height: 300px; margin: 0 auto; }
.areaInner .message p{ position: absolute; left: 70px; top:80px; font-size: 1.6em; text-align: center; }
.areaInner .message p br{ display: block; }
	
/* 入会案内ページ */
#nyukai1{ 
background-size: 750px 75px,750px 75px;
padding: 70px 0 80px 0; }
	
#nyukai2{ padding: 0px 0 20px 0;}
	
#nyukai2 h2{ background: url("../img/page/h2_nyukai2.png") 50% top no-repeat; background-size:350px ; }
#nyukai2 ul.img6 {flex-wrap: wrap;}
#nyukai2 ul.img6 li{ width: 147px; font-size: 1.0em; padding-bottom: 10px; text-align: center;}
	
#nyukai3{ 
background-size: 750px 75px,750px 75px;
padding: 70px 0 80px 0; }


/* おしらせページ */
#info{ padding: 20px 0 20px 0; }
#info h2{ font-size: 2.2em; }
#info dl{ margin-left: 0; font-size: 1.5rem; font-weight: bold;  }
#info dl dt{ width: 100%; padding-top: 15px; float: none; border-bottom: 2px dotted #0089e0; text-align: center; }
#info dl dd{ width: 100%; padding-top: 5px; margin-left: 0; line-height: normal; text-align: center; }
#info dl dd br{ display: none; }
.info-title{
  font-size: 1.5rem;
  font-weight: bold;
  padding-bottom: 10px;
  border-bottom: 2px dotted #0089e0;
}
.info-detail{
  font-size: 1.5rem;
  font-weight: bold;
  padding-top: 10px;
}
.info-pager{
  display: flex;
  flex-direction: row;
  justify-content: center;
  padding-top: 30px;
}
.info-pager > *{
  padding: 0 20px;
  font-size: 1.5rem;
  font-weight: bold;
}

#contact p img{ width: 100%; }
#contact .areaInner p,
#contact .areaInner label { color: #333; font-size: 1.2em; text-align: left; padding-bottom: 0; }
#contact .wpcf7 { padding: 20px 10px; }

/* #footer
----------------------------------------------------------- */

#footer { background-size: 750px 75px; padding: 50px 0 35px 0; }
.footerInner{ width:auto; margin:0 auto; padding: 10px; }

#footer ul.fNav { margin-bottom: 20px; }
#footer ul.fNav li a{ padding: 0 5px ; font-size: 1.0em; }

.footerContact{ width: 100%; flex-wrap:wrap; }
.footerBox{ height: auto; padding-bottom: 20px; margin: 0 auto; }
.footerBox.add{ width: 320px; text-align: center; }
.footerBox.map{ width: 300px; }
.footerBox.day{ border-radius: 10px; padding:0px; width: 300px; margin: 0 auto 10px auto; }

/* 住所 */
#footer .add h2{ font-size:1.8em; margin-bottom: 10px; }
#footer .add p{ font-size:1.2em; margin-bottom: 10px; }
.footerTelIcon{ padding: 0px 10px 2px 10px; border-radius: 4px; font-size: 1.0em; }
.footerTel a{ font-size: 2.4em; letter-spacing: 0.05em; line-height: normal; margin: -12px 0 0 60px; }

/* マップ */
.footerBox.map iframe{ border-radius: 10px;}

/* 営業日 */
#footer .day h2{ font-size:1.5em; margin: 10px 0 ; }
#footer ul.footerDay{ margin-bottom: 20px; }
	
.pageTop a{ 
    bottom: 2em;
	right: 1em;}
}

/* ----------------------------------------------------*/
@media screen and (max-width: 805px){	
	ul.text4 li{ width: 44%; }	
	ul.nyukaiList li{ width: 44%; }
}
/* ----------------------------------------------------*/
@media screen and (max-width: 770px){	
	#topKouka ul.img3 li { 
	  content: '';
	  display: inline-block;
	  width: 230px;
	  height: 230px;
	  background-size: contain;
	  vertical-align: middle;
	}
	#topKouka .areaInner ul.img3 li p{ top:130px; left:0; font-size: 0.7em; width: 230px; }
	#topKouka .areaInner ul.img3 li p span{ font-size: 0.7em; line-height: 1.4em; margin-top: 5px; }
}
/* ----------------------------------------------------*/
@media screen and (max-width: 710px){	
	#topKouka ul.img3 li { 
	  content: '';
	  display: inline-block;
	  width: 200px;
	  height: 200px;
	  background-size: contain;
	  vertical-align: middle;
	}
	#topKouka .areaInner ul.img3 li p{ top:110px; left:0; font-size: 0.6em; width: 200px; }
	#topKouka .areaInner ul.img3 li p span{ font-size: 0.7em; line-height: 1.4em; margin-top: 5px; }
}

/* ----------------------------------------------------*/
@media screen and (max-width: 670px){
	
ul.text4 li{ width: 100%; margin-right: 10px; }
ul.text4 li:nth-child(2){ width: 100%; margin-right: 10px; }
ul.text4 li:last-child{ width: 100%; margin-right: 10px; }
	
ul.img3 li{ width: 100%; }
	
	
ul.nyukaiList li{ width: 100%; margin-right: 10px; }
ul.nyukaiList li:nth-child(2){ width: 100%; margin-right: 10px; }
ul.nyukaiList li:last-child{ width: 100%; margin-right: 10px; }

ul.img5{ flex-wrap: wrap; width: 300px; }
ul.img5 li img{ width: 90px; padding: 0 5px 0 0; }
	
#topCourse ul { display: block; }

}
/* ----------------------------------------------------*/
@media screen and (max-width: 610px){	
	#topKouka ul.img3 li { 
	content: '';
	  display: inline-block;
	  width: 100px;
	  height: 100px;
	  background-size: contain;
	  vertical-align: middle;
	}
	#topKouka ul.img3 {  }
	#topKouka ul.img3 li { width: 33%; height: 300px; }
	#topKouka ul.img3 li:nth-child(1) { background-image: url(../img/top/kouka1_sp.png); background-repeat: no-repeat; }
	#topKouka ul.img3 li:nth-child(2) { background-image: url(../img/top/kouka2_sp.png); background-repeat: no-repeat; }
	#topKouka ul.img3 li:nth-child(3) { background-image: url(../img/top/kouka3_sp.png); background-repeat: no-repeat; }
	#topKouka .areaInner ul.img3 li p{ top:160px; left:0px; font-size: 0.5em; text-align: center; width: 100%; color: #000; }	

	.message{ display: block; height: 400px; width: 400px; margin: 0 auto; position: relative; background: url("../img/page/course_message_sp.png") 0 0 no-repeat; background-size: 400px 400px; }
	.areaInner .message p{ position: absolute; left: 70px; top:50px; font-size: 1.5em; text-align: center; }
	.areaInner .message p br{  display: block; }
	
	#introduction ul li a{ font-size: 0.6em; }
	#introduction ul li a span{ font-size:0.8em; line-height: 2.5em; }
	
	#nyukai2 ul.img6 li{ width: 50%; min-width: 125px; font-size: 1.0em; padding-bottom: 10px}
	.img6 .item{width: 125px; height: 175px;}

}

/* ----------------------------------------------------*/
@media screen and (max-width: 440px){
	#topKouka ul.img3{ display:block;}
	#topKouka ul.img3 li { width: 100%; height: 120px; margin-bottom: 10px; }
	#topKouka .areaInner ul.img3 li p{ top:0px; left:130px; font-size: 0.8em; text-align: left;   color: #000; }		
}
/* ----------------------------------------------------*/
@media screen and (max-width: 420px){
	.schedule table th,
	.schedule table td {
	  line-height: 1em;
	  border: 1px solid #0258a6; 
	  font-size: 1.2em;
	}
	.schedule table thead th {
	  height: 30px; 
	}
	.schedule table tbody th {
	  width: 80px;
	}	

	.message{ display: block; height: 320px; width: 320px; margin: 0 auto; position: relative; background: url("../img/page/course_message_sp.png") 0 0 no-repeat; background-size: 320px 320px; }
	.areaInner .message p{ position: absolute; left: 50px; top:40px; font-size: 1.2em; text-align: center; }
	
	#introduction ul li a{ font-size: 0.4em; }
	#introduction ul li a span{ font-size:0.8em; line-height: 2.5em; }
}