@charset "utf-8";

/*===================================================================
	topIndex
===================================================================*/
#topIndex {}

#topIndex #mainVisual { position:relative; border-bottom:solid 1px #dddddd; }

#topIndex #mainVisual .visual { position:relative; min-width:980px; height:380px; overflow:hidden; }
#topIndex #mainVisual .visual li {
	position:absolute;
	top:0;
	left:50%;
	width:1300px;
	margin-left:-650px;
	text-align:center;
	opacity:0;
	filter: alpha(opacity=0);			/* ie lt 8 */
	-ms-filter: "alpha(opacity=0)";		/* ie 8 */
	-moz-opacity:0;						/* FF lt 1.5, Netscape */
	-khtml-opacity:0;					/* Safari 1.x */
}

#topIndex #mainVisual .visual li:first-child {
	opacity:1.0;
	filter: alpha(opacity=100);			/* ie lt 8 */
	-ms-filter: "alpha(opacity=100)";	/* ie 8 */
	-moz-opacity:1.0;					/* FF lt 1.5, Netscape */
	-khtml-opacity: 1.0;				/* Safari 1.x */
}

#topIndex #mainVisual .visual a { display:block; }
#topIndex #mainVisual .visual a:hover img {
	opacity:0.8;
	filter: alpha(opacity=80);			/* ie lt 8 */
	-ms-filter: "alpha(opacity=80)";	/* ie 8 */
	-moz-opacity:0.8;					/* FF lt 1.5, Netscape */
	-khtml-opacity: 0.8;				/* Safari 1.x */
}


#topIndex #mainVisualInr { position:absolute; top:0; left:50%; width:980px; height:380px; margin-left:-490px; }
#topIndex #mainVisualInr .controls { position:absolute; top:0; right:0; width:176px; height:380px; background: url(/img/controls_bg.png) no-repeat 0 0; z-index:100; }
#topIndex #mainVisualInr .controls .up { position:absolute; top:8px; }
#topIndex #mainVisualInr .controls .dwn { position:absolute; bottom:8px; }
#topIndex #mainVisualInr .controls .active { position:absolute; top:143px; }
#topIndex #mainVisualInr .controls .thumbnail { position:relative; width:176px; height:302px; margin-top:38px; overflow:hidden; }
#topIndex #mainVisualInr .controls .thumbnail ul { position:absolute; top:-120px; left:8px; }
#topIndex #mainVisualInr .controls .thumbnail ul li { margin-top:27px; }
#topIndex #mainVisualInr .controls .thumbnail ul li a:hover img {
	opacity:0.6;
	filter: alpha(opacity=60);			/* ie lt 8 */
	-ms-filter: "alpha(opacity=60)";	/* ie 8 */
	-moz-opacity:0.6;					/* FF lt 1.5, Netscape */
	-khtml-opacity: 0.6;				/* Safari 1.x */
}

#topIndex #mainVisualInr .pagination { position:absolute; bottom:10px; right:190px; z-index:100; }
#topIndex #mainVisualInr .pagination li { float:left; margin-left:6px; }
#topIndex #mainVisualInr .pagination li p { display:block; width:12px; height:12px; background:url(/img/pagination_ico.png) no-repeat 0 0; text-indent:-9999px; }
#topIndex #mainVisualInr .pagination li p.act { background:url(/img/pagination_ico_act.png) no-repeat 0 0; }

#topIndex #container { padding-top:50px; }

#topIndex #container .headLine { position:relative; }
#topIndex #container .headLine a { position:absolute; top:4px; right:0; }

#topIndex #container #sec01 { }
#topIndex #container #sec01 .info { float:left; width:394px; }

#topIndex #container #sec01 .info .tab li { float:left; }
#topIndex #container #sec01 .info .tab li a { display:block; width:197px; height:40px; text-indent:-9999px; overflow:hidden; }
#topIndex #container #sec01 .info .tab li a.news { background:url(/img/tab01.gif) no-repeat 0 0; }
#topIndex #container #sec01 .info .tab li a.ir { background:url(/img/tab02.gif) no-repeat 0 0; }
#topIndex #container #sec01 .info .tab li.act a.news { background:url(/img/tab01_act.gif) no-repeat 0 0; }
#topIndex #container #sec01 .info .tab li.act a.ir { background:url(/img/tab02_act.gif) no-repeat 0 0; }
#topIndex #container #sec01 .info .each { height:324px; background:url(/img/eachbox_bg.gif) no-repeat left bottom; overflow-y:auto; }
#topIndex #container #sec01 .info .each .inner { padding:13px; }
#topIndex #container #sec01 .info .each .lnk { text-align:right; }
#topIndex #container #sec01 .info .each dl { margin-top:-10px; }
#topIndex #container #sec01 .info .each dt { margin-top:17px; }
#topIndex #container #sec01 .info .each dt .date { float:left; }
#topIndex #container #sec01 .info .each dt .ico { display:block; width:80px; margin-left:7em; }
#topIndex #container #sec01 .info .each dd { margin-top:5px; }

