@charset "utf-8";

@import url("reset.css");

/*==========================================
////////////// 共通 ///////////////
==========================================*/

/*------------------------------------------
■ header
------------------------------------------*/

.header {
	margin:auto;
	padding-top:15px;
	max-width:1100px;
	overflow:hidden;
	top:0;
	left: 0;
	right: 0;
	z-index:999;
	position:absolute;
}

.header h1 { margin:0 0 18px 0; font-size:12px;}
.header .logo { margin-top:15px; display:block;}
.header .logo a { display:block;}
.header .topSubmenu a { margin-left:10px; display:block; float:right;}
.header .menu {
	margin:0;
	padding:0;
	background-color: transparent;
}

/*------------------------------------------
■ footer
------------------------------------------*/

footer { overflow:hidden;}
footer .footerArea {
	padding:20px 0 165px 0;
	background:url(../images/footer_bg.jpg) no-repeat #FFF;
	background-position:center bottom;
	min-height:165px;
	position:relative;
}
footer .newsBox {
	margin:15px auto 0 auto;
	max-width:1100px;
	font-size:13px;
	overflow:hidden;
}
footer .newsBox section {
	padding:0;
}
footer .newsBox .title {
	margin:10px 0 0 0;
	padding:0 0 3px 0;
	border-bottom:3px #FFD800 solid;
	overflow:hidden;
}
footer .newsBox .title h3 {
	font-size:30px;
	font-weight:bold;
	float:left;
}
footer .newsBox .media {
	margin-top:15px;
	padding-bottom:5px;
	border-bottom:1px #CCC dotted;
}
footer .newsBox .media .media-body span { display:block; }
footer .newsBox .media .media-body span.shopname a:link { font-weight:bold;}

footer .footerArea a.pagetop {
	width:70px;
	height:35px;
	display:block;
	position:absolute;
	bottom:0;
	right:8%;
}

footer .copyArea .footerLink { overflow:hidden;}
footer .copyArea .footerLink .title {
	margin:15px 0;
	padding:0 0 15px 0;
	border-bottom:1px #38709E solid;
	color:#FFF;
	font-size:24px;
	font-weight:bold;
	overflow:hidden;
}

footer .copyArea .footerLink .link li a {
	margin:0 0 2px 0;
	padding:0 0 0 15px;
	background:url(../images/ico_footer_arrow.png) 0 3px no-repeat;
	color:#FFF;
	font-size:14px;
	float:left;
	clear:both;
}
footer .copyArea .footerLink span.bnr_fc_owner {
	width:385px;
	height:160px;
	background:url(../images/btn_fc_owner.jpg) no-repeat;
	display:block;
	overflow:hidden;
	float:left;
}
footer .copyArea .footerLink span.bnr_fc_owner a {
	width:385px;
	height:160px;
	display:block;
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
}

footer .copyArea .footerLink ul {
	margin:0 auto;
	width:1100px;
}
footer .copyArea .footerLink ul li {
	width:235px;
	float:left;
}

