@charset "utf-8";

/* ---------------------------------------------------------
   HTML5 Bones
   This stylesheet contains print styling and a section for 
   you to simply add your own. This is a basic template 
   after all.
   ---------------------------------------------------------*/

html,body{
	height:100%;
}

body {}

/* Default link styling */
a{text-decoration:none;}
a:link { color:#D83500;}
a:visited { color:#D83500;}
a:hover, a:focus { color:#F93969; text-decoration:underline;}
a:active { color:#D83500; }


	
/* ---------------------------------------------------------
    Author's styles
   ---------------------------------------------------------*/

body {
	color:#333;
	font-family:helvetica,"Hiragino Kaku Gothic ProN","メイリオ","ＭＳ Ｐゴシック",sans-serif;
	font-size:14px;
	line-height:1.7;
	background:#FFF;
}

/* サファリのみ フォント指定 */
html:\66irst-child body {
	font-family:"ヒラギノ角ゴPro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Arial, Helvetica, Verdana, sans-serif;
}



/* ---------------------------------------------------------
    clear
   ---------------------------------------------------------*/

.clear{
	clear:both;
}

.clearfix:after {
  content: ".";  /* 新しい要素を作る */
  display: block;  /* ブロックレベル要素に */
  clear: both;
  height: 0;
  visibility: hidden;
}

.clearfix {
  min-height: 1px;
}

* html .clearfix {
  height: 1px;
  /*\*//*/
  height: auto;
  overflow: hidden;
  /**/
}



/* ---------------------------------------------------------
    wrap
   ---------------------------------------------------------*/

#wrap{
	position: relative;
	height:auto !important; /* IE6対策 */
	height: 100%; /* IE6対策 */
	min-height: 100%;
	width:100%;
}

#contents{
	width:100%;
	padding-bottom:60px;
	box-sizing:border-box;
}


/*
@media screen and (max-width:984px) {

	#contents{
		padding:102px 0 50px 0;
	}

}


@media screen and (max-width:600px) {

	#contents{
		padding:50px 0 50px 0;
	}

}
*/



/* ---------------------------------------------------------
    main
   ---------------------------------------------------------*/

main{
	display: block;
	width:100%;
}

#mainContent{
	width:100%;
	margin-bottom:60px;
}

.mainContentInner{
	width:1100px;
	margin:0 auto;
}


@media screen and (max-width:1145px) {

	.mainContentInner{
		width:100%;
		padding:0 10px;
		box-sizing:border-box;
	}

}



/* ---------------------------------------------------------
    mainTitle
   ---------------------------------------------------------*/

/* h2 */

.mainTitleBox{
	width:1100px;
	margin:0 auto 60px auto;
}

.mainTitle01{
	width:100%;
	height:74px;
	background:url(../images/h2_title.png) no-repeat;
	margin-bottom:30px;
}

.mainTitle01 dl{
	clear:both;
	width:100%;
}

.mainTitle01 dt{
	width:87px;
	float:left;
	padding:32px 4px 0 4px;
	text-align:center;
	box-sizing:border-box;
	font-size:1.1em;
}

.mainTitle01 dd{
	width:1013px;
	float:left;
	padding:15px 0 0 25px;
	box-sizing:border-box;
	color:#328C70;
}

.mainTitle01 dd h2{
	width:170px;
/*	width:152px; */
	float:left;
	font-size:2.2em;
}

.mainTitle01 dd p{
	width:812px;
/*	width:830px; */
	float:left;
	padding:10px 10px 0 60px;
	font-size:1.2em;
	box-sizing:border-box;
}

.mainTitleBox p.text{
	padding:0 30px;
}


/* h3 */

.mainTitle02{
	width:100%;
	padding:0 10px;
	margin-bottom:40px;
	box-sizing:border-box;
}

/* .mainTitle02 h3{ */
h3{
	text-align:center;
	font-size:2.2em;
	color:#328C70;
	margin-bottom:20px;
}
	
.mainTitle02 p{
	text-align:center;
}



/*
@media screen and (max-width:600px) {

	.mainTitle01{
		width:100%;
		margin:0 auto 30px auto;
	}
	
	.mainTitle01 h2{
		font-size:2em;
	}
	
	.mainTitle01 li.title{
		width:100%;
	}
	
	.mainTitle01 li.border{
		display:none;
	}

}
*/



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

header#header{
	width:100%;
 }

