/* CSS Document */

/*** ボディ ****************************************************************/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}body{line-height:1;background: url(../img/index/body.jpg);}ol,ul{list-style:none;}blockquote,q{quotes:none;}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}table{border-collapse:collapse;border-spacing:0;}

*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}

	img {
			width:100%;
			max-width: 1000px;
			height: auto;
			vertical-align:bottom;
		}
	h1 {
		 margin-left:15px;
		 font-size:9px;
	}
	
	h3 {
		font-size:1.5em;
		padding:10px 0 7px 0;
		font-weight:bold;
	}
	
	.title_h3 {
	background-image:url(../img/index/h3.jpg);
	padding-left:10px;
	padding-right:10px;
	margin-bottom: 10px;
	}

	body
	{
		margin: 0 ;				/* スペース */
		padding: 0 ;			/* 余白 */
		font-size: 15px ;		/* 文字サイズ */
		line-height: 1.618 ;	/* 行の高さ */
		line-height: 1.6em;
		color: #555;
	}
	section {
		margin:10px 0;
	}
	
	.tel {
		font-weight: 700;
		color: #990000;
		margin-right: 6px;
		margin-left: 6px;
		font-size: 14px;
	}
	
	.manga_intro {
		width: 100%;
		height: auto;
		text-align: center;
		box-sizing: border-box;
		position:relative;
		margin-top: 15px;
		margin-bottom: 20px;
	}
	
	.red {
		color:#F00;
	}

	/* スマホだけに適用するCSS */
	@media screen and ( max-width:479px )
	{
		body
		{
			font-size: 13px ;	/* 文字サイズ */
		}
		
		h3 {
			font-size:1.3em;	/* 文字サイズ */
		}
	}

	/* 全体(デスクトップPCとスマホ)に適用するCSS */
	.wrapper
	{
		width: 100% ;
		max-width:1000px;	/* 画面幅に合わせてコンテンツを縮小 */
		margin: 0 auto ;	/* 左右に[auto]を指定することで、真ん中に寄る */
		padding: 0 ;		/* 上下左右の余白を0にしておく */
		text-align:center;
	}
	
	/***** おススメコンテンツ *****/
	.top_wrapper h2 a span {
		display:block;
	}
	
	.top_wrapper h2 + h2 a span {
		display:block;
	}
	
	.top_wrapper .recommend {
		width:47%;
		float:left;
		padding-left:5%;
	}
	
	.top_exp {
		overflow:hidden;
	}
	/***** ススメコンテンツ end *****/

	/* スマホだけに適用するCSS */
	@media screen and ( max-width:479px )
	{
		.wrapper
		{
			width: auto ;
			padding: 0 auto ;		/* 左右の余白 */
		}
	}

/*** ヘッダー *************************************************************/
/*	header
	{
		width: 100%;
		display:box;
		display:-moz-box;
		display:-webkit-box;
		display:-o-box;
		display:-ms-box;
	}

	.logo_siteid {
		width:40%;
		margin-right: 5em;
	}
	

	.logo_line {
		width:40%;
		padding-top: 30px;
		vertical-align: middle;
	}
	
		
	@media only screen and (max-width: 768px)
	{
		header {
			
			margin-right: 0;
			max-width: 768px;
		}
		
		.logo_line {
			min-width: 40%;
			vertical-align:text-top;
		}
		
		.logo_line img {
			width:100%;
		}
		
	}
*/
	header
	{
		width:100%;
		max-width:1000px;
		overflow:hidden;
		margin:0 auto;
	}
	
	header img {
		float:left;
		width:40%;
		margin:10px;
		padding: 0;
	}

	.logo_siteid {
	
	}
	

	.logo_line img {
	width:45%;
	margin-top: 1.5em;
	margin-left: 3em;
	}
	
		
	@media only screen and (max-width: 768px)
	{
		header {
			margin-bottom: 0;
			margin-right: 0;
			max-width: 768px;
		}
		
		.logo_line {
			min-width: 40%;
		}
		
		.logo_line img {
			min-width:25%;
			margin-top: 1.0em;
			margin-left: 0.5em;
		}
	}

/*** ロゴ *****************************************************************/
	/* 画像を囲む[h1] */
	.logo-wrapper
	{
		margin: 0 ;			/* スペース */
		padding: 0 ;		/* 余白 */
		line-height: 1 ;	/* 行の高さ */
	}
	
	.logo
	{
		width: 300px ;		/* 横幅 */
		height: auto ;		/* 高さ */
	}
	
	
	/* スマホだけに適用するCSS */
	@media screen and ( max-width:479px )
	{
		/* ロゴ画像 */
		.logo
		{
			width: 150px ;		/* 横幅 */
		}
	}


