@charset "utf-8";

/*----------------------------------------------------------------------------

	--- INDEX ---
	[0] defined tags
	[1] basic structure
	[2] #hd
	[3] common elements


----------------------------------------------------------------------------*/

@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:400,700');



/* use ajax */
.modal{
	position:fixed;
	width:100%;
	height:100%;
	background:#000;
	opacity:0.9;
	z-index:10000;
}
.pop,.popCM{
	position:fixed;
	width:100%;
	height:100%;
	text-align:center;
	z-index:10001;
}
.pop iframe{
	width:680px;
	height:800px;
	background:#fff;
	margin:30px auto;
}
.popCM iframe{
	width:745px;
	height:420px;
	margin:100px auto 0;
}
.btn_close{
	position:absolute;
	display:block;
	right:0;
	top:0;
	z-index:10002;
	cursor:pointer;
}







/*	[0] defined tags
----------------------------------------------------------------------------*/

body{
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:12px;
	line-height:18px;
}
body,div,p,form,table,ol,ul,dl{
	margin:0;
	padding:0;
	color:#333;
}
address,caption,cite,code,dfn,em,strong,th,var{
    font-style:normal;
    font-weight:normal;
}
h1,h2,h3,h4,h5,h6,strong,em{
	font-style:normal;
	margin:0;
	padding:0;
	color:#333;
}
li,dd,dt{
	margin:0;
	padding:0;
	list-style:none;
}
img{
	border:0;
}
a:link,a:visited{
	color:#3366CC;
	text-decoration:none;
	overflow: hidden;
    outline: none;
}
a:hover{
	text-decoration:underline;
}

/*	[1] basic structure
----------------------------------------------------------------------------*/
.html{
	width:100%;
}
body{
	position:relative;
	width:100%;
	background:#FFFFFF;
}

#hd{
	position:relative;
	width:920px;
	height:136px;
	margin:0 auto 10px;
	background:url(../common/bg_hd_red.gif) no-repeat;	
}
#hd #logo{
		position:absolute;
		left:16px;
		top:10px;
		width:144px;
		height:131px;
	}
	#hd #logo a{
		display:block;
		width:100%;
		height:100%;
		background:url(../common/aokispizza.png) no-repeat;	
		text-indent:-9999px;
	}
	
	#gn{
		position:absolute;
		left:189px;
		top:33px;
		width:709px;
		height:83px;
		background:url(../common/gn/bg.gif) no-repeat;
	}
	#gn li{
		display:block;
		position:absolute;
		width:75px;
		height:83px;
	}
	#gn li a{
		display:block;
		width:100%;
		height:83px;
		text-indent:-9999px;
		overflow:hidden;
	}
	#gn li#gn_od{
		width:109px;
	}
	
	#gn #gm_tpx			{	left:0px}
	#gn #gm_cpn			{	left:75px}
	#gn #gm_orig		{	left:150px}
	#gn #gm_ckn			{	left:225px}
	#gn #gm_salad		{	left:300px}
	#gn #gm_dst			{	left:375px}	
	#gn #gm_alg			{	left:450px}
	#gn #gm_shop		{	left:525px}
	#gn #gm_od			{	left:600px;	width:109px}
	
	#gn #gm_tpx:hover		{	background:url(../common/gn/gm_tpx_on.gif) no-repeat}
	#gn #gm_cpn:hover		{	background:url(../common/gn/gm_cpn_on.gif) no-repeat}
	#gn #gm_orig:hover		{	background:url(../common/gn/gm_orig_on.gif) no-repeat}
	#gn #gm_ckn:hover		{	background:url(../common/gn/gm_ckn_on.gif) no-repeat}
	#gn #gm_salad:hover		{	background:url(../common/gn/gm_salad_on.gif) no-repeat}
	#gn #gm_dst:hover		{	background:url(../common/gn/gm_dst_on.gif) no-repeat}
	#gn #gm_alg:hover		{	background:url(../common/gn/gm_alg_on.gif) no-repeat}
	#gn #gm_shop:hover		{	background:url(../common/gn/gm_shop_on.gif) no-repeat}
	#gn #gm_od:hover		{	background:url(../common/gn/gm_od_on.gif) no-repeat}

	