/* index */
#index header#header{
	height:50px;
}

/* その他のページ */
#select header#header,
#look header#header,
#buy header#header{
	height:300px;
	margin-bottom: 58px;
}

#select header#header{background: url("../images/header_bg_01.jpg") no-repeat;}
#look header#header  {background: url("../images/header_bg_02.jpg") no-repeat;}
#buy header#header   {background: url("../images/header_bg_03.jpg") no-repeat;}

header #headerInner{
/*	width:1440px; */
	width:1200px;
	margin:0 auto;
	position:relative;
}


/*-- logo --*/

header#header #logo{
	width:200px;
	position: absolute;
	top:0;
	left:0;
	z-index:10;
}

/* h1 */
header#header #logo h1{
	width:200px;
}

header#header #logo h1 a{
	display:block;
	width:200px;
	height:200px;
	text-indent:-9999px;
	background:url(../images/header_logo.png) no-repeat;
}

header#header #logo h1 a:hover{
    filter:alpha(opacity=90);
    -moz-opacity: 0.9;
    opacity: 0.9;
}


/*-- headerBox01 --*/

header#header .headerBox01{
	width:788px;
	margin-left:240px;
/*	float:left;
	margin-left:40px; */
}

header#header nav #gNavi{
	clear:both;
	width:100%;
}

header#header nav #gNavi li{
	float:left;
}

header#header nav #gNavi li.gNavi01{width:147px;}
header#header nav #gNavi li.gNavi02{width:127px;}
header#header nav #gNavi li.gNavi03{width:160px;}
header#header nav #gNavi li.gNavi04{width:110px;}

header#header nav #gNavi li.arrow{
	width:20px;
	margin:0 30px 0 25px;
	padding-top:27px;
}

header#header nav #gNavi li.arrow img{
	display:block;
	width:20px;
	height:8px;
}

header#header nav #gNavi li dl{
	clear:both;
	width:100%;
	margin-bottom:5px;
}

header#header nav #gNavi li dt{
	width:60px;
	float:left;
	color:#FFF;
	font-size:76%;
	padding:1px 5px;
	background:#328D70;
    border-radius: 13px;
    -webkit-border-radius: 13px; 
    -moz-border-radius: 13px;
	text-align:center;
	box-sizing:border-box;
	margin-top:2px;
}

header#header nav #gNavi li dd{
	text-align:center;
	float:left;
	color:#328D70;
	font-weight:bold;
}

header#header nav #gNavi li.gNavi01 dd{width:87px;}
header#header nav #gNavi li.gNavi02 dd{width:67px;}
header#header nav #gNavi li.gNavi03 dd{width:100px;}
header#header nav #gNavi li.gNavi04 dd{width:50px;}

header#header nav #gNavi li a{
	display:block;
	width:100%;
	text-decoration:none;
	font-size:1.1em;
	padding-top:17px;
/*  border-bottom:3px solid #FFF; */
	box-sizing:border-box;
}

header#header nav #gNavi li a:hover{
	border-bottom:3px solid #3A5056;
}

header#header nav #gNavi li a:hover dt{background:#3A5056;}
header#header nav #gNavi li a:hover dd{color:#3A5056;}


/* 該当時 */

#index header#header nav #gNavi li.gNavi01 a   {border-bottom:3px solid #3A5056;}
#index header#header nav #gNavi li.gNavi01 a dt{background:#3A5056;}
#index header#header nav #gNavi li.gNavi01 a dd{color:#3A5056;}

#select header#header nav #gNavi li.gNavi02 a   {border-bottom:3px solid #3A5056;}
#select header#header nav #gNavi li.gNavi02 a dt{background:#3A5056;}
#select header#header nav #gNavi li.gNavi02 a dd{color:#3A5056;}

