@charset "utf-8";

/*
------------------------------------
common
------------------------------------
*/

body{font-family: "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-size:13px; line-height:1.4; color:#333; background:#fffdf7; overflow-x:hidden; -webkit-text-size-adjust: none; }
img{vertical-align:bottom;}
img.responsive{max-width:100%; height:auto; overflow:hidden; line-height:1;}
.container{margin:0 auto;}
a{text-decoration:none; color:#333;}
.container a:hover img{
	opacity:0.6;
  -moz-opacity:0.6;
  filter:alpha(opacity = 60);
}

/*
------------------------------------
header
------------------------------------
*/
header #header{background-color:#fff; border-bottom:2px solid #d6000f;}
header #logo-corporation{/*max-width:227px; max-height:48px;*/ width:150px; overflow:hidden; display:block;}


/*
------------------------------------
footer
------------------------------------
*/
#share{float:right;}
body.index #share{margin-top:20px;}
#share li{float:left; margin-left:10px;}

#footer{font-size:0.84em; background:#fff; border-top:1px solid #ccc;}
#footer ul li{background:url(/jp/coop_recipe/img/ft_icon02.gif) left center no-repeat; padding-left:10px; margin-left:10px; display:inline-block;}

/*
------------------------------------
navigation
------------------------------------
*/
.spmenu{display: none;}

.main_menu {
    margin-top: 40px;
    display: flex;
    justify-content:center;
    flex-wrap: wrap;
    align-items: stretch;
}

.main_menu li{
	width: 180px;
	margin-bottom: 20px;
    display: flex;
}

.main_menu li a figure{ max-width: 100%; text-align: center;}
.main_menu li a figure img{ width: 50%;}

.main_menu li a div.cold{
    background: #289AED;
    color: #fff;
	display: inline-block;
    font-size: 12px;
    padding: 3px 10px;
    border-radius: 3px;
	margin-bottom: 10px;
}

.main_menu li a div.normal{
    background: #ED6C28;
	color: #fff;
	display: inline-block;
    font-size: 12px;
    padding: 3px 10px;
    border-radius: 3px;
	margin-bottom: 5px;
}

.main_menu li a strong{
	display: block;
	font-weight: bold !important;
}

.main_menu li a{
	font-size: 14px;
    display: block;
    border: solid 1px #FA7878;
    border-radius: 5px;
    background: #fff;
    padding: 10px;
    color: #FF3333;
    text-align: center;
}

.main_menu li a:hover{
    border: solid 1px #FA7878;
    background: #FA7878;
    color: #fff;
	opacity: 1;
}

.main_menu li a:hover figure{
	background: #fff;
}

.main_menu li a:hover figure img{
	opacity: 1;
}


.main_menu::before{ width: 180px; height: 0;content: "";display: block;order: 1;}
.main_menu::after{ width: 180px; height: 0;}


@media (max-width: 1065px){
	.main_menu {display: none;}
	.spmenu{display: block; padding: 20px 10px 0;}
	.spmenu select{  width: 100%;font-size: 16px;padding: 10px;border-radius: 5px;}
}

/*
------------------------------------
navigation #naviLarge
------------------------------------
*/

/*
PC用のサイドナビはside.cssに記述*/
#page-top{margin-top:20px; margin-left:-10px;}
#page-top a {
    background: #777;
		width:65px;
		padding:10px 0;
    text-align: center;
		margin:0 auto;
    display: block;
    border-radius: 5px;
		-moz-border-radius:5px;
		-webkit-border-radius:5px;
		-o-border-radius:5px;
		-ms-border-radius:5px;
		behavior:url("/coop_recipe/PIE.htc");
}
#page-top a:hover {
    text-decoration: none;
    background: #ccc;
}
#page-top a:hover img{
	opacity:1.0;
  -moz-opacity:1.0;
  filter:alpha(opacity = 100);
}

.slicknav_menu .slicknav_menutxt{display:none !important;}
		.slicknav_btn{border-radius:2px; margin-top: 5px;}
    .slicknav_menu {display:none;}
		.js #menu {display:none;}

