@charset "utf-8";
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline;
}

html {
  line-height: 1;
}

body{
	height:100%;
	width:100%;
	margin:0px;
	padding:0px;
	text-align:center;
	color:#fff;
	font-size:10px;
	line-height:1.8em;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;	
}


a,
a:link,
a:visited,
a:active {
	color:#fff;
	text-decoration: none;
}
a:hover {
	color:#666666;
	text-decoration: underline;
}
img{
	border:none;
}

.ready {
    opacity: 0;
}

h1 {
     font-weight:900;
	 font-size:60px;
	 line-height:1.2em;
}





/*===============================================
●style.css 画面の横幅が769px以上
===============================================*/
@media screen and (min-width: 769px){
h2 {
     font-weight:700;
	 font-size:16px;
	 line-height:1.2em;
	 padding:20px 0;
}
h3 {
     font-weight:500;
	 font-size:13px;
	 letter-spacing:0.2em;
	 line-height:1.8em;
	 padding:0;
}
h4 {
     font-weight:500;
	 font-size:14px;
	 line-height:1.8em;
	 letter-spacing:0.1em;
	 padding:10px 0;
}

h5 {
     font-weight:400;
	 font-size:13px;
	 line-height:2em;
	 letter-spacing:0.1em;
	 padding:0 0 10px 0;
}
img { 
    max-width: 100%; 
    height:auto;
}

#header{
/* 画像ファイルの指定 */
  background-image: url(../images/header_bg.png);
   
  /* 画像を常に天地左右の中央に配置 */
  background-position: center center;
   
  /* 画像をタイル状に繰り返し表示しない */
  background-repeat: no-repeat;
   
  /* コンテンツの高さが画像の高さより大きい時、動かないように固定 */
  background-attachment: fixed;
   
  /* 表示するコンテナの大きさに基づいて、背景画像を調整 */
  background-size: cover;
  -moz-background-size:cover;
   
  /* 背景画像が読み込まれる前に表示される背景のカラー */
  background-color: #000;
  padding:50px 0;
  	
}

.title{
	width:940px;
	margin:0 auto;
	text-align:right;
}
.copy{
	width:940px;
	text-align:left;
	margin:200px auto 35px;
}

/* Example Styles for Tab */
	.panel-wrap{
	background-color:#97B7C6;
	padding-bottom:90px;
	}
	
	.bg {
	background-color:#83A9BB;
}

.panel-container{
	width:940px;
	margin:0 auto;
	text-align:left;
}


/* // Example Styles for Flex */
.flex-list {
	padding-top:3em;
    list-style: none;
	display: flex;
	flex-wrap: wrap;
}
.flex-list li {
    width: 179px;
    flex-grow: 1;
}

ul.flex-prod {
    list-style: none;
	display: flex;
	flex-wrap: wrap;
}
.flex-prod li {
    width: 182px;
	margin:0 70px 50px 0;
}

.flex-prod li.last {
    width: 180px;
	margin-right:0;
}

.buy{margin-top:15px; width:180px;}
.price{font-size:11px; font-weight:700; margin:10px 0;}

#footer{
	font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
	font-size: 11px;
	line-height: 180%;
	color: #fff;
	text-align:center;
	background-color:#97B7C6;
	padding-bottom:30px;
}

}

/*===============================================
●tablet.css 画面の横幅が768pxまで
===============================================*/
@media screen and (max-width: 768px){
h2 {
     font-weight:700;
	 font-size:2em;
	 line-height:1.2em;
	 padding:20px 0;
}
h3 {
     font-weight:600;
	 font-size:0.9em;
	 letter-spacing:0.2em;
	 line-height:1.4em;
	 padding:0;
}
h4 {
     font-weight:500;
	 font-size:1.2em;
	 line-height:1.8em;
	 letter-spacing:0.1em;
	 padding:10px 0;
}

h5 {
     font-weight:400;
	 font-size:1.1em;
	 line-height:1.4em;
	 letter-spacing:0.1em;
	 padding:0 0 10px 0;
}
h5 br {
	display:none;
	}
	
img { 
    max-width: 100%; 
    height:auto;
}

#header{
	background-image:url(../images/header_bg_m.png);
	background-repeat:no-repeat;
  padding:50px 0;
  	
}