#look header#header nav #gNavi li.gNavi03 a   {border-bottom:3px solid #3A5056;}
#look header#header nav #gNavi li.gNavi03 a dt{background:#3A5056;}
#look header#header nav #gNavi li.gNavi03 a dd{color:#3A5056;}

#buy header#header nav #gNavi li.gNavi04 a   {border-bottom:3px solid #3A5056;}
#buy header#header nav #gNavi li.gNavi04 a dt{background:#3A5056;}
#buy header#header nav #gNavi li.gNavi04 a dd{color:#3A5056;}



@media screen and (max-width:640px) {

	header #headerInner{
		width:100%;
	}

	header#header #logo{
		width:30%;
	}

	header#header #logo h1{
		width:100%;
	}

	header#header #logo h1 a{
		width:100%;
		background-size: 100%;
	}

	header#header .headerBox01{
		width: 70%;
		margin-left: 32%;
	}

	header#header nav #gNavi li.gNavi01,
	header#header nav #gNavi li.gNavi02{
		width:40%;
	}

	header#header nav #gNavi li dt{
		width: 50%;
		font-size: 0.5em;
		margin-top: 0;
	}

	header#header nav #gNavi li dd{
		font-size: 0.8em;
		width: 50%!important;
	}

	header#header nav #gNavi li.arrow{
		margin: 0 5px 0 5px;
		padding-top: 23px;
	}

}

/*
@media screen and (max-width:984px) {

	header#header{
		height:102px;
	}
	
	header #headerInner{
		width:100%;
	}
	
	header#header #logo{
		float:none;
		width:345px;
		margin:0 auto 10px auto;
		padding-top:18px;
	}

	header#header .headerBox01{
		width:100%;
		float:none;
	}
	
	header#header nav #gNav li.gNav01,
	header#header nav #gNav li.gNav02,
	header#header nav #gNav li.gNav03{
		width:33.3%;
	}
	
	header#header nav #gNav li.gNav03{
		float:right;
	}

	header#header nav #gNav li a{
		height:45px;
		padding-top:10px;
	}

}


@media screen and (max-width:600px) {

	header#header{
		position:absolute;
		height:50px;
	}
	
	header#header #logo{
		width:230px;
		margin-bottom:0;
	}
	
	header#header #logo h1{
		width:140px;
	}
	
	header#header #logo h1 a{
		width:140px;
		background-size:140px;
		height:auto;
	}
	
	header#header #logo p{
		width:90px;
		height:auto;
		background-size:90px;
		margin-top:3px;
	}
	
	header#header .headerBox01{
		display:none;
	}

}
*/



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

footer#footer{
	width:100%;
	height:60px;
    position:absolute;
    bottom:0;
	background:#3A5056;
}

#footerInner{
	padding:20px 85px 0 30px;
/*	padding:20px 15px 20px 30px; */
	min-width: 1200px;
}

footer#footer .clearfix{
	overflow:hidden;
}

#footerInner ul{
	clear:both;
	width:100%;
}

#footerInner li.left{
	width:163px;
}

#footerInner li.left a{
	display:block;
/*
	width:163px;
	height:20px;
*/
	text-indent:-9999px;
	background:url(../images/footer_logo.png) no-repeat;
}

#footerInner li.left a:hover{
    filter:alpha(opacity=80);
    -moz-opacity: 0.8;
    opacity: 0.8;
}

#footerInner li.right{
/*
	width:320px;
*/
	font-size:1.2em;
	text-align:right;
	color:#FFF;
	line-height:100%;
	padding-top:2px;
}

@media screen and (max-width:640px) {

/*
	footer#footer{
		height: 48px;
	}

	#footerInner{
		padding: 5px 0px 0px 0px;
	}

	#footerInner li.left{
		width: 100%;
	}

	#footerInner li.left a{
		width: 100%;
		background-size: 30%;
		background-position: 50%;
	}

	#footerInner li.right{
		width: 100%;
		text-align: center;
    font-size: 76%;
	}
*/

}