/*** メイン **************************************************************/
	/* 全体(デスクトップPCとスマホ)に適用するCSS */
	#main-right
	{
		width: 70%;
		height: auto;
		padding: 0;							/* 上下左右に20pxの余白 */
		/*border: 1px solid rgba(0,0,0,.1) ;*/		/* 枠線 */
		/*border-left: 1px solid rgba(0,0,0,.1);*/
		/*border-right: 1px solid rgba(0,0,0,.1);*/
		float: right;		/* 右に寄せる */
	}
	
	.alpha {
		background-color:#fff3dd;
		border:1px dashed #999;
		padding:1em;
		-moz-border-radius: 7px 7px 7px 7px;
		-webkit-border-radius: 7px 7px 7px 7px;
		-o-border-radius: 7px 7px 7px 7px;
		-ms-border-radius: 7px 7px 7px 7px;	
		border-radius: 7px 7px 7px 7px;
		margin-bottom: 20px;
	}

	.alpha ul {
    	padding: 0; 
    	list-style: none;
	}
	
	.main-column {
    	padding: 0px; 
	}
	
	.main-column li {
		display:inline-block;
		padding: 5px;
	}

	.alpha a:hover img {
		opacity: 0.7;
		filter: alpha(opacity=70);
		-ms-filter: "alpha(opacity=70)";
	}
	
	.alpha p {
		text-align: left;
		background-image:url(../img/td.jpg);
    	background-repeat: no-repeat;
	    background-position: 15px center;
/*		border-radius: 20px;
    	-webkit-border-radius: 20px;
    	-moz-border-radius: 20px;*/
	}

	.alpha h2 {
		font-size: 24px;
		text-align:left;
	}
	
	.tenpo {
		width:100%;
		height:auto;
		margin:15px 0;
	}
	
	.tenpo img {
		width:240px;
		margin-left:auto;
		margin-right:auto;
	}
	
	.tenpo_list {
		height:auto;
	}

	/* スマホだけに適用するCSS */
	@media screen and ( max-width:479px )
	{
		#main-right
		{
			width: auto ;
			padding: 0 1em;
			/*text-align: center;*/
			/*border: 1px solid rgba(0,0,0,.1) ;*/		/* 枠線 */
			border:none;
			float: none
		}

		.alpha img {
			/*float: none;*/
		}
		
		.main-column ui {
			text-align: center;
		}
		
		.main-column li {
			width: 45%;
			height: auto;
			display:inline-block;
			/*margin-right: 10px;*/
			text-align:left;
		}

		.tenpo_list img {
			margin-top:40px;
			padding-bottom:40px;
		}
	}

	/* 全体(デスクトップPCとスマホ)に適用するCSS */
	.wrapper
	{
		overflow: hidden ;		/* floatを解除する */
	}

/*** 左メニュー ************************************************************/
	/* 全体(デスクトップPCとスマホ)に適用するCSS */
	.side-left
	{
	width: 30%;
	margin:0;
	padding-right:5px;
	float: reft;		/* 右に寄せる */
		/*border: 1px solid rgba(0,0,0,.1) ;*/		/* 枠線 */
		/*border-right: 1px solid rgba(0,0,0,.1);*/
	}
	
	/* スマホだけに適用するCSS */
	@media screen and ( max-width:479px )
	{
		.side-left
		{
			width: auto ;
			float: none ;		/* floatを無効する */
			padding: 20px 0 ;
			text-align: center;
		}
	}


/*** フッター *************************************************************/
	.footer
	{
		border-top: 3px solid #888 ;		/* 枠線 */
		text-align: center ;				/* テキスト、画像の真ん中寄せ */
		margin-top: 2em ;					/* 他のブロックとのスペース */
		padding: 1em 0 ;					/* 上下の余白 */
		background: #e8e8e8 ;
	}


/*** メニューテスト *************************************************************/
	#menu-box {
		width: 100%;
		margin: 1em auto;
		padding: 0;
		overflow:hidden;
		/*border-bottom: 3px solid #888 ;*/		/* 枠線 */
	}


	#menu{
		width: 100%;
		max-width: 1000px;
		margin: 0 auto;
		padding: 0;
	}
	#menu li{
		display: block;
		float: left;
		width: 25%;
		height:260;
		padding: 0;
		background-image:url(../img/index/recommend_btn001.jpg);
	}

/*	#menu li+ li {
		border-left: solid 1px #888;
	}*/
		
/*	#menu li a{
		display: block;
		padding: 12px 0 10px;
		background: #333;
		color: #fff;
		text-align: center;
		text-decoration: none;
	}
*/
	#menu li a:hover{
		background: #999;
	}
	#toggle{ 
	 display: none;
	}
	@media only screen and (max-width: 768px)
	{
			#menu li{
			width: 50%;
			/*border-bottom: 1px solid #999;*/
		}
	}
