














/* 現状、メディアクエリにCSS変数が使用できない */

@media ( max-width: 960px )
{
	body
	{
		-webkit-text-size-adjust: 100%;
		width: var( --breakpoint-mb-cont-width );
		min-width: var( --breakpoint-mb-cont-width );
	}


	.pcbr, .tbbr
	{
		display: none;
	}


	.mbbr
	{
		display: block;
	}


	.pcil, .tbil
	{
		display: none;
	}


	.mbil
	{
		display: inline-block;
	}


	#rsvt_pc, #rsvt_tb
	{
		display: none;
	}


	#rsvt_mb
	{
		display: block;
	}


	.anc01
	{
		transform: translate( 0, calc( ( var( --breakpoint-mb-obione-height ) - 2px + 24px ) * -1 ) );
	}


	#bodybox
	{
		width: var( --breakpoint-mb-cont-width );
		min-width: var( --breakpoint-mb-cont-width );
	}


	#headerbase
	{
		width: var( --breakpoint-mb-cont-width );
		/*overflow: visible;*/
	}

	/*
	#headerbase::before
	{
		content: '';
		display: block;
		position: absolute;
		left: 0;
		top: -112px;
		width: 100%;
		height: 112px;
		background-color: #FFFFFF;
	}
	*/

	header
	{
		width: var( --breakpoint-mb-cont-width );
		height: calc( 100% - var( --breakpoint-mb-obione-height ) - 1px );
		padding-top: var( --breakpoint-mb-obione-height );
	}


	.midbase
	{
		width: var( --breakpoint-mb-cont-width );
	}


	.midbox
	{
		width: var( --breakpoint-mb-cont-width );
	}


	#footerbase
	{
		width: var( --breakpoint-mb-cont-width );
		/*height: 715px;*/
	}


	footer
	{
		width: var( --breakpoint-mb-cont-width );
		height: auto;
		/*padding-bottom: 123px;*/
		padding-bottom: 65px;
	}


	.rtt01
	{
		width: 86px;
		margin: 80px auto 0px auto;
		padding-top: 47px;
		font-size: 15px;
	}


	.rtt01::before
	{
		height: 38px;
	}


	.rtt01::after
	{
		height: 16px;
	}


	footer .rtt01
	{
		/*
		position: relative;
		right: auto;
		bottom: auto;
		margin: 55px auto 0px auto;
		*/
		bottom: 176px;
	}


	#hnavibox
	{
		display: none;
	}


	#obione
	{
		left: 0;
		right: auto;
		width: var( --breakpoint-mb-cont-width );
		height: calc( var( --breakpoint-mb-obione-height ) - 2px );
		margin: 0 0 0 0;
		z-index: 3;
	}


	#obione::before
	{
		width: 100%;
	}


	#headlogo01
	{
		position: relative;
		top: auto;
		bottom: auto;
		left: auto;
		right: auto;
		width: 376px;
		margin: 22px auto 0 auto;
		/*background-color: rgba( 255, 200, 200, 0.3 );*/
	}


	#headlogo01 .logo01
	{
		width: 58px;
	}


	#headlogo01 .cnj01
	{
		width: 300px;
		height: 20px;
	}


	#hnavibox01
	{
		left: auto;
		right: auto;
		top: auto;
		bottom: auto;
		position: relative;
		width: 320px;
		height: auto;
		margin: 10px auto 0 auto;
	}


	#hnavicont01
	{
		display: block;
		height: auto;
	}


	#htel01
	{
		margin: 0 auto 0 auto;
		font-size: 38px;
		text-align: center;
	}


	#htel01 span
	{
		font-size: 25px;
	}


	#htoi01
	{
		margin: 10px auto 0 auto;
	}


	#htoi01
	{
		width: 300px;
		height: 66px;
		border-radius: 8px;
	}


	#htoi01 .icon
	{
		width: 25px;
		margin-top: 4px;
	}


	#htoi01 .it
	{
		margin-left: 9px;
		font-size: 19px;
	}








	#menubox
	{
		display: none;
	}




	.stcont
	{
		width: calc( var( --breakpoint-mb-cont-width ) - ( var( --breakpoint-mb-margin ) * 2 ) );
		margin: 80px auto 80px auto;
	}


	.stbox01
	{

	}


	.stbox01 .stj
	{
		font-size: 42px;
	}




	#fabgbase01
	{
		height: 272px;
		margin-top: -222px;
	}


	#fabg01
	{
		/*width: 1300px;*/
		width: 1600px;
	}





	#toabox01
	{
		width: 384px;
		margin-top: 66px;
	}


	#st_toa
	{
		font-size: 19px;
	}


	#toacom01
	{
		margin-top: 2px;
		margin-left: 18px;
		font-size: 16px;
	}


	#toacont01
	{
		margin-top: 14px;
		padding-top: 18px;
		padding-bottom: 28px;
	}


	#toacont01 p
	{
		font-size: 15px;
		line-height: 29px;
		letter-spacing: 0.06em;
	}



	#fsnsbox
	{
		width: 430px;
		height: 98px;
		margin-top: 77px;
		border-radius: 50px;
	}


	#fsnscont
	{
		width: 288px;
		margin-top: 29px;
	}


	#fsnscont li a img, #fsnscont li a svg
	{
		height: 42px;
	}




	#footercore
	{
		display: block;
		width: 384px;
		margin-top: 85px;
	}


	#footerinfo01
	{
		width: 100%;
		margin-top: 0;
	}


	#footlogo01 .cnj01
	{
		margin-top: 7px;
	}


	.finfoc01
	{
		margin-top: 26px;
		font-size: 18px;
		line-height: 28px;
	}




	#fnavibox01
	{
		margin-top: 64px;
	}


	#fnavicont01
	{
		display: block;
		font-size: 16px;
		line-height: 32px;
		letter-spacing: 0.1em;
	}


	#fnavicont01 li a
	{
		line-height: 32px;
	}




	#footcopy
	{
		position: relative;
		left: auto;
		right: auto;
		bottom: auto;
		width: 384px;
		margin: 73px auto 0 auto;
		font-size: 15px;
		text-align: center;
		letter-spacing: 0.1em;
	}



	/*
	.hbm_opened #hbmenuplate
	{
		top: 0px;
	}


	#hbmbtn
	{
		display: block;
		position: fixed;
		left: calc( var( --breakpoint-mb-cont-width ) - 116px );
		top: 0px;
		width: 116px;
		height: 64px;
		text-decoration: none;
		color: #000000;
		will-change: transform;
		cursor: pointer;
		transition-duration: 300ms;
		z-index: 3;
	}


	#hbmbtn .bar01, #hbmbtn .bar02, #hbmbtn .bar03
	{
		display: block;
		position: absolute;
		left: -2048px;
		right: -2048px;
		margin: auto;
		width: 34px;
		height: 0px;
		border: solid 1px #000000;
		transition-duration: 300ms;
	}


	#hbmbtn .bar01
	{
		top: -2068px;
		bottom: -2048px;
	}


	#hbmbtn .bar02
	{
		top: -2048px;
		bottom: -2048px;
	}


	#hbmbtn .bar03
	{
		top: -2048px;
		bottom: -2068px;
	}


	.hbm_opened #hbmbtn .bar01
	{
		top: -2048px;
		-webkit-transform: rotate( 765deg );
		transform: rotate( 765deg );
	}


	.hbm_opened #hbmbtn .bar02
	{
		-webkit-transform: rotate( 360deg );
		transform: rotate( 360deg );
		opacity: 0.0;
	}


	.hbm_opened #hbmbtn .bar03
	{
		bottom: -2048px;
		-webkit-transform: rotate( 675deg );
		transform: rotate( 675deg );
	}


	.hbm_opened #hbmbtn p
	{
		opacity: 0.0;
	}
	*/
}