/* ---------------------------------------------------------
    nextBox
   ---------------------------------------------------------*/

.nextBox{
	width:770px;
	margin:0 auto 50px auto;
}
	
.nextBox a{
	display:block;
	width:100%;
	text-decoration:none;
}

.nextBox a img{
	max-width:100%;
	height:auto;
	display:block;
	margin:0 auto;
}

.nextBox a:hover{
    filter:alpha(opacity=80);
    -moz-opacity: 0.8;
    opacity: 0.8;
}



/* ---------------------------------------------------------
    pagescroll.js
   ---------------------------------------------------------*/

#nav-dock {
	width:60px;
	height:60px;
	position:fixed;
	bottom:30px;
/*	position:absolute!important;
	top:-30px; */
	right:15px;
}

#nav-dock a {
	display: block;
	width:60px;
	height:60px;
	text-indent:-9999px;
}

#nav-dock #prev {
	background:url(../images/pagetop.png) no-repeat;
}

#nav-dock #prev:hover{
	background:url(../images/pagetop.png) 0 bottom no-repeat;
}



/*
@media screen and (max-width:600px) {

	#nav-dock {
		width:50px;
		height:50px;
		top:-25px;
		right:10px;
	}
	
	#nav-dock a {
		width:50px;
		height:50px;
	}
	
	#nav-dock #prev,
	#nav-dock #prev:hover{
		background-size:50px;
	}

}
*/

	


/* ---------------------------------------------------------
    汎用css
   ---------------------------------------------------------*/
   
/* float */
.left{float:left;}
.right{float:right;}

/* margin-top */
.mt0{margin-top:0 !important}
.mt5{margin-top:5px !important;}
.mt10{margin-top:10px !important;}
.mt15{margin-top:15px !important;}
.mt20{margin-top:20px !important;}
.mt25{margin-top:25px !important;}
.mt30{margin-top:30px !important;}
.mt35{margin-top:35px !important;}
.mt40{margin-top:40px !important;}
.mt45{margin-top:45px !important;}
.mt50{margin-top:50px !important;}

/* margin-bottom */
.mb0{margin-bottom:0 !important}
.mb3{margin-bottom:3px !important;}
.mb5{margin-bottom:5px !important;}
.mb10{margin-bottom:10px !important;}
.mb15{margin-bottom:15px !important;}
.mb20{margin-bottom:20px !important;}
.mb25{margin-bottom:25px !important;}
.mb30{margin-bottom:30px !important;}
.mb35{margin-bottom:35px !important;}
.mb40{margin-bottom:40px !important;}
.mb45{margin-bottom:45px !important;}
.mb50{margin-bottom:50px !important;}

/* margin-right */
.mr10{margin-right:10px !important;}
.mr15{margin-right:15px !important;}
.mr20{margin-right:20px !important;}

/* margin-left */
.ml10{margin-left:10px !important;}
.ml15{margin-left:15px !important;}
.ml20{margin-left:20px !important;}

/* padding-bottom */
.pb0{padding-bottom:0 !important}
.pb5{padding-bottom:5px;}
.pb10{padding-bottom:10px;}
.pb15{padding-bottom:15px;}
.pb20{padding-bottom:20px;}
.pb25{padding-bottom:25px;}
.pb30{padding-bottom:30px;}
.pb35{padding-bottom:35px;}
.pb40{padding-bottom:40px;}
.pb45{padding-bottom:45px;}
.pb50{padding-bottom:50px;}


/* 解除 */
.borderNone{border:none!important;}
.mgnNone{margin:0!important;}
.pdgNone{padding:0!important;}



/* ---------------------------------------------------------
    404error
   ---------------------------------------------------------*/

.errorBox01{
	margin:0 auto;
}

.errorBox01 dl{
	padding:100px 0;
	line-height:200%;
}

.errorBox01 dt{
	font-weight:bold;
	font-size:200%;
	margin-bottom:20px;
	text-align:center;
}

.errorBox01 dd{
	text-align:center;
}

.errorBox01 dd a{
	font-weight:bold;
}