/*	@media only screen and (max-width: 480px)
	{
		#menu{
			display: none;
		}
		#menu li{
			width: 100%;
		}
		#toggle{
			display: block;
			position: relative;
			width: 100%;
			background: #222;
		}
		#toggle a{
			display: block;
			position: relative;
			padding: 12px 0 10px;
			border-bottom: 1px solid #444;
			color: #fff;
			text-align: center;
			text-decoration: none;
		}
		#toggle:before{
			display: block;
			content: "";
			position: absolute;
			top: 50%;
			left: 10px;
			width: 20px;
			height: 20px;
			margin-top: -10px;
			background: #fff;
		}
		#toggle a:before, #toggle a:after{
			display: block;
			content: "";
			position: absolute;
			top: 50%;
			left: 10px;
			width: 20px;
			height: 4px;
			background: #222;
		}
		#toggle a:before{
			margin-top: -6px;
		}
		#toggle a:after{
			margin-top: 2px;
		}
	}
*/
/******* お問い合わせ欄 **************************************************************/
	.top_contacticn {
		width:90%;
		margin:auto;
		padding-top:1em;
		padding-bottom:1em;
		margin-top:2em;
		margin-bottom:2em;
		text-align:center;
		background-image:url(../img/index/302.jpg);
		/*border:2px dashed #f1653a;*/
		-moz-border-radius: 25px 25px 25px 25px;
		-webkit-border-radius: 25px 25px 25px 25px;
		-o-border-radius: 25px 25px 25px 25px;
		-ms-border-radius: 25px 25px 25px 25px;	
		border-radius: 25px 25px 25px 25px;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
	}
	
	.top_contacticn img {
		width:40%;
	}
	
	.top_contacticn_img {
		padding-left:5%;
		padding-right:5%;
	}
	
	.top_contacticn p {
		font-size:16px;
		color:#666;
		padding:5px;
	}
	
	.top_contacticn p a {
		font-size:18px;
		color:#666;
	}
	
	.top_contacttxt {
		margin:auto;
		margin-top:0.5em;
		width:20em;
	}
	
	.top_contact_strong {
		color:#F25C5C;
		font-weight:bold;
	}

	.contact_h2 {
		font-size:1.3em;
		font-weight:bold;
		padding-top:0.5em;
		padding-bottom:0.2em;
	}
	
	.contact_time {
		font-size:1.1em;
		font-weight:bold;
	}
	
	.contact_tel_sp {
		display:none;
	}
	
	.contact_tel_sp img {
		min-width:80%;
	}

	@media only screen and (max-width: 768px)
	{
		.contact_tel_sp {
			display:inline-block;
		}
		
	}

/**** 入店サポート *******/
	.flow_wrapper {
		width:80%;
		display:box;
		display:-moz-box;
		display:-webkit-box;
		display:-o-box;
		display:-ms-box;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
		margin:1em auto;
	}
	
	.flow_img  {
		width:20%;
	}
	
	.flow_img img {
		width:100%;
	}
	
	.flow_hp {
	padding-left:1em;
	width:80%;
	font-size:12px;
	color:#d14a4a;
	}
	
	.flow_h {
		font-weight:bold;
		font-size:16px;
	}
	
	.flow_arrow {
		text-align:center;
	}
	
	.flow_arrow img {
		width:10%;
	}

	@media only screen and (max-width: 768px)
	{
		.flow_wrapper {
			text-align:left;
		}
		
	}
	
	
/*****  フッターメニュー ****************************/
.nav_h2 {
    padding:10px;
	color:#fff;
	text-align:left;
	background:url(../../img/index/302.jpg);
	border-bottom:1px solid #865c42;
	border-top:1px solid #865c42;
}

.nav_li li {
	width: 100%;
	height: auto;
	float: left;
	cursor: pointer;
	border-bottom:1px solid #ccc;
	margin:0px;padding:10px 0 10px 0;
	color:#48240E;

}

.nav_li h3 a {
	text-decoration: none;
	padding: 5px 0 5px 10px;
	float: left;
	width:90%;
	height:90%;
	text-align:left;
	font-size: 14px;
	color:#48240E; 
	background:url(../img/n_arrow_b.png) no-repeat right center;
	-webkit-background-size:11px 10px;
	-moz-background-size:11px 10px;
	background-size:11px 10px;
}

.nav_li li:hover {

	background-color: #F3EBDC;
	color: #990000;
	text-decoration: none;
}

.nav_li h3 a span {
	font-size:10px;
	color:#55452F;
}