#breads{
		text-align:right;
		margin:0 0 20px;
	}
	#breads li{
		display:inline;
	}
	#breads h1{
		display:inline;
		font-weight:normal;
	}
	#breads *{
		font-size:12px;
	}
#main{
	position:relative;
	width:900px;
	margin:0 auto 40px;
}

#footer{
		width:920px;
		height:102px;
		margin:0 auto;
		background:url(../common/footer.gif) no-repeat;
	}
	#footer ul{
		padding:5px 0 0 23px;
	}
	#footer li{
		display:inline;
		margin-right:10px;
	}
	#footer li a{
		font-size:92%;
		color:#FFFFFF;
	}
	#footer .cp{
		position:relative;
		top:40px;
		left:470px;
		width:257px;
		font-size:12px;
		font-family: 'Roboto Condensed', "Impact", "Chicago", "Arial", sans-serif;
		font-weight:700;
		color:#FFFFFF;
	}
	#footer .cp a{
		font-size:12px;
		font-family: 'Roboto Condensed', "Impact", "Chicago", "Arial", sans-serif;
		color:#FFFFFF;
	}
	
.btn_sp{
	width:100%;
	text-align:center;
	margin:0 0 3em;
}
.btn_gray {/**/
	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background-color:#ededed;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf) );
	background:-moz-linear-gradient( center top, #ededed 5%, #dfdfdf 100% );
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #dcdcdc;
	display:inline-block;
	color:#666 !important;
	font-family:'ＭＳ ゴシック', 'MS Gothic', 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo, sans-serif;
	font-size:24px;
	font-weight:bold;
	padding:1em 1em 1.2em;
	text-decoration:none;
	text-shadow:1px 1px 0px #ffffff;
}
.btn_gray:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #ededed) );
	background:-moz-linear-gradient( center top, #dfdfdf 5%, #ededed 100% );
	background-color:#dfdfdf;
}


/*	table
----------------------------------------------------------------------------*/

.table-style1{
}

.table-style1 th{
	width:20%;
	padding:0.4em 1em 0.7em;
	background:beige;
	border-bottom:1px dotted #999;
}
.table-style1 td{
	width:20%;
	padding:0.4em 1em 0.7em 2em;
	background:#fff;
	border-bottom:1px dotted #999;
}

.erMsg {
	color:#FF6347;
	font-weight:bold;
	padding:20px;
	text-align:center;
}
.alert{
	display:inline-block;
	* zoom:1;
	* display:inline;
	padding:4px 1em;
	background:mistyrose;
	font-size:10px;
	line-height:12px;
	color:tomato;
}
.must{
	font-size:10px;
	line-height:12px;
	color:#C33;
}




/*	common
----------------------------------------------------------------------------*/
.clearfix:after {
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}
.clearfix {
	display:inline-block;
	* zoom:1;
	* display:inline;
}

.ff_meiryo{
	font-family: "ヒラギノ角ゴ Pro W5", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;
}

.clear{
	height:0px;
	clear:both;
}
.hr0	{ height:	0px; clear:both; border:none; opacity:0; filter: alpha(opacity=0); -ms-filter: "alpha(opacity=0)"; background-color: #fff; color: #fff;}
.hr10{ height:10px; clear:both; border:none; opacity:0; filter: alpha(opacity=0); -ms-filter: "alpha(opacity=0)"; background-color: #fff; color: #fff;}
.hr20{ height:20px; clear:both; border:none; opacity:0; filter: alpha(opacity=0); -ms-filter: "alpha(opacity=0)"; background-color: #fff; color: #fff;}
.hr30{ height:30px; clear:both; border:none; opacity:0; filter: alpha(opacity=0); -ms-filter: "alpha(opacity=0)"; background-color: #fff; color: #fff;}
.hr40{ height:40px; clear:both; border:none; opacity:0; filter: alpha(opacity=0); -ms-filter: "alpha(opacity=0)"; background-color: #fff; color: #fff;}
.hr50{ height:50px; clear:both; border:none; opacity:0; filter: alpha(opacity=0); -ms-filter: "alpha(opacity=0)"; background-color: #fff; color: #fff;}


.hide{
	display:none;
}
.sml,.sml > *,{
	font-size:10px;
	line-height:13px;
}

.btn_pagetop{
	display:block;
	position:fixed;
	left:0;
	bottom:0;
	width:45px;
	height:45px;
	opacity:0;
	z-index:99;
}
.btn_pagetop_on{
	opacity:1 !important;
}

	.btn_pagetop a{
		display:block;
		width:63px;
		height:63px;
		cursor:pointer;
	}
	.btn_pagetop a:hover{
	}
	
.pagetop{
	text-align:right;
	margin:5px 0 20px;
}
.cl_white{
	color:#fff;
}
.cl_tomato{
	color:tomato;
}
.cl_red{
	color:#CC3333;
}


/* display
---------------------------------------------------------------------*/
.block{
	display:block;
}
.inblock{
	display:inline-block;
	* zoom:1;
	* display:inline;
}
.inline{
	display:block;
}


/* css3
---------------------------------------------------------------------*/
/* radius */
.r4		{-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;}
.r6		{-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;}
.r8		{-webkit-border-radius:8px;-moz-border-radius:8px;border-radius:8px;}
.r10		{-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px;}
.r12		{-webkit-border-radius:12px;-moz-border-radius:12px;border-radius:12px;}
.r16		{-webkit-border-radius:16px;-moz-border-radius:16px;border-radius:16px;}

/* shadow */
.shadow2	{ box-shadow: 1px 1px 2px #666; -moz-box-shadow: 1px 1px 2px #666; -webkit-box-shadow: 1px 1px 2px #666;	}
.shadow4	{ box-shadow: 1px 1px 4px #666; -moz-box-shadow: 1px 1px 4px #666; -webkit-box-shadow: 1px 1px 4px #666;	}
.shadow6	{ box-shadow: 1px 1px 6px #666; -moz-box-shadow: 1px 1px 6x #666; -webkit-box-shadow: 1px 1px 6px #666;	}
.shadow8	{ box-shadow: 1px 1px 8px #666; -moz-box-shadow: 1px 1px 8x #666; -webkit-box-shadow: 1px 1px 8px #666;	}
.shadow10	{ box-shadow: 1px 1px 10px #666; -moz-box-shadow: 1px 1px 10px #666; -webkit-box-shadow: 1px 1px 10px #666;	}



/* align
---------------------------------------------------------------------*/

.floatR{
	z-index:10;
	float:right;
	margin:0 0 10px 10px;
}
.floatL{
	z-index:10;
	float:left;
	margin:0 0 10px 10px;
}
.floatC{
	margin:0 auto 0;
}
.alignL{
	text-align:left;
}
.alignR{
	text-align:right;
}
.alignC{
	text-align:center;
}


/* border */

.bd0{
	background:url(../common/dot.gif) bottom repeat-x;
}
.bd{
	height:1px;
	background:url(../common/dot.gif) bottom repeat-x;
}
.bd3{
	height:1px;
	background:url(../common/dot.gif) bottom repeat-x;
	margin:1px 0;
}
.bd5{
	height:1px;
	background:url(../common/dot.gif) bottom repeat-x;
	margin:2px 0;
}
.bd7{
	height:1px;
	background:url(../common/dot.gif) bottom repeat-x;
	margin:3px 0;
}
.bd9{
	height:1px;
	background:url(../common/dot.gif) bottom repeat-x;
	margin:4px 0;
}
.bd11{
	height:1px;
	background:url(../common/dot.gif) bottom repeat-x;
	margin:5px 0;
}
.bd13{
	height:1px;
	background:url(../common/dot.gif) bottom repeat-x;
	margin:6px 0;
}
.bd15{
	height:1px;
	background:url(../common/dot.gif) bottom repeat-x;
	margin:7px 0;
}
.bd21{
	height:1px;
	background:url(../common/dot.gif) bottom repeat-x;
	margin:10px 0;
}
.bd31{
	height:1px;
	background:url(../common/dot.gif) bottom repeat-x;
	margin:15px 0;
}

/* font / line */
.bold		{font-weight:bold !important}
.normal		{font-weight:normal !important}
.sml,.sml * 	{font-size:11px;line-height:13px !important}
.ssml,.ssml * 	{font-size:10px;line-height:12px !important}

.fs_6	{font-size:6px !important}
.fs_7	{font-size:7px !important}
.fs_8	{font-size:8px !important}
.fs_9	{font-size:9px !important}
.fs_10	{font-size:10px !important}
.fs_11	{font-size:11px !important}
.fs_12	{font-size:12px !important}
.fs_13	{font-size:13px !important}
.fs_14	{font-size:14px !important}
.fs_15	{font-size:15px !important}
.fs_16	{font-size:16px !important}
.fs_18	{font-size:18px !important}
.fs_20	{font-size:20px !important}
.fs_22	{font-size:22px !important}
.fs_24	{font-size:24px !important}

.line50	{line-height:50% !important}
.line60	{line-height:60% !important}
.line70	{line-height:70% !important}
.line80	{line-height:80% !important}
.line90	{line-height:90% !important}
.line100	{line-height:100% !important}
.line110	{line-height:110% !important}
.line120	{line-height:120% !important}
.line130	{line-height:130% !important}
.line140	{line-height:140% !important}
.line150	{line-height:150% !important}
.line160	{line-height:160% !important}
.line170	{line-height:170% !important}
.line180	{line-height:180% !important}
.line190	{line-height:190% !important}
.line200	{line-height:200% !important}
.line220	{line-height:220% !important}
.line240	{line-height:240% !important}
.line260	{line-height:260% !important}
.line280	{line-height:280% !important}
.line300	{line-height:300% !important}

/* margin control */

.bottom90{margin-bottom:90px !important}
.bottom80{margin-bottom:80px !important}
.bottom70{margin-bottom:70px !important}
.bottom60{margin-bottom:60px !important}
.bottom50{margin-bottom:50px !important}
.bottom40{margin-bottom:40px !important}
.bottom30{margin-bottom:30px !important}
.bottom20{margin-bottom:20px !important}
.bottom15{margin-bottom:15px !important}
.bottom10{margin-bottom:10px !important}
.bottom7{margin-bottom:7px !important}
.bottom5{margin-bottom:5px !important}
.bottom3{margin-bottom:3px !important}

.top50{margin-top:50px !important}
.top40{margin-top:40px !important}
.top30{margin-top:30px !important}
.top20{margin-top:20px !important}
.top15{margin-top:15px !important}
.top10{margin-top:10px !important}
.top7{margin-top:7px !important}
.top5{margin-top:5px !important}
.top3{margin-top:3px !important}


.left50{margin-left:50px !important}
.left40{margin-left:40px !important}
.left30{margin-left:30px !important}
.left20{margin-left:20px !important}
.left15{margin-left:15px !important}
.left10{margin-left:10px !important}
.left7{margin-left:7px !important}
.left5{margin-left:5px !important}
.left3{margin-left:3px !important}


/* width */
.width600{width:600px !important}
.width550{width:550px !important}
.width500{width:500px !important}
.width450{width:450px !important}
.width400{width:400px !important}
.width350{width:350px !important}
.width300{width:300px !important}
.width250{width:250px !important}
.width200{width:200px !important}
.width150{width:150px !important}
.width100{width:100px !important}
.width50{width:50px !important}

/* height */
.height600{height:600px !important}
.height550{height:550px !important}
.height500{height:500px !important}
.height450{height:450px !important}
.height400{height:400px !important}
.height350{height:350px !important}
.height300{height:300px !important}
.height250{height:250px !important}
.height200{height:200px !important}
.height150{height:150px !important}
.height100{height:100px !important}
.height75{height:75px !important}
.height50{height:50px !important}
.height40{height:40px !important}
.height30{height:30px !important}
.height20{height:20px !important}
.height10{height:10px !important}