@charset "utf-8";

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

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


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

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


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


@font-face{
	font-family: "Yu Gothic";
	src: local("Yu Gothic Medium");
	font-weight: 500;
}
@font-face{
	font-family: "Yu Gothic";
	src: local("Yu Gothic Bold");
	font-weight: bold;
}

body{
	font-family: "Yu Gothic", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
	font-size: 16px;
	font-weight:500;
	line-height:2;
	font-feature-settings : "palt";
	-webkit-text-size-adjust: none;
	text-rendering:optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	-webkit-text-size-adjust: 100%;
}

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;
}
area{
	border:none;
	outline:none;
}

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

body#page{
	padding-top:180px;
}

#hd{
	position:fixed;
	left:0;
	top:0;
	width:100%;
	height:136px;
	background:rgba(255,255,255,.9);
	z-index:100;
}
	#hd > div{
		position:relative;
		width:920px;
		height:100%;
		background:url(../common/bg_hd_red.png) no-repeat top center;
		margin:0 auto;
	}
	#hd #logo{
		position:absolute;
		left:14px;
		top:10px;
		width:190px;
		height:131px;
	}
	#hd #logo a:nth-child(1){
		display:block;
		width:145px;
		height:131px;
		background:url(../common/aokispizza.png) no-repeat;	
		text-indent:-9999px;
		overflow:hidden;
	}
	#hd #logo a:nth-child(2){
		position:absolute;
		left:137px;
		top:82px;
		display:block;
		content:'';
		width:49px;
		height:17px;
		background:url(../common/gm/i_home.png) no-repeat;
		cursor:pointer;
		z-index:1;
	}
	
	#gm{
		position:absolute;
		right:0;
		top:33px;
		width:700px;
		height:83px;
		background:none;
	}
	#gm li{
		position:relative;
		display:block;
		float:left;
		width:72px;
		height:100%;
		background:url(../common/gm/gm_btn.gif) no-repeat;
	}
	#gm li:hover{
		background:url(../common/gm/gm_btn_on.gif) no-repeat;
	}
	#gm #gm_home{
		background:url(../common/gm/gm_btn-stayhome.gif) no-repeat;
	}
	#gm #gm_home:hover{
		background:url(../common/gm/gm_btn-stayhome_on.gif) no-repeat;
	}
	#gm #gm_shop{
		background:url(../common/gm/gm_btn-shop.gif) no-repeat;
	}
	#gm #gm_shop:hover{
		background:url(../common/gm/gm_btn-shop_on.gif) no-repeat;
	}
	#gm #gm_od{
		background:url(../common/gm/gm_btn-od.gif) no-repeat;
		width:109px;
	}
	#gm #gm_od:hover{
		background:url(../common/gm/gm_btn-od_on.gif) no-repeat;
		width:109px;
	}
	#gm li a{
		position:relative;
		display:block;
		top:24px;
		width:68px;
		height:54px;
		text-indent:-9999px;
		background-position:0 50%;
		background-repeat:no-repeat;
		overflow:visible;
	}
	
	#gm #gm_home a			{	background-image:url(../common/gm/m_stayhome.png)}
	#gm #gm_tpx	a			{	background-image:url(../common/gm/m_birthday.png)}
	#gm #gm_cpn	a			{	background-image:url(../common/gm/m_cpn.png)}
	#gm #gm_orig a			{	background-image:url(../common/gm/m_orig.png)}
	#gm #gm_ckn	a			{	background-image:url(../common/gm/m_ckn.png)}
	#gm #gm_salad a			{	background-image:url(../common/gm/m_salad.png)}
	#gm #gm_dst	a			{	background-image:url(../common/gm/m_dst.png)}	
	#gm #gm_shop a			{	background-image:url(../common/gm/m_shop.png)}
	#gm #gm_od a			{	background-image:url(../common/gm/m_od_l.png);	width:102px; height:75px; top:2px}
	
	
	#gm #gm_home a::after{
		position:absolute;
		content:'';
		left:0;
		top:-27px;
		width:100%;
		height:100%;
		background:url(../common/gm/m_stayhome-copy.png) no-repeat;
		z-index:1;
		pointer-events:none;
	}

#hd.hd_fixed{
	position:fixed;
}


	

#breads{
		text-align:right;
		margin:0 0 20px;
	}
	#breads li, #breads li a{
		display:inline;
		font-size:12px;
	}
	
#main{
	position:relative;
	width:900px;
	margin:0 auto 40px;
}
	#main::after{
		display: block;
		clear: both;
		content: "";
	}
	#mainL{
		float:left;
		width:660px;
	}
	#mainR{
		position:relative;
		float:right;
		width:220px;
	}
	/*
	#mainR > .wrap{
		position:fixed;
	}
	#mainR > .wrap.relative{
		position:relative;
	}*/

#footer{
		width:920px;
		height:102px;
		margin:0 auto;
		background:url(../common/footer.gif) no-repeat;
	}
	#footer ul{
		padding:0 0 0 23px;
	}
	#footer li{
		display:inline;
		margin-right:10px;
	}
	#footer li a{
		font-size:12px;
		color:#FFFFFF;
	}
	#footer .cp{
		position:relative;
		top:33px;
		left:475px;
		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 {
	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-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;
}

.anchor{
	position:relative;
	width:0;
	height:0;
}
.anchor > a{
	position:absolute;
	top:-180px;
	left:0;
	width:0;
	height:0;
}




/*	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;
}



/*	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{
	display: block;
	clear: both;
	content: "";
}
.clear{
	height:0px;
	clear:both;
}

.ttl_normal{
	font-size:1.1rem;
	font-weight:bold;
}

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


.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;}


.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;
}
.inline{
	display:block;
}
.hide{
	display:none;
}


/* 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:13px;line-height:14px !important}
.ssml,.ssml * 	{font-size:12px;line-height:13px !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}



/*	2021-
----------------------------------------------------------------------------*/

.pagettl{
	position:relative;
	display:flex;
	padding-bottom:10px;
    border-bottom:1px dotted gray;
    margin-bottom:30px;
}
	.pagettl .ttl{
		width:70%;
	}
	.pagettl .btn_od{
		display:block;
		width:70%;
		text-align:right;
	}


.notes{
	color:#CC3333;
	font-size:1rem;
	line-height:1.4;
}