

@charset "utf-8";
/* レスポンシブ設定 */
@media screen and (max-width: 640px) and (min-width: 0px){

h1 span {font-size:0.75em !important; line-height: 1.2em; vertical-align:middle !important;}


	/* 枠大きさ */
	.column1,
	.column2,
	.column3,
	.multicolumn{
		width:90%;
	    margin:0 auto;
	    overflow:hidden;
	    }
	/* 2カラム */
    .column2 .left,
	.column2 .right{
        width: 100%;
	    float:none;
        }
	.column2 .left{ margin-bottom:40px;}
	.column3 .one{
		width:100%;
		float:none;
		}
	header #logo{ display:none;}
	/* タイトル部分 */
	#kagoshima{ height:100px; background-size:contain; background-position:center;}
	#mainview_ara{ height:100px; background-size:contain; background-position:center;}
	/* カルーセル部分 */
	#common{ width:100%; overflow:hidden; margin:10px auto 0 auto;}
	#common .slickbox .box{ width:200px;}
	#common .slickbox .box p:last-child{ display:none;}
	strong.title{ font-size:120%;}
	
	/* 店舗一覧 */
	.shoplist{ width:90%;}
	.shoplist .shoplogo{ margin-bottom:15px;}
	.shoplist .shoplogo img{max-width:350px; display:block; margin-left:auto; margin-right:auto;}
	.shoplist .shoplogo a{ width:100%; display:block;}
	.shoplist .shopmenu h3{ border-top:1px solid #666; border-bottom:1px solid #666; border-left:none !important; padding:10px 0; text-align:center;}
	.shoplist .shopinfo ul li{ text-align:center; border-top:1px solid #444; padding:10px 0;}
	.shoplist .shopinfo ul li:first-child{ border:none;}
	
	/* 料金表 */
	.price table{ border-top: 1px solid #999;}
    .price table td{ display: block; text-align: center;}
    .price table th{ display: block; border-top: none; border-bottom: none; width:calc(100% - 20px);}
	
	.joinus a{ width:90%; height:350px; display:block; margin:0 auto 50px auto; text-indent:-999em; background-image:url(https://japan-quartzclub.com/area_common/images/common/joinus_tb.jpg) ; background-size:contain; background-repeat:no-repeat;}

#hn_contact a {
    width: 60px;
    background: url(https://japan-quartzclub.com/area_common/images/common/nav.png) -205px -5px;
    position: absolute;
    right: 0;
    display: block;
    overflow: hidden;
}

#hn_contact a:hover{ width:60px; background:url(https://japan-quartzclub.com/area_common/images/common/nav.png) -205px -5px; }



/* POINT4 料金表バナー */
.point4_bnr_price_list{display:block; width:100%; max-width:520px; margin:0 auto 2em;}
.point4_bnr_price_list img{width:100%;}

}

@media screen and (max-width: 959px) and (min-width: 641px){
	/* 枠大きさ */
	.column1,
	.column2,
	.column3,
	.multicolumn{
		width:90%;
	    margin:0 auto;
	    overflow:hidden;
	    }
	/* 2カラム */
    .column2 .left,
	.column2 .right{
        width: 100%;
	    float:none;
        }
	.column3 .one{
		width:48%;
		}
	.column3 .one:nth-child(2n){
		margin-right:10px;
		margin-left:10px;
		}
	
	header #logo{ float:left;}
	
	/* タイトル部分 */
	#kagoshima{ height:210px; background-size:contain; background-position:center;}
	#mainview_ara{ height:210px; background-size:contain; background-position:center;}
	/* カルーセル部分 */
	#common{ width:90%; margin:10px auto 0 auto;}
	#common .slickbox .box{ width:400px;}
	strong.title{ font-size:140%;}
	/* 店舗一覧 */
	.shoplist{ width:90%;}
	.shoplist .shoplogo{ margin-bottom:15px;    width: 350px;    float: left;}
	.shoplist .shoplogo a{ width:100%; display:block;}
	.shoplist .shopmenu {width: calc(100% - 350px - 30px);    margin-left: 30px;    float: left;}
	.shoplist .shopmenu h3{ border-top:1px solid #666; border-bottom:1px solid #666; border-left:none !important; padding:10px 0; text-align:center;}
	.shoplist .shopinfo ul li{ text-align:center; border-top:1px solid #444; padding:10px 0;}
	.shoplist .shopinfo ul li:first-child{ border:none;}
	
	.joinus a{ width:90%; height:515px; display:block; margin:0 auto 100px auto; text-indent:-999em; background-image:url(https://japan-quartzclub.com/area_common/images/common/joinus_tb.jpg); background-size:contain; background-repeat:no-repeat;}
	
	/* JQC加盟店のポイント */
	ul.point li{ float:left; width:43%;}

/* POINT4 料金表バナー */
.point4_bnr_price_list{display:block; width:100%; max-width:520px; margin:0 auto 2em;}
.point4_bnr_price_list img{width:100%;}
}

@media screen and (min-width: 960px){
	/* 表示削除 */
	.resp{ display:none;}
	/* 枠大きさ */
	.column1,
	.column2,
	.column3,
	.multicolumn{
		width:980px;
	    margin:0 auto;
	    overflow:hidden;
	    }
	.column3 .one{
		width:32%;
		}
	.column3 .one:nth-child(3n-1){ margin-right:10px; margin-left:10px;}
	
	/* ヘッダー */
	header{ width:1040px;}
	#mainview{ width:1040px;}
	#flogo{ width:1040px;}
	
	header #logo{ float:left;}
	/* タイトル部分 */
	#kagoshima{ height:200px; background-position:center;}
	#mainview_ara{ height:200px; background-position:center;}
	/* カルーセル部分 */
	#common{ width:90%; margin:10px auto 0 auto;}
	#common .slickbox .box{ width:510px;}
	strong.title{ font-size:160%;}
	
	
	/* 店舗リスト */
	article.shoplist{ width:1040px;}
	.shoplist .shoplogo{ width:350px; float:left;}
	.shoplist .shopmenu{ width:650px; float:right;}
	.shoplist .shopmenu ul li{ width:46%; float:left;}
	
	.shoplist .shopinfo ul{ margin:20px auto;}
	.shoplist .shopinfo ul li{ float:left; text-align:center; border-left:1px solid #444; font-size:110%;}
	.shoplist .shopinfo ul li:first-child{ border:none !important;}
	
	.shoplist .shopinfo ul li.address{ width:39%;}
	.shoplist .shopinfo ul li.time{ width:40%;}
	.shoplist .shopinfo ul li.tel{ width:20%;}
	
	.shopimg img{ width:400px;}
	
	.joinus a{ width:1040px; height:315px; display:block; margin:0 auto 100px auto; text-indent:-999em; background:url(https://japan-quartzclub.com/area_common/images/common/joinus.jpg) 0 0;}
	.joinus a:hover{ background:url(https://japan-quartzclub.com/area_common/images/common/joinus.jpg) 0 -315px;}
	
	/* JQC加盟店のポイント */
	ul.point li{ float:left; width:46%;}

/* POINT4 料金表バナー */
.point4_bnr_price_list{display:block; width:100%; max-width:520px; margin:0 auto 2em;}
.point4_bnr_price_list img{width:100%;}
}