@media (max-width:1065px) {
	.js #menu {display:none;}
	.js .slicknav_menu {display:block;}
	.demo-container{display:none;}
	
	
}

@media (max-width: 479px){
	.slicknav_menu img{max-height:20px !important; width:auto; margin-right:5px;}
}

@media (max-width: 767px){
	.top{
		margin:0 !important;
		position:fixed !important;
		top:0;
		left:0;
		background:#fffdf7 !important;
		width:100%;
		height:55px;
		box-shadow: 0 3px 5px rgba(0,0,0,0.15);
		-moz-box-shadow: 0 3px 5px rgba(0,0,0,0.15);
		-webkit-box-shadow: 0 3px 5px rgba(0,0,0,0.15);
		-o-box-shadow: 0 3px 5px rgba(0,0,0,0.15);
		-ms-box-shadow: 0 3px 5px rgba(0,0,0,0.15);
		z-index:1000;
		}
	header .top h1#logo-recipe {position: fixed; top:5px !important; left:10px; z-index: 5000;}
	.top2.slicknav_menu{
		position:fixed !important;
		top:5px !important;
		z-index: 3000;
		right:10px;
	}
	.top p{display:none;}
}

@media screen and (min-width:768px){
	.slicknav_menu img{max-height:30px; width:auto; margin-right:10px;}
}

/*
------------------------------------
Responsive
------------------------------------
*/

@media (max-width: 767px){
	.print{display:none;}
	header .container{padding:0 10px !important;}
	header #header{padding:8px 0;}
	header #logo-corporation img {max-height:30px; width:auto;}
	header .header2{margin:10px auto;}
	header h1#logo-recipe{z-index:5000; position:absolute; top:50px; left:10px;}
	header .header2 p{margin-top:5px; padding-top:40px;}
	header .header2 p br{display: none;}
	header #logo-recipe img{max-height:25px; width:auto;}
	#footer{text-align:center; margin-top:20px; padding:10px 0;}
	#footer ul li.social{text-align:center; clear:both;}
	#copy{clear:both; font-size:11px; margin-top:5px;}
	#share{padding-right:10px;}	
	.slicknav_menu{top:50px !important;}
	.container{padding:0 !important;}
}

@media screen and (min-width: 768px){
	header #logo-corporation img {/*max-height:40px;*/ width:auto;}
	header #header{padding:12px 0;}
	
	header .header2{margin:10px 0 15px;}
	header h1#logo-recipe{z-index:5000; position:absolute; top:75px; left:10px;}
	header #logo-recipe img{max-height:45px; width:auto; float:left;}
	.header2 p{padding-left:300px; box-sizing:border-box; float:left;}	
	#footer{margin-top:40px; padding:10px 0;}
	#footer a:hover{text-decoration:underline;}
	#footer #copy{float:left;}
	#footer ul li{float:right;}
	#share{padding-right:25px;}
	
}

/*--PCブラウザ--*/

@media (max-width:1065px){	
	#navLarge{display:none;}
	.container{padding:0 10px;}
}

@media screen and (min-width: 1066px){
	.container{max-width:1180px; margin:0 auto;}
	body{font-size:15px;}
	.container{padding:0;}
	header h1#logo-recipe { position:static;}
	header #logo-corporation img { /*max-height:48px; width:227px;*/ float:left;}
	header #header{padding:15px 0;}
	header .header2{margin:10px auto 20px; padding:0 15px; vertical-align:bottom;}
	header #logo-recipe img{float:left; max-width:326px; max-height:50px; padding-right:10px;}
	header .header2 p{padding-left:10px; margin-top: 8px;}
}



/*
------------------------------------
印刷
------------------------------------
*/
@media print{
	.print{display:none}
}
.btn_print{
	border: 0px;
	width: 40px;
	height: 40px;
	background: url(/coop_recipe/img/icon_print.png) no-repeat;
}
.btn_print:hover {cursor:pointer;}