
/*----------▽ 0px以上  */
@media screen and (min-width: 0px){

	/*--▽最上部ナビゲーション */
	.navbar{
		margin-bottom: 5px;
	}

	.navbar-toggle {
		margin-right: 0px;/* オリジナルは 15px */
	}

	.nav>li>a{
		padding: 10px 15px !important;
	}

	.navbar .navbar-brand {
		padding: 10px 0px 10px 4px;/* オリジナルは 10px 15px*/
		height: 50px;/* bootstrap は60px */
		font-size: 1.1em;
	}

	/* メニューの文字 */
	#menu-text{
		font-size: 0.4em;
		margin-left: -1em;
		color: #fff;
	}
	.navbar-toggle .icon-bar{
		width: 22px !important;
	}

/*--▽問合せボタン */
	#first-category{
		float:left;
	}
	#first-category .navbar-brand{
		font-size: 0.8em;
	}
	#contact-btn{
		float:left;
		padding:10px 0px;
		height:50px;
	}
	#contact-btn button{
		border-radius: 5px;
		color: #000099;
		background-color: #fff;
		font-size: 0.8em;
		padding: 3px;
	}

	#wrap, .container{
		position: relative;
		/*margin-top: 100px; デスクトップは 50px */
		margin-top: 0;
	}

	/*--▽管理画面トップへボタン */
	#top-button{
		display: none;
	}

	/*--▽カテゴリ ボタン */
	.btn-group-vertical{
		display: block;
		width: 100%;
	}
	#tag-ul{
		width: 100%;
		font-size: 0.8em;
	}
	.footer .site-map{
		display: none;
	}

	/*--▽左右カラム */
	#right{
		width: 100%;
		margin-left: 0;
	}
	#cover .coverImg{
		width: 100%;
		height: 70vw;
	}
	#laundromat-ad #coverText01, #boiler-ad #coverText01{
		width: 100%;
		position: relative;
		top: 0;
		padding: 0em;
		z-index: 1;
	}
	#laundromat-ad #coverText02{
		width: 100%;
		position: relative;
		bottom: 7em;
		height: 7em;
		padding: 0.5em 0.5em;
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
	}
	#boiler-ad #coverText02{
		width: 100%;
		position: relative;
		bottom: 13.5em;
		height: 12em;
		padding: 0.5em 0.5em;
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
	}
	#laundromat-ad #logo, #boiler-ad #logo{
		width: 40%;
		height: auto;
		margin-left: -0.3em;
	}
	#laundromat-ad #left, #boiler-ad #left{
		display: none;
	}


	#primary{
		padding: 0;
	}

	#stock{
		position: relative;
	}
	.detail-box{
		position: relative;
		display: block;
		padding: 10px;
		vertical-align: top;
	}
	.detail-img-box{
		display: inline-block;
		padding: 10px;
		margin-bottom: 1em;
		vertical-align: top;
		width: 100%;
	}
	.detail-box .table{
		width: 100%;
	}

/*--▽コンテンツボックス */
	.contents-box{
		display: inline-block;
		padding: 10px 5px 20px 5px;
		width: 48%;
		vertical-align: top;
	}
	.modal-body .contents-box{
		width: 48%;
		padding: 1em;
	}
	.contents-box .img{
		display: table-cell;
		width: 100%;
		height: auto;
		vertical-align: middle;
		margin-bottom: 5px;
		border: solid 1px #aaa;
		background-color: #000;
	}
	.contents-box img{
		width: 100%;
		height: auto;
		max-height:250px;
		margin: auto 0;
	}
	.sold-out.contents-box{
		width: 48%;
		height: auto;
	}
	.sold-out.contents-box .img{
		width: 129px;
		height: 129px;
	}

	/*--▽上にスクロール */
	#go-to-top{
		display: none;
	}
/*--▽管理ページの上にスクロール */
	#go-top{
		display: none;
		position: fixed;
		bottom: 0px;/* #slide height にプラス5px */
		right: 0px;
		z-index: 20;
	}
	#go-top .text{
		position: absolute;
		bottom:0px;
		width: 100%
	}
	#go-top a {
		text-decoration: none;
		color: #666;
		padding: 0px 0;
		text-align: center;
		display: block;
		vertical-align: bottom;
	}
}

/*----------▽ 320px以上 */
@media screen and (min-width: 320px){

	.navbar-toggle {
		margin-right: 0px;/* オリジナルは 15px */
	}

	.navbar .navbar-brand {
		padding: 10px;/* オリジナルは 10px 15px*/
		font-size: 1.2em;
	}

	/* メニューの文字 */
	#menu-text{
		font-size: 0.6em;
		margin-left: -0.5em;
	}
	.navbar-toggle .icon-bar{
		width: 25px !important;
	}
}