#topIndex #container #sec01 .recommend { float:right; width:556px; }
#topIndex #container #sec01 .recommend ul { margin-left:-15px; }
#topIndex #container #sec01 .recommend li { float:left; margin:14px 0 0 15px; }
#topIndex #container #sec01 .recommend li a { display:block; }

#topIndex #container #sec02 { margin-top:60px; }
#topIndex #container #sec02 .products { margin-left:-15px; margin-top:5px; }
#topIndex #container #sec02 .products li { float:left; width:234px; margin-left:15px; }
#topIndex #container #sec02 .products li:first-child + li + li + li { width:233px; }
#topIndex #container #sec02 .products li dt,
#topIndex #container #sec02 .products li dd { margin-top:10px; }

#topIndex #container #sec03 { margin-top:60px; }
#topIndex #container #sec03 .restaurant { float:left; width:728px; }
#topIndex #container #sec03 .restaurant ul { margin-left:-28px; margin-top:5px; }
#topIndex #container #sec03 .restaurant li { float:left; width:224px; margin-left:28px; }

#topIndex #container #sec03 .restaurant li dt,
#topIndex #container #sec03 .restaurant li dd { margin-top:10px; }

#topIndex #container #sec03 .bakery { float:right; width:224px; }
#topIndex #container #sec03 .bakery dt { margin-top:15px; }
#topIndex #container #sec03 .bakery dd { margin-top:10px; }

#topIndex #container #sec04 { margin-top:60px; }
#topIndex #container #sec04 .brand { margin-left:-28px; margin-top:5px; }
#topIndex #container #sec04 .brand li { float:left; width:224px; margin-left:28px; }

#topIndex #container #sec04 .brand li dt,
#topIndex #container #sec04 .brand li dd { margin-top:10px; }


#topIndex #container #sec01 .recommend li a:hover img,
#topIndex #container #sec02 .products dt a:hover img,
#topIndex #container #sec03 .restaurant dt a:hover img,
#topIndex #container #sec03 .bakery dt a:hover img,
#topIndex #container #sec04 .brand dt a:hover img {
	opacity:0.6;
	filter: alpha(opacity=60);			/* ie lt 8 */
	-ms-filter: "alpha(opacity=60)";	/* ie 8 */
	-moz-opacity:0.6;					/* FF lt 1.5, Netscape */
	-khtml-opacity: 0.6;				/* Safari 1.x */
}


