@charset "UTF-8";

/*
ヘッダー、フッターボタン、div.listの共通定義に使用.
*/

/*common-btn
***************************************/
.btn-wsmall{
	width:100%;
	height: 30px;
	margin-bottom: 0;
	border: 1px solid #ccc;
	-webkit-border-radius: 14px;
	-moz-border-radius: 14px;
	border-radius: 14px;
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffffff 0%, #ffffff 49%, #ececec 49%, #d8d8d8 99%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(49%,#ffffff), color-stop(49%,#ececec), color-stop(99%,#d8d8d8)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ffffff 0%,#ffffff 49%,#ececec 49%,#d8d8d8 99%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ffffff 0%,#ffffff 49%,#ececec 49%,#d8d8d8 99%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ffffff 0%,#ffffff 49%,#ececec 49%,#d8d8d8 99%); /* IE10+ */
	background: linear-gradient(to bottom,  #ffffff 0%,#ffffff 49%,#ececec 49%,#d8d8d8 99%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#d8d8d8',GradientType=0 ); /* IE6-9 */
	text-align: center;
}

.btn-wsmall a{
	display: block;
	height: 100%;
	font-size: 90%;
	font-weight: bold;
	color:#323232;
	-webkit-text-size-adjust: 75%; 
	padding-top:2px;
}
.btn-wsmall a span{
	padding-left: 14px;
}
@media screen and (max-width: 640px) {	.btn-wsmall a{	padding-top:5px;	/*	iPhone */	}}

.btn-wlarge{
	width: 100%;
	height: 34px;
	margin-bottom: 0px;
	border: 1px solid #ccc;
	-webkit-border-radius: 16px;
	-moz-border-radius: 16px;
	border-radius: 16px;
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffffff 0%, #ffffff 49%, #ececec 49%, #d8d8d8 99%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(49%,#ffffff), color-stop(49%,#ececec), color-stop(99%,#d8d8d8)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ffffff 0%,#ffffff 49%,#ececec 49%,#d8d8d8 99%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ffffff 0%,#ffffff 49%,#ececec 49%,#d8d8d8 99%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ffffff 0%,#ffffff 49%,#ececec 49%,#d8d8d8 99%); /* IE10+ */
	background: linear-gradient(to bottom,  #ffffff 0%,#ffffff 49%,#ececec 49%,#d8d8d8 99%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#d8d8d8',GradientType=0 ); /* IE6-9 */
	text-align: center;
}

.btn-wlarge a{
	display: block;
	height: 100%;
	font-weight: bold;
	color:#323232;
	-webkit-text-size-adjust: 75%; 
	padding-top:4px;
}
.btn-wlarge a span{
	padding-left: 14px;
}
@media screen and (max-width: 640px) {	.btn-wlarge a{	padding-top:6px;	/*	iPhone */	}}


.btn-plarge{
	width: 100%;
	height: 34px;
	/*border: 1px solid #ccc;*/
	-webkit-border-radius: 16px;
	-moz-border-radius: 16px;
	border-radius: 16px;
	background: #EF428C; /* Old browsers */
	background: -moz-linear-gradient(top,  #F771B4 0%, #F771B4 49%, #F24A98 49%, #EF428C 99%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#F771B4), color-stop(49%,#F771B4), color-stop(49%,#F24A98), color-stop(99%,#EF428C)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #F771B4 0%,#F771B4 49%,#F24A98 49%,#EF428C 99%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #F771B4 0%,#F771B4 49%,#F24A98 49%,#EF428C 99%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #F771B4 0%,#F771B4 49%,#F24A98 49%,#EF428C 99%); /* IE10+ */
	background: linear-gradient(to bottom,  #F771B4 0%,#F771B4 49%,#F24A98 49%,#EF428C 99%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#F771B4', endColorstr='#EF428C',GradientType=0 ); /* IE6-9 */
	text-align: center;
}

.btn-plarge a{
	display: block;
	height: 100%;
	font-weight: bold;
	color:#FFFFFF;
	-webkit-text-size-adjust: 75%; 
	padding-top: 5px;
}

.btn-plarge a span{
	padding: 5px 3px 3px 25px;
	background-position:0 2px !important;
}
@media screen and (max-width: 640px) {
	.btn-plarge a{	
		padding-top: 7px;
	}
	.btn-plarge a span{	
		background-position:0 0 !important;	/*	iPhone */	
	}
}

.btn-plargelarge{
	height: 46px;
	margin-bottom:0px;
	/*border: 1px solid #ccc;*/
	background: #EF428C; /* Old browsers */
	background: -moz-linear-gradient(top,  #F771B4 0%, #F771B4 49%, #F24A98 49%, #EF428C 99%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#F771B4), color-stop(49%,#F771B4), color-stop(49%,#F24A98), color-stop(99%,#EF428C)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #F771B4 0%,#F771B4 49%,#F24A98 49%,#EF428C 99%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #F771B4 0%,#F771B4 49%,#F24A98 49%,#EF428C 99%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #F771B4 0%,#F771B4 49%,#F24A98 49%,#EF428C 99%); /* IE10+ */
	background: linear-gradient(to bottom,  #F771B4 0%,#F771B4 49%,#F24A98 49%,#EF428C 99%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#F771B4', endColorstr='#EF428C',GradientType=0 ); /* IE6-9 */
	text-align: center;
}

.btn-plargelarge a{
	display: block;
	height: 100%;
	font-weight: bold;
	color:#FFFFFF;
	font-size:125%;
	-webkit-text-size-adjust: 75%; 
	padding-top: 7px;
}

.btn-plargelarge a span{
	padding: 5px 3px 3px 25px;
	background-position:0 4px !important;
}
@media screen and (max-width: 640px) {
	.btn-plargelarge a{	
		height: 30px;
	}
	.btn-plargelarge a{	
		padding-top: 10px;
	}
	.btn-plargelarge a span{	
		background-position:0 2px !important;	/*	iPhone */	
	}
}

.imgborder{
	border: 5px solid #FFFFFF;
	margin: 0 auto 5px;
}


/*list
共通class
PC・スマートフォンで中ページ内の要素のpaddingが小さくなる.
***************************************/

@media screen and (min-width: 641px) {
	div.list{
		padding:20px;
	}
}

@media screen and (max-width: 640px) {
	div.list{
		padding:10px;
	}
}

/*list vertical-datas回り
共通class
PC・スマートフォンで横＞縦並びレイアウトというように組み方が変わる.
***************************************/
div.list .vertical-datas{
    zoom: 1;
}
div.list .vertical-datas .bottomBtn{
	width:100%; 
	margin-bottom: 0px;
	padding-bottom: 0px;
	bottom: 0px;
}
div.list .vertical-datas .title{

}

div.list .vertical-datas .title h3{

}

div.list .vertical-datas .explain{

}
	/*	.vertical-datas .bottomBtn (pc)横レイアウト時はbottom　(sp)縦レイアウト時はstatic	*/
@media screen and (min-width: 1025px) {
	div.list .vertical-datas{
	    position: relative;
	}
	div.list .vertical-datas .bottomBtn{
		padding-right:20px;
		position: absolute; 
	}
}
@media screen and (max-width: 1024px) {
	div.list .vertical-datas{
	    position: static;
	}
	div.list .vertical-datas .bottomBtn{
		padding-right:0px;
		position: static; 
	}
}

/*header
***************************************/

.header h1{
	float: left;
}

.header p.shopBtn{
	border: 1px solid #ccc;
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffffff 0%, #ffffff 49%, #ececec 49%, #d8d8d8 99%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(49%,#ffffff), color-stop(49%,#ececec), color-stop(99%,#d8d8d8)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ffffff 0%,#ffffff 49%,#ececec 49%,#d8d8d8 99%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ffffff 0%,#ffffff 49%,#ececec 49%,#d8d8d8 99%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ffffff 0%,#ffffff 49%,#ececec 49%,#d8d8d8 99%); /* IE10+ */
	background: linear-gradient(to bottom,  #ffffff 0%,#ffffff 49%,#ececec 49%,#d8d8d8 99%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#d8d8d8',GradientType=0 ); /* IE6-9 */
	text-align: center;
	float: right;
}

.header p.shopBtn a{
	font-size: 1.2em;
	display: block;
	height: 100%;
	color:#333333;
	font-weight: bold;
	-webkit-text-size-adjust: 75%; 
}

.header h1{
	padding-left:10px;
}

.header div.header-right{
	padding-right:10px;
}

.header{
	background: url(../_img/bg_dot01.png) 0 0 repeat;
	padding: 10px 0 10px 0;
}

/*	logoとボタンの大きさ変更	large<>small */
@media screen and (min-width: 641px) {

	.header{
		padding-top:10px;
		padding-bottom:10px;
	}

	.header h1{
		margin-top: 3px;
	}

	.header h1 img{
		/*width: 166px;*/
		/*height: 68px;*/
	}
	
	.header p.shopBtn{
		width: 165px;
		height: 47px;
		margin-top: 15px;
		margin-bottom: 0;
		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;
		border-radius: 0px;
	}

	.header p.shopBtn a{
		margin-top: 7px;
	}

	.header p.shopBtn a span{
		background: url(../_img/ico_shop.png) 0 3px no-repeat;
		padding-left: 24px;
	}

	.header p.shopBtn a span.close{
		background: url(../_img/ico_close.png) 0 0 no-repeat;
	}
}
@media screen and (max-width: 640px) {

	.header{
		padding-top:0px;
		padding-bottom:0px;
	}

	.header h1{
		margin-top: 0px;
	}
	
	.header h1 img{
		width: 83px;
		height: 34px;
	}

	.header p.shopBtn{
		width: 140px;
		height: 35px;
		margin-top: 10px;
		margin-bottom: 0;
		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;
		border-radius: 0px;
	}

	.header p.shopBtn a{
		margin-top: 6px;
	}

	.header p.shopBtn a span{
		background: url(../_img/ico_shop.png) 0 0 no-repeat;
		background-position:0 top;
		background-repeat:no-repeat;
		-moz-background-size:20px 20px;
		background-size:20px 20px;
		padding-left: 24px;
	}
	.header p.shopBtn a span.close{
		background: url(../_img/ico_close.png) 0 0 no-repeat;
	}
}

/*mainTitle
***************************************/

h2.mainTitle{
	margin-top:10px;
	margin-bottom:20px;
	padding-left:10px;
	font-size: 170%;
}

/*breadcrumb　パンくずリスト
***************************************/

div.breadcrumb-wrapper{
	background: #f3d607; /* Old browsers */
	background: -moz-linear-gradient(top,  #f3d607 0%, #f3d607 5%, #ffffff 5%, #ffffff 7%, #e4e4e4 7%, #f6f6f6 29%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f3d607), color-stop(5%,#f3d607), color-stop(5%,#ffffff), color-stop(7%,#ffffff), color-stop(7%,#e4e4e4), color-stop(29%,#f6f6f6)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #f3d607 0%,#f3d607 5%,#ffffff 5%,#ffffff 7%,#e4e4e4 7%,#f6f6f6 29%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #f3d607 0%,#f3d607 5%,#ffffff 5%,#ffffff 7%,#e4e4e4 7%,#f6f6f6 29%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #f3d607 0%,#f3d607 5%,#ffffff 5%,#ffffff 7%,#e4e4e4 7%,#f6f6f6 29%); /* IE10+ */
	background: linear-gradient(to bottom,  #f3d607 0%,#f3d607 5%,#ffffff 5%,#ffffff 7%,#e4e4e4 7%,#f6f6f6 29%); /* W3C */
	margin-bottom:20px;
}

ul.breadcrumb{
	margin: 0;
	padding: 8px 0 6px 10px;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f3d607', endColorstr='#f6f6f6',GradientType=0 ); /* IE6-9 */
	font-size: 90%;
}

ul.breadcrumb li{
	background: url(../_img/arr_br.png) no-repeat scroll left center;
	display: inline;
	font-size: 88%;
	padding: 0 0 0 15px;
}

ul.breadcrumb li.top{
	background:none;
	padding: 0;
}

ul.breadcrumb li a{
	text-decoration: underline;
}

/*pagetopBtn
***************************************/

div.pagetop-right-right {
    padding-right: 5px;
}

p.pagetopBtn{
	width: 135px;
	height: 29px;
	margin-top: 10px;
	margin-bottom: 0;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	border: 1px solid #ccc;
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffffff 0%, #ffffff 49%, #ffffff 49%, #ffffff 99%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(49%,#ffffff), color-stop(49%,#ffffff), color-stop(99%,#ffffff)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ffffff 0%,#ffffff 49%,#ffffff 49%,#ffffff 99%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ffffff 0%,#ffffff 49%,#ffffff 49%,#ffffff 99%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ffffff 0%,#ffffff 49%,#ffffff 49%,#ffffff 99%); /* IE10+ */
	background: linear-gradient(to bottom,  #ffffff 0%,#ffffff 49%,#ffffff 49%,#ffffff 99%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
	text-align: center;
    float: right;
}

p.pagetopBtn a{
	font-weight: bold;
	color:#323232;
	display: block;
	height: 100%;
	font-size:70%;
	margin-top: 4px;
}
p.pagetopBtn a:hover{
	color:#2ba6cb;
}

p.pagetopBtn a span{
	background: url(../_img/ico_pagetop.png) 0 0 no-repeat;
	padding-left: 12px;
}

/*footer
***************************************/

div.footer-wrapper{
	margin-top: 20px;
	background: url(../_img/bg_dot01.png) 0 0 repeat;
	text-align: center;
	border-bottom: 4px solid #F3D607;
}

p.footer{
	font-size: 70%;
	padding: 10px 0 10px 0;
}

/*topTxt01
***************************************/
p.topTxt01{
	padding: 0 0 15px 10px;
	font-size: 100%;
}