/*----------▽ 401px以上 */
@media screen and (min-width: 401px){

	#contact-btn button{
	//	font-size: 0.8em;
	}

	#primary{
		padding: 25px;
	}

}
/*--▽ 768px以 上 */
@media screen and (min-width: 768px){
/* container 750px - 30px(padding) = 720px */

	/* 帯内のドロップダウン */
	.dropdown-menu{
		background-color: #fff;
	}
	.dropdown li a{
		color: #004a25;/* teal */
	}


	#wrap, .container{
		/*margin-top: 150px; デスクトップは 50px */
		margin-top: 0;
	}

	/* 第一カテゴリの間隔 */
	.nav>li>a{
		padding: 15px 8px !important;
	}

/*--▽問合せボタン */
	#first-category{
		display: inline-block;
	}
	#first-category .navbar-brand{
		font-size: 18px;
	}
	#contact-btn{
//	float:left;
//	padding:15px 15px;
//	height:50px;
	}

	/*--▽カテゴリ ボタン */
	.btn-group-vertical{
		display: block;
		width: 198px;
	}
	#tag-ul{
		width: 198px;
	}

	/*--▽管理画面トップへボタン */
	#top-button{
		display: block;
		position: absolute;
		top: 0;
		left: 15px;
	}

	/*--▽左右カラム */
	#right{
		width: 100%;
		margin-left: 10px;
	}
	#cover .coverImg{
		width: 100%;
		height: 75vw;
	}
	#laundromat-ad #left, #boiler-ad #left{
		display: inline-block;
	}

	.contents-box .img{
		width: 90px;
		height: 119px;
	}

	.detail-img-box{
		width: 80%;
	}
	.detail-box .table{
		width: 80%;
	}

	.contents-box{
		display: inline-block;
		padding: 10px 15px 20px 15px;
		width: 24%;
		vertical-align: top;
	}
	.sold-out.contents-box{
		width: 18%;
		height: auto;
	}
	.sold-out.contents-box .img{
		width: 100%;
		height: auto;
	}

/*--▽管理ページの上にスクロール */
	#go-to-top{
		position: fixed;
		bottom: 200px;/* #slide height にプラス5px */
		right: 10px;
		font-size: 12px;
		z-index: 20;
	}
	#go-to-top img{
		position: relative;
		width: 30px;
		height: 30px;
	}
	#go-to-top .text{
		position: absolute;
		bottom:0px;
		width: 100%
	}
	#go-to-top a {
		text-decoration: none;
		color: #f00;
		width: 30px;
		height: 30px;
		padding: 0px 0;
		text-align: center;
		display: block;
		vertical-align: bottom;
	}
	#go-to-top a:hover img{/*アルファ*/
		text-decoration: none;
		opacity: 0.60;
		filter: alpha(opacity=60);
		-moz-opacity: 0.60;
		-ms-filter: "alpha(opacity=60)";
	}

}
/*--▽ 992px以上 */
@media screen and (min-width: 992px){
/* container 970px - 30px(padding) = 940px */

	#wrap, .container{
		/*margin-top: 100px; デスクトップは 50px */
		margin-top: 0;
	}

	/*--▽左右カラム */
	#right{
		width: 720px;
	}
	#cover .coverImg{
		width: 720px;
		height: 540px;
	}
	#laundromat-ad #coverText01, #boiler-ad #coverText01{
		width: 100%;
		position: absolute;
		top: 0;
		padding: 0em 3em 1em 3em;
		z-index: 1;
	}
	#laundromat-ad #coverText02{
		width: 100%;
		position: relative;
		bottom: 6em;
		height: 6em;
		padding: 1em 3em;
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
	}
	#boiler-ad #coverText02{
		width: 100%;
		position: relative;
		bottom: 12em;
		height: 9em;
		padding: 1em 3em;
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
	}
	#laundromat-ad #logo, #boiler-ad #logo{
		width: 40%;
		height: auto;
		margin-left: -0.3em;
	}


	/* 第二カテゴリ固定表示 JSで addClass */
	.left-fixed{
		position: fixed;
		top: 50px;
	}
	.right-fixed{
		margin-left: 220px !important;
	}

	.contents-box .img{
		width: 142.8px;
		height: 189.7px;
	}
	.sold-out.contents-box .img{
		/*width: 142.8px;*/
		/*height: 142.8px;*/
	}

	.detail-img-box{
		width: 60%;
	}
	.detail-box .table{
		width: 60%;
	}

	/*--▽フッター */
	.footer .site-map{
		display: block;
	}
}
/*--▽ 1200px以上 */
@media screen and (min-width: 1200px){
/* container 1170px - 30px(padding) = 1140px */

	#wrap, .container{
		/*margin-top: 50px;*/
		margin-top: 0;
	}

/*--▽左右カラム */
	#right{
		width: 800px;
		margin-left: 20px;
	}
	#cover .coverImg{
		width: 800px;
		height: 600px;
	}

/* 第二カテゴリ固定表示 JSで addClass */
	.left-fixed{
		position: fixed;
		top: 50px;
	}
	.right-fixed{
		margin-left: 220px !important;
	}


	.contents-box .img{
		width: 188.4px;
		height: 250px;
	}
	.sold-out.contents-box .img{
	/*	width: 188.4px;*/
		/*height: 188.4px;*/
	}

}