.title{
	width:95%;
	margin:0 auto;
	text-align:right;
}
.copy{
	width:95%;
	text-align:left;
	margin:5em auto 3em;
}

/* Example Styles for Tab */
	.panel-wrap{
	background-color:#97B7C6;
	padding-bottom:90px;
	}
	
	.bg {
	background-color:#83A9BB;
}

.panel-container{
	width:95%;
	margin:0 auto;
	text-align:left;
}


/* // Example Styles for Flex */
.flex-list {
	padding-top:3em;
    list-style: none;
	display: flex;
	flex-wrap: wrap;
}
.flex-list li {
    width: 100%;
    flex-grow: 1;
}

ul.flex-prod {
    list-style: none;
	display: flex;
	flex-wrap: wrap;
}
.flex-prod li {
    width: 30%;
	margin:0 2em 3em 0;
}

.flex-prod li.last {
    width: 30%;
	margin:0 2em 3em 0;
}

.buy{margin-top:15px; width:100%;}
.price{font-size:11px; font-weight:700; margin:10px 0;}

#footer{
	font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
	font-size: 0.8em;
	line-height: 180%;
	color: #fff;
	text-align:center;
	background-color:#97B7C6;
	padding-bottom:30px;
}
}


/*===============================================
●smart.css  画面の横幅が640pxまで
===============================================*/

@media screen and (max-width: 640px){
h2 {
     font-weight:700;
	 font-size:1.6em;
	 line-height:1.2em;
	 padding:1em 0;
}
h3 {
	display:none;
}
h4 {
     font-weight:600;
	 font-size:15px;
	 line-height:1.8em;
	 letter-spacing:0.1em;
	 padding:10px 0;
}

h5 {
     font-weight:500;
	 font-size:13px;
	 line-height:1.8em;
	 letter-spacing:0.1em;
	 padding:0 0 10px 0;
}

h5 br {
	display:none;
	}
img { 
    max-width: 100%; 
    height:auto;
}

#header{
	background-image:url(../images/header_bg_s.png);
	background-repeat:no-repeat;
  padding:10px 0;
  	
}

.title{
	width:90%;
	margin:0 auto;
	text-align:right;
}
.copy{
	width:90%;
	text-align:left;
	margin:5em auto;
}

/* Example Styles for Tab */
	.panel-wrap{
	background-color:#97B7C6;
	padding-bottom:3em;
	}
	
	.bg {
	background-color:#83A9BB;
}

.panel-container{
	width:95%;
	margin:0 auto;
	text-align:left;
}


/* // Example Styles for Flex */
.flex-list {
	padding-top:3em;
    list-style: none;
	display: flex;
	flex-wrap: wrap;
}
.flex-list li {
    width: 90%;
    flex-grow: 1;
}

ul.flex-prod {
    list-style: none;
	display: flex;
	flex-wrap: wrap;
}
.flex-prod li {
    width: 45%;
	margin:0 1.5em 3em 0;
}

.flex-prod li.last {
    width: 45%;
	margin-right:0;
}

.buy{margin-top:15px; width:100%; text-align:center;}
.price{font-size:1em; font-weight:700; margin:10px 0;}
.blurb {
	display:none;
	}

#footer{
	font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
	font-size: 0.8em;
	line-height: 1.6em;
	color: #fff;
	text-align:center;
	background-color:#97B7C6;
	padding-bottom:30px;
}
}




		
#page-top {
    position: fixed;
    bottom: 60px;
    right: 40px;
    -ms-filter: "alpha(opacity=80)";
    -moz-opacity: 0.8;
    -khtml-opacity: 0.8;
    opacity: 0.8;
}



	
	
	









.etabs { margin: 0 0 60px 0; padding:0; display: flex; justify-content: center; }

.mt-35{
	margin-top:35px;
}

.pt-35{
	padding-top:35px;
}

.cate{display: block; margin:0; width:180px; height:32px; margin:20px 0;}


#page-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
}

#mov {
	width:100%;
	margin:0 auto;
	background-color:#000000;
}




.name{ display: table-cell; padding:15px 0 5px; width:180px; height:32px; vertical-align:middle;}
.blurb{ margin:0.5em 0;}



.w-buy{display: block; margin-top:5px; width:180px; height:27px;}
.w-buy a{display: block; background-color:#DD8DBF; }
.w-buy a:hover { background-color:#D80072; }