footer .copyArea { background:#064C87; overflow:hidden;}
footer .copyArea p {
	margin:35px auto;
	padding:0 15px;
	color:#FFF;
	font-size:12px;
	text-align:center;
}


/*------------------------------------------
■ main menu
------------------------------------------*/

.mainmenu {
	margin-top:45px;
	overflow:hidden;
}

.grid {
	position: relative;
	margin: 0 auto;
	padding: 1em 0 4em;
	max-width: 100%;
	list-style: none;
	text-align: center;
}

/* Common style */
.grid div.effect-sadie {
	position: relative;
	float: left;
	overflow: hidden;
	max-width: 100%;
	max-height: 510px;
	width: 33.3%;
	/*background: #3085a3;*/
	text-align: center;
	cursor: pointer;
	float:left;
}

.grid div.effect-sadie img {
	/*position: relative;
	display: block;
	min-height: 100%;
	max-width: 100%;
	opacity: 0.8;*/
}

.grid div.effect-sadie div {
	color: #fff;
	text-transform: uppercase;
	font-size: 1.25em;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.grid div.effect-sadie div::before,
.grid div.effect-sadie div::after { pointer-events: none;}

.grid div.effect-sadie div,
.grid div.effect-sadie div > a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* Anchor will cover the whole item by default */
/* For some effects it will show as a button */
.grid div.effect-sadie div > a {
	z-index: 1000;
	text-indent: 200%;
	white-space: nowrap;
	font-size: 0;
	opacity: 0;
}

.grid .mainBtn {
     border: none;
     font-family: inherit;
     font-size: inherit;
     color: inherit;
     background: none;
     cursor: pointer;
     display: inline-block;
     text-align: center;
     letter-spacing: 1px;
     font-weight: 700;
     outline: none;
}

.grid .circleBtn {
  color: #fff;
  line-height: 24px;
  overflow: hidden;
}
.grid .circleBtn h2 {
  display: inline-block;
  margin:0 auto;
  width: 222px;
  /*height: 100%;*/
  position: absolute;
  left: 0;
  right: 0;
}
.grid .circleBtn p {
  position: absolute;
  /*height: 100%;*/
  width: 100%;
  line-height:1.4em;
  font-size:14px;
}
 
.grid .circleBtn-a h2 { bottom: -40px;}
.grid .circleBtn-a p { bottom: -150px;}

.grid .circleBtn div { overflow:hidden;}

.grid .circleBtn .green:hover { background:url(../images/btn01_bg.png) repeat-x bottom;}
.grid .circleBtn .pink:hover { background:url(../images/btn02_bg.png) repeat-x bottom;}
.grid .circleBtn .blue:hover { background:url(../images/btn03_bg.png) repeat-x bottom;}


/*------------------------------------------
■ side menu サイドメニュー
------------------------------------------*/
#sideMenu { margin-top:10px; margin-bottom:10px;}
#sideMenu h2 {
	margin-bottom:15px;
	overflow:hidden;
}
#sideMenu .kaitori h2 { background:#30BE2C;}
#sideMenu .kensaku h2 { background:#FB3E6A;}
#sideMenu .tanoshimu h2 { background:#30B2D9;}
#sideMenu .kigyou h2 { background:#064C86;}


#sideMenu section {
	margin-bottom:5px;
	padding:0 5px 10px 5px;
	min-width:100%;
	border-bottom:1px #BDBDAE dotted;
	overflow:hidden;
}
/*#sideMenu section.kaitori .topBtn { padding:5px 5px 5px 10px; background:#30BE2C; color:#FFF;}
#sideMenu section.kensaku .topBtn { padding:5px 5px 5px 10px; background:#FB3E6A; color:#FFF;}
#sideMenu section.tanoshimu .topBtn { padding:5px 5px 5px 10px; background:#30B2D9; color:#FFF;}*/

#sideMenu section a { margin-top:5px; padding-left:23px; display:block; clear:both;}

#sideMenu section a {
	padding:10px;
	background:#F2F2F2;
	border:1px #D7D4CE solid;
	border-radius: 3px;        /* CSS3草案 */  
    -webkit-border-radius: 3px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 3px;   /* Firefox用 */
	overflow:hidden;
}


#sideMenu section a.active { background:#FFE66B; font-weight:bold; /*★★★★★ wp移行時に取る ★★★★★*/}
#sideMenu section .current-menu-item a { background:#FFE66B; font-weight:bold;}



/*------------------------------------------
■ mainArea
------------------------------------------*/

.mainArea {
	background:url(../images/top_pu_bg.gif) no-repeat center 90px;
	overflow:hidden;
}
.mainArea .container {
	margin:40px auto 0 auto;
	padding:0;
	max-width:1100px;
	overflow:hidden;
}
.mainArea section {
	margin-bottom:30px;
}
.mainArea .container section:first-child { margin-bottom:15px;}
.mainArea .bg {
	background:url(../images/topcontents_bg.png);
	border:1px #FFF solid;
}


