@charset "utf-8";

* android対策 */
p { background-image: url(../images/pix.gif); }

/*--------------------------------------------------------
★レスポンシブ■タブレット対応
--------------------------------------------------------*/
@media screen and (max-width: 980px) {
	/* layout */
	body {
		width: 1000px;
		overflow-x: hidden;
	}
	.wrapper {
		width: 1000px;
		margin: auto;
		padding: 0;
		position:relative;
	}
	/* header */
	header{
		width: 1000px;
	}
	footer{
		width: 1000px;
	}

	#header_information .tel_number{
		font-size: 37px;
		letter-spacing: 0;
	}
	footer .tel_number{
		font-size: 26px;
		margin-top: 8px;
	}
}

/*--------------------------------------------------------
★レスポンシブ■スマホ表示切替ボタン
--------------------------------------------------------*/
@media screen and (max-width: 480px) {
	.contact_btn a{
		margin-left: 0;
	}
	li a#btnSP{
		display: none;
	}
	li a#btnPC{
		position: fixed;
		display: block;
		width: 30%;
		height: auto;
		font-size: 12px;
		padding: 8px 2px;
		border-radius:8px;
		background-color: #999;
		box-shadow: 3px 3px 1px rgba(0,0,0,0.2);
		text-align: center;
		color: #fff;
		text-decoration: none;
		bottom: 100px!important;
		left: 12px;
		z-index: 999999999!important;
	}
}
@media screen and (min-width: 481px) {
	#switch{
		display: none;
		height: 0;
	}
	li a#btnSP{
		display: none;
	}
	li a#btnPC{
		display: none;
	}
}

@media screen and (min-width:1021px) {
	#switch{
		display: block;
		height: auto;
	}
	li a#btnPC{
		display: none;
	}
	li a#btnSP{
		position: fixed!important;
		display: block!important;
		width: 300px;
		height: auto;
		z-index: 100;
		font-size: 24px;
		padding: 8px;
		text-align: center;
		border-radius: 22px;
		background-color: #999;
		box-shadow: 3px 3px 1px rgba(0,0,0,0.2);
		color: #fff;
		text-decoration: none;
		bottom: 150px;
		right: 30px;
		z-index: 999999999!important;
	}
}
@media screen and (min-width: 1023px) {
	#switch{
	display: none;
	height: 0;
	}
	li a#btnSP{
		display: none;
	}
	li a#btnPC{
		display: none;
	}
}


/*--------------------------------------------------------
★レスポンシブ■ヘッダ部分
--------------------------------------------------------*/
@media screen and (min-width: 481px) {
}
@media screen and (max-width: 480px) {
	#header{
		max-width:480px;
		width: 100%;
		height: 120px;
	}
	h1 a{
		float: none;
		clear: both;
		margin:  20px auto 8px;
		width: 220px;
		min-height:56px;
		height: auto;
	}
	#gl_nav{
		position: relative;
		display: block;
		width: 300px;
		height: 1em;
		float: none;
		clear: both;
		margin:0 auto;
		text-align: center;
	}
	#gl_nav li:nth-child(3):after{
		margin-right: -12px;
	}
}

/*--------------------------------------------------------
★レスポンシブ■コンテンツ部分
--------------------------------------------------------*/