/*===================================================================
	SP view
===================================================================*/
@media (max-width:640px) {
/* mainVisual */
#topIndex #sp-mainVisual { position:relative; width:100%; }
#topIndex #sp-mainVisual img { width:100%; height:auto; }

#topIndex #sp-mainVisual .visual { position:relative; width:100%; border-bottom:solid 1px #dddddd; overflow:hidden; }
#topIndex #sp-mainVisual .visual ul { }
#topIndex #sp-mainVisual .visual li { position:absolute; top:0; left:0; width:100%; }

#topIndex #sp-mainVisual .controls { }
#topIndex #sp-mainVisual .controls li { position:absolute; top:50%; width:25px; height:50px; margin-top:-25px; }
#topIndex #sp-mainVisual .controls .left { left:0; }
#topIndex #sp-mainVisual .controls .right { right:0; }

#topIndex #sp-mainVisual .pagination { height:8px; margin:0.5em 0 0; text-align:center; }
#topIndex #sp-mainVisual .pagination ul { display:inline-block; }
#topIndex #sp-mainVisual .pagination li { float:left; margin-left:6px; }
#topIndex #sp-mainVisual .pagination li:first-child { margin-left:0; }
#topIndex #sp-mainVisual .pagination li p { display:block; width:8px; height:8px; background:url(/sp/img/pagination_ico.png) no-repeat 0 0; background-size:8px; text-indent:-9999px; }
#topIndex #sp-mainVisual .pagination li p.act { background:url(/sp/img/pagination_ico_act.png) no-repeat 0 0; background-size:8px; }	

/* container */
#topIndex #container { padding-top:15px; }
#topIndex #container .headLine { margin-top:40px; text-align:right; }
#topIndex #container .headLine .sp-heading { display:block; padding:5px 0 15px; background:url(/sp/common/img/line_dot_x_3line.png) repeat-x left bottom; background-size:3px auto; text-align:left; font-size:124%; }
#topIndex #container .headLine a { position:static; display:inline-block; margin-top:10px; }
#topIndex #container .headLine a .sp-link { display:inline-block; color:#8b3d56; position:relative; padding-right:12px; }
#topIndex #container .headLine a .sp-link:after { content:""; display:inline-block; width:8px; height:8px; border-right:2px solid #8b3d56; border-bottom:2px solid #8b3d56; position:absolute; top:50%; right:0; -webkit-transform:translateY(-50%) rotate(-45deg); transform:translateY(-50%) rotate(-45deg); }

/* sec01 */
#topIndex #container #sec01 .info { float:none; width:100%; }
#topIndex #container #sec01 .info .tabBlock { background:url(/sp/common/img/line_dot_x.png) repeat-x left bottom; background-size:3px 1px; }
#topIndex #container #sec01 .info .tab li { display:table; width:50%; background:url(/sp/common/img/line_dot_x.png) repeat-x left bottom; background-size:3px 1px; }
#topIndex #container #sec01 .info .tab li a { display:table-cell; vertical-align:middle; width:100%; height:48px; padding:4px 0; text-indent:0; text-align:center; }
#topIndex #container #sec01 .info .tab li a.news,
#topIndex #container #sec01 .info .tab li a.ir { background:url(/sp/common/img/bg_dot.png) repeat left top; background-size:3px 3px; }
#topIndex #container #sec01 .info .tab li.act a { padding-bottom:0; border-bottom:4px solid #8b3d56; color:#8b3d56; font-weight:bold; }
#topIndex #container #sec01 .info .tab li.act a.news,
#topIndex #container #sec01 .info .tab li.act a.ir { background:url(/sp/common/img/line_dot_topleft.png) no-repeat left top, url(/sp/common/img/line_dot_y.png) repeat-y right bottom; background-size:800px 800px, 1px 3px; }
#topIndex #container #sec01 .info .each { background-image:url(/sp/common/img/line_dot_y.png), url(/sp/common/img/line_dot_y.png); background-repeat:repeat-y; background-position:left top, right top; background-size:1px 3px; }
#topIndex #container #sec01 .info .each::-webkit-scrollbar { width:4px; background:rgba(240,231,234,0.6); }
#topIndex #container #sec01 .info .each::-webkit-scrollbar-thumb { background:rgba(139,61,86,0.8); }
#topIndex #container #sec01 .info .each .inner { padding:10px; }
#topIndex #container #sec01 .info .each .lnk { text-align:right; }
#topIndex #container #sec01 .info .each .lnk a .sp-link { display:inline-block; color:#8b3d56; position:relative; padding-right:12px; }
#topIndex #container #sec01 .info .each .lnk a .sp-link:after { content:""; display:inline-block; width:8px; height:8px; border-right:2px solid #8b3d56; border-bottom:2px solid #8b3d56; position:absolute; top:50%; right:0; -webkit-transform:translateY(-50%) rotate(-45deg); transform:translateY(-50%) rotate(-45deg); }

#topIndex #container #sec01 .recommend { float:none; width:100%; }
#topIndex #container #sec01 .recommend ul { margin:15px 0 0; }
#topIndex #container #sec01 .recommend li { width:50%; margin:0; }
#topIndex #container #sec01 .recommend li:nth-of-type(odd) { padding-right:5px; }
#topIndex #container #sec01 .recommend li:nth-of-type(even) { float:right; padding-left:5px; }
#topIndex #container #sec01 .recommend li:nth-of-type(n+3) { margin-top:10px; }

/* sec02-04 */
#topIndex #container #sec02,
#topIndex #container #sec03 { margin-top:0; }

#topIndex #container #sec03 .restaurant,
#topIndex #container #sec03 .bakery { float:none; width:100%; }
#topIndex #container #sec02 .products,
#topIndex #container #sec03 .restaurant ul,
#topIndex #container #sec03 .bakery ul,
#topIndex #container #sec04 .brand { letter-spacing:-0.4em; margin:20px 0 0 -10px; display:-webkit-flex; -webkit-flex-wrap:wrap; display:flex; flex-wrap:wrap; }
#topIndex #container #sec02 .products li,
#topIndex #container #sec03 .restaurant ul li,
#topIndex #container #sec03 .bakery ul li,
#topIndex #container #sec04 .brand li { float:none; letter-spacing:normal; display:inline-block; vertical-align:top; width:50%; margin:0; padding-left:10px; }
#topIndex #container #sec02 .products li:first-child + li + li + li { width:50%; }
#topIndex #container #sec02 .products li:nth-of-type(n+3),
#topIndex #container #sec03 .restaurant li:nth-of-type(n+3),
#topIndex #container #sec04 .brand li:nth-of-type(n+3) { margin-top:20px; }
#topIndex #container #sec02 .products li dt:first-child,
#topIndex #container #sec03 .restaurant li dt:first-child,
#topIndex #container #sec03 .bakery li dt:first-child,
#topIndex #container #sec04 .brand li dt:first-child { margin-top:0; }
#topIndex #container #sec02 .products li dt .sp-heading,
#topIndex #container #sec03 .restaurant li dt  .sp-heading,
#topIndex #container #sec03 .bakery li dt  .sp-heading,
#topIndex #container #sec04 .brand li dt  .sp-heading { display:block; background:url(/sp/common/img/head_ico_3x3_gray.png) no-repeat left 0.3em; background-size:7px 7px; padding-left:12px; font-weight:normal; }
#topIndex #container #sec02 .products li dd,
#topIndex #container #sec03 .restaurant li dd,
#topIndex #container #sec03 .bakery li dd,
#topIndex #container #sec04 .brand li dd { font-size:85%; }
}/* @media */

/*===================================================================
	only PC
===================================================================*/
@media (min-width:641px) {
#topIndex #sp-mainVisual { display:none; }
}/* @media */