/*------------------------*/
/******* pickupBox *******/
/*------------------------*/

.mainArea .pickupBox {
	padding:0;
	overflow:hidden;
}
.mainArea .pickupBox h2 {
	margin-right:10px;
	font-size:30px;
	font-weight:bold;
	line-height:1.4em;
	float:left;
}
.mainArea .pickupBox p { margin-bottom:15px;}
.mainArea .pickupBox div { padding:0;}

.mainArea .pickupBox .master-slider-parent { margin-right:20px; border:1px #BDBDAE solid;}
.mainArea .pickupBox .ms-thumb-list { height:77px !important;}


/*------------------------*/
/******* newsBox *******/
/*------------------------*/

.mainArea .newsBox { margin-bottom:30px; overflow:hidden;}
.mainArea .newsBox dl { margin:0 0 15px 0; overflow:hidden;}
.mainArea .newsBox dt {
	margin-right:10px;
	padding:12px 10px;
	width:125px;
	font-weight:bold;
	text-align:center;
	float:left;
}
.mainArea .newsBox dt.yellow {
	background:#FFD800;
	color:#000;
}
.mainArea .newsBox dt.black {
	background:#000;
	color:#FFF;
}
.mainArea .newsBox dd { padding:11px;}
.mainArea .newsBox span {
	margin-right:10px;
	display:block;
	font-weight:bold;
	float:left;
}
.mainArea .newsBox dd a { font-weight:bold;}
.mainArea .newsBox dd a.btn-black { margin-bottom:0; }


/*------------------------*/
/******* topicsBox *******/
/*------------------------*/

.mainArea .topicsBox {
	/*padding:40px 30px 20px 30px !important;*/
	overflow:hidden;
}
.mainArea .topicsBox p.text { margin:15px 0 0 0; line-height:1.3em;}
.mainArea .topicsBox div {
	margin-bottom:20px;
}

.mainArea .topicsBox .omoiBox { padding:0 5px;}
.mainArea .topicsBox .omoiBg {
	margin-bottom:0;
	min-height:286px;
	background:url(../images/bg_omoi.gif);
	border:1px #CECEBF solid;
	font-size:14px;
	line-height:1.3em;
	overflow:hidden;
}
.mainArea .topicsBox .omoiBg span { margin:10px 20px 18px 20px; display:block;}
.mainArea .topicsBox .omoiBg p { margin:0 15px 18px 15px;}


/*------------------------------------------
■ squareNav トップ四角コンテンツボタン
------------------------------------------*/

.mainArea .topicsBox .hoverBtn { margin:-5px 0 10px 0; padding:5px 5px 0 5px; overflow:hidden;}
.mainArea .topicsBox .hoverBtn  a { padding:0; display:block; z-index:999;}
.mainArea .topicsBox .hoverBtn  .caption {
	margin:5px 0 0 5px;
	padding:13px;
	width:98%;
	height:100%;
    background:#000;
    color:#FFF;
    display:none;
	font-size:95%;
	ine-height:1.4em;
	position:absolute;
    top:0;
    left:0;
	overflow:hidden;
	opacity:0.9;
	filter: alpha(opacity=90) !important;        /* ie lt 8 */
	-ms-filter: "alpha(opacity=90)" !important;  /* ie 8 */
	-moz-opacity:0.9;                 /* FF lt 1.5, Netscape */
	-khtml-opacity: 0.9;              /* Safari 1.x */
	z-index:998;
}

.mainArea .topicsBox .hoverBtn a:hover {
	opacity:1;
	filter: alpha(opacity=100) !important;        /* ie lt 8 */
	-ms-filter: "alpha(opacity=100)" !important;  /* ie 8 */
	-moz-opacity:1;                 /* FF lt 1.5, Netscape */
	-khtml-opacity: 1;              /* Safari 1.x */
	z-index:999 !important;
}





/*==========================================
////////////////// @media /////////////////
==========================================*/


/*------------------------------------------
■ @media 
------------------------------------------*/

/*-----------------------*/
/******* max 768px *******/
/*-----------------------*/

@media only screen and (max-width:768px){
	
	.header {
	margin:auto;
	width:100%;
	padding-top:20px;
	overflow:hidden;
	position:static;
	}

	.header h1 { margin:0 0 18px 0; font-size:12px; text-align:center;}
	.header .logo { margin-top:0; display:block;}
	.header .logo a {
	margin:0 auto 15px auto;
	width:179px;
	display:block;
	}
	.header .menu {
		margin:0;
		padding:0;
		background-color: transparent;
	}
	
	footer .newsBox {
	margin:15px auto;
	padding:0;
	width:100%;
	}
	footer .newsBox h3 { margin-top:10px; font-size:24px !important;}
	
	.mainArea { background:none;}
	
	.mainArea .pickupBox .master-slider-parent { margin:10px 10px 15px 10px;}
	
	.mainmenu {
	margin-top:0;
	overflow:hidden;
	}
	
	/*.btn {
		font-size: 18px;
		line-height: 1.4444444;
		border-radius: 5px;
	}*/
	#sideMenu h2 { margin:10px 0 0 0; padding:15px; color:#FFF; font-weight:bold;}
	
	.mainArea .container {
		width:100%;
		padding:0;
	}
	
	.mainArea .newsBox dl { position:relative;}
	.mainArea .newsBox dt {
		margin-right:0;
		padding:15px;
		width:100%;
		font-weight:bold;
		text-align:left;
		float:none;
	}
	.mainArea .newsBox dl .btn {
		position:absolute;
		top:7px;
		right:7px;
	}
	
	.mainArea .pickupBox h2 {
		margin:0 10px;
		font-size:28px;
		font-weight:bold;
		clear:both;
		float:none;
	}
	.mainArea .pickupBox p { margin:15px 0;}
	
	.mainArea .topicsBox {
		padding:20px 0 0 0;
	}
		
	footer .footerArea { background-position:45% bottom;}
	footer .newsBox { font-size:15px;}
	footer .copyArea .footerLink ul {
		width:134px;
	}
	footer .copyArea .footerLink .title li.logo {
		margin:0 auto;
		width:134px;
		height:37px;
		overflow:hidden;
		text-align:center;
		float:none;
	}
	footer .copyArea p { margin:0 auto 15px auto;}
	footer a.pagetop { margin:0 auto; right:40%; bottom:0;}
	
	.mainArea .topicsBox .omoiBg { font-size:15px; line-height:1.4em;}
	
}

/*-----------------------*/
/******* min 768px *******/
/*-----------------------*/

@media only screen and (min-width: 768px) {
	
	
	
	
}

/*-----------------------*/
/******* max 980px *******/
/*-----------------------*/

@media only screen and (max-width:980px){
	
	.header {
	margin:auto;
	width:100%;
	padding-top:20px;
	overflow:hidden;
	position:static;
	}	
	
	.header h1 { margin:0 0 18px 0; font-size:12px; text-align:left;}
	.header .logo { margin-top:0; display:block;}
	.header .logo a {
	margin:0 auto 15px auto;
	width:179px;
	display:block;
	}

	.mainArea { background:url(../images/top_pu_bg.png) no-repeat center 90px;}
	.mainArea .topicsBox {	padding:20px 15px 10px 15px;}
	
	.mainmenu {
	margin-top:0;
	overflow:hidden;
	}
	
	footer .footerArea { background-position:45% bottom;}
	footer .newsBox { font-size:15px;}
	footer .copyArea .footerLink ul {
		width:134px;
	}
	footer .copyArea .footerLink .title li.logo {
		margin:0 auto;
		width:134px;
		height:37px;
		overflow:hidden;
		text-align:center;
		float:none;
	}
		
}




/*-----------------------*/
/******* min 992px *******/
/*-----------------------*/

@media only screen and (min-width:992px){
	
	.hidden-sm { display:none !important;}
	.mainArea .topicsBox {	padding:40px 30px 20px 30px;}
}