@media screen and (max-width: 480px) {
	body {
		max-width:480px;
		width: 100%;
	}
	body:after{	
		content:"";
		position: fixed;
		display: block;
		z-index: -1;
		bottom: 80px;
		right: 0;
		background: url(../images/catch_right.svg) no-repeat 0 0;
		-webkit-background-size: 100%;
		background-size: 100%;
		width: 100px;
		height: 100px;
	}
	.wrapper{
		max-width:480px;
		width: 100%;
	}
	.wide_wrapper{
		max-width:480px;
		width: 100%;
	}
	h2{
		font-size: 16px;
	}
	article{
		max-width:480px;
		width: 100%;
	}
	article .section{
		max-width:480px;
		width: 100%;
		min-height:300px;
		height: 100%;
		padding-top: 140px;
		padding-bottom: 50px;
		margin: 0;
		padding-left: 0;
		padding-right: 0;
	}
	#catch{
		background: url(../images/catch_left.png) no-repeat right 140px;
		-webkit-background-size: 80%;
		background-size: 80%;
	}
	#catch_inner{
		position: relative;
		display: block;
		width: 90%;
		padding-left:0;
		padding: 200px 5% 0 ;
	}
	#catch_inner h2{
		text-align: left;
		margin-top: 12px;
		margin-bottom: 8px;
	}
	#catch_inner p.fz_big{
		font-size: 14px;
		margin-bottom: 8px;
	}
	#catch_inner p{
		font-size: 12px;
	}
	#catch:after{
		display: none;
	}
	
	#profile h2{
		text-align: center;
		font-size: 16px;
	}
	#profile dl {
		float: none;
		max-width:480px;
		width: 100%;
		height: auto;
		margin: 20px 0 0;
		font-size: 12px;
	}
	#profile dl dt{
		float: none;
		width: 90%;
		padding: 8px 0 0 0;
		margin: 0 5%;
		line-height: 1.7em;
		border-bottom: none;
	}
	#profile dl dd{
		float:none;
		width: 90%;
		padding: 4px 0 4px 0;
		margin: 0 5% 12px;
		line-height: 1.7em;
		border-bottom: 1px solid #999999;
	}
	.spbr br{
		display: none;
	}
	#profile .rightside{
		float: none;
		width: 90%;
		height: auto;
		margin-top: 20px;
		margin-left: 5%;
		margin-right: 5%;
		font-size: 10px;
		line-height: 1.7em;
	}
	#profile .rightside h3{
		margin-top: 0;
		font-weight: normal;
		margin-bottom: 12px;
		font-size: 12px;
		margin-left:0;
	}


	#news ul{
		margin-top: 20px;
		font-size: 12px;
		margin-left: 16px;
	}
	#news ul li{
		position: relative;
		display: inline-block;
		margin: 8px 0 8px 0;
		max-width:480px;
		width: 100%;
		white-space:nowrap;
	}
	#news ul li:before{
		font-size: 12px;
		left: -16px;
	}
	#news ul li span{
		position: relative;
		display: inline-block;
		text-align: center;
		width: 96px;
		font-size: 8px;
		padding: 4px 0;
		margin: 0 4px ;
		line-height: 1em;
		letter-spacing: 0;
		color: #fff;
	}
	#news ul li a{
		position: relative;
		display: block;
		white-space:normal;
		width: 94%;
		margin: 0 -0 8px 0;
	}
	form#mailformpro{
		max-width:480px;
		width: 100%;
		height: 800px;
		margin-top: 20px;
		margin-right: 0;
	}
	#contact  dl{
		width: 100%;
	}
	form#mailformpro dl dt{
		position: relative;
		display: block;
		float: left;
		width: 31%!important;
		height: 32px;
		font-size: 12px;
		padding: 8px 1% 0 3%!important;
	}
	form#mailformpro dl dd{
		position: relative;
		display: block;
		float: right;
		width: 61%!important;
		height: 32px;
		font-size: 12px;
		padding: 8px 3% 0 1%!important;
		line-height: 1.7em;
		border-bottom: 1px solid #999999;
		margin: 0;
		margin-left: -8px;
	}
	#h120{
		height: 100px;
	}
	#contact .rightside{
		position: absolute;
		display: block;
		top: 320px;
		width: 90%;
		margin: 20px 5% 0;
		font-size: 10px;
		line-height: 1.6em;
	}
	#contact .rightside h3{
		margin-top: 20px;
		font-weight: normal;
		margin-bottom: 20px;
		font-size: 10px;
	}


	/* footer*/
	#footer{
		height: 80px;
	}
	#footer_inner{
		height: 48px;
	}
	#footer_nav{
		position: relative;
		display: block;
		width: 320px;
		height: 28px;
		margin-left: 0;
		margin: 4px auto 8px!important;
	}
	#footer_nav li{
		width: 136px;
		height: 28px;
		font-size: 8px;
		margin-left: 20px;
	}

	#footer_nav li a span{
		position: relative;
		display: block;
		text-indent: -9999px;
		width: 130px;
		height: 18px;
		margin-top: 4px;
		margin-left: 0;
		background-repeat: no-repeat;
		background-position: left top;
		-webkit-background-size: contain;
		background-size: contain;
		opacity:0.8;
	}
	#footer_nav li:before{
		font-size: 12px;
		left: -14px;
	}

	#copyright{
		margin: 4px 0;
		width: 100%;
		text-align: center;
		font-size: 9px;
		letter-spacing: 0;
	}

}
@media screen and (max-width: 480px) {
	#catch_inner{
		padding: 160px 5% 0 ;
	}
}