@charset "utf-8";

/***********全共通リセット****************/

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

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,*/ 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-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, 
 {
	display: block;
}
ul {
	list-style: none;/*olはいったん外しておく*/
}

ol {
	list-style-type: decmal;
	list-style-position: inside;
}

ol li {
	margin-bottom:16px;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* 禁則処理の追加 */
p,li,dt,dd,th,td,pre{
-ms-line-break: strict;
line-break: strict;
-ms-word-break: break-strict;
word-break: break-strict}

/***画像だけベースライン変更****/

img {
	vertical-align: middle;	
	margin-bottom:24px;
	margin-top:12px;
	max-width:100%;
}

table th,td img {
	margin:0; /****表の中のアイコンのため*****/
	vertical-align:middle;	
}

p.inside img {
	margin:0;/****文字と並列の時表示をあわせるため*****/
}
li>img {
	margin:0;/****文字と並列の時表示をあわせるため*****/
}
img a { 
	border:0;
}
/*リセットここまで*/
/**デバイス共通モバイルから**/
html{
	font-family : Verdana,sans-serif;
	line-height: 1.5;	
	text-align:center;
	font-size:85%;
}

html a{
	cursor:pointer;/*リンクをすべて指マークに*/
}

body {
	border-top:5px solid #3c7ece;
	border-top:5px solid #003366;
	-webkit-text-size-adjust: 100%;/*横向きで文字が大きくならない*/
}

ul#login-link {
	display:none;
}
ul#login-link li {
	float:right;
	margin:0 4px;
	/*padding:0 8px;*/
	padding:6px 12px 5px 0px;
	text-align:center;
	margin-bottom:1rem;
}
ul#login-link li.block {
	font-weight:bold;
	padding:6px 12px 5px 12px;
	border:1px solid #333;
}

nav {
	display:none;
}
h1,h2,h3{
	margin-bottom:24px;
	margin-bottom:1.5rem;	
}
h1 {
	font-size:32px;
	font-size:2rem;
	line-height:1.5;
	text-align:center;
	padding:4px;
	background-color:#dcdcdc;
	color:#333;
}
h2 {
	clear:both;
	font-size:1.75rem;
	font-size:28px;
	line-height: 1.5;	
	color:#336699;
	border-bottom:1px dotted #003366;
	margin:10px;
	padding-bottom:0.5rem;
	padding-bottom:8px;
}

section h2 {
	margin:8px 0;
}

h3 {
	margin:10px;
	font-size:1.5rem;
	font-size:24px;
	line-height: 1.5;	
	color:#569900;
}

section.box3 h3 {
	margin:0 0 24px 0;
}

/*Amazonキャンペーンスペシャル*/

h3#amazonex {
	margin:0;
}
h3#amazonex+h4 {
	font-size:1.3rem;
	margin:0;
	background-color:#fff;
}
/*****************************/

h4,h5 {
	font-size:16px;
	font-size:1rem;
	line-height: 1.5;
	margin-bottom:12px;
	margin-bottom:0.75rem;	
	background-color:#e6e6e6;
	font-weight:bold;
	padding:5px 5px 5px 12px;
}

h5{
	background-color:#fff;	
}

/*base-link*/
a {
	color: #0049b1;
	text-decoration:none;
}

a:visited {
	color: #663366;
}

a:hover {
	color: #ff6666;
}

/*************headerの中**************/
header {
	text-align:center;
	padding:0;
	padding-top:6px;
	padding-top:0.375rem;
}
#logo{
	margin:0 auto;
	margin-bottom:8px;
	/*border:1px solid #333;*/
}
#mainslide {
	display:none;
}

#ggsearch {
	display:none;
	/*width:90%;
	margin:0 auto;
	padding:0;
	border:none;
	border:1px solid #333;*/
}


/*********ドットスタイル追加リスト**********/
ul.list {
	list-style-type: disc;
	list-style-position: outside;
	margin:1.5rem;
	padding:0;
}
ul.list li{
	padding-left:2px;
}

/************サポート・問い合わせトップページ**************/
ul.gap li {
	margin-bottom:18px !important;
}


/************モバイル専用メニュー**************/

ul#mob-head {
	display:block;
	font-size:100%;
}
ul#mob-head li {
	float:left;
	margin:0 4px;
	padding:0 10px;
	text-align:center;
	margin-bottom:1.2rem;
	font-weight:bold;
}

#pc {
	display:none;
}

.pc-only {
	display:none;
}
.mobile-only {
	clear:both;
}

#mobile {
	clear:both;
	overflow:hidden;
	margin:0 auto;
	padding:2px 0;
	width:97%;
	/*border:1px solid #333;*/
}
#menuicon {
	/*float:right;*/
	float:left;
	/*height:32px;*/
	/*margin:4px;*/
}
#menuicon p {
	font-size:120%;
}
ul#mob {
	display:none;/***モバイルで開いた時メニューが表示されているかタップで開くか？**/
}

#mobile ul#mob {
	clear:both;
	margin:0 auto;
}

#mobile ul#mob li a {	
	/*position: relative;*/
	float:left;
	width:48%;
	display:block;
	padding:8px 0 2px 8px;
	border-bottom:1px solid #ccc;
	color:#fff;
	/*background-color:#3c7ece;*/
	background-color:#003366;
	font-weight:bold;
}

/*#mobile ul li a::after {
	position: absolute;
	top: 50%;
	right: 10px;
	display: block;
	content: '';
	width: 8px;
	height: 8px;
	margin-top: -4px;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}*/
/*#mobile ul#mob li a:hover {
	/*background-color:#76c659;*/
	background-color:#339999;
	color:#fff;
}*/
/********コンテンツ*********/

#contents {
	clear:both;
	width:90%;
	margin:0 auto;
	/*border:1px solid #333;*/
}

#contents p {
	text-align:left;
	margin-bottom:12px;
}

/*******section********/

section#toppage h1 {
	background-color:#fff;
	color:#003366;
	text-align:left;
	margin-bottom:0.75rem;
	margin-bottom:12px;
}
section#topic h2  {
	background-color:#003366;
	color:#fff;
	padding:0.5rem 0 0.5rem 1rem;
	padding:8px 0 8px 16px;
}
section#ranking h2 {
	background-color:#339999;
	color:#fff;
	padding:0.5rem 0 0.5rem 1rem;
	padding:8px 0 8px 16px;
}

section#topic ul {
	/*list-style-type:decimal ;*/
	list-style-position:inside;
}

section#topic ul li {
	border-top:1px dotted #003366;
	padding:4px 16px;
}
section#ranking ol {
	list-style-type:decimal;
	list-style-position:inside;
}
section#ranking ol li {
	border-top:1px dotted #003366;
	padding:4px 16px;
}
/****最終更新日ポリシー用***/

.update-time {
	display:block;
	text-align:right;
	color:#333ccc;
	margin-bottom:24px;
}

/******時間左表記用********/
.time {
	/*display:block;*/
	/*text-align:left;*/
	color:#333ccc;
	margin-right:0.5　rem;
}

#mainslide img {
	margin:12px 0;
	box-shadow:0 0 5px #e6e6e6;	
}

#contents ol,ul {
	margin-bottom:24px;
	margin-bottom:1.5rem;
	text-align:left;
}

#contents li{
	margin-bottom:8px;
	margin-bottom:0.5rem;
}
#pan{
	/*display:none;*/
	display:block;
	margin-bottom:1rem;
	margin-bottom:16px;
	text-align:left;
	font-size:90%;

}

section.box{
	margin:0 4px 24px 4px;
	/*border:1px solid #ccc;*/
	padding:0;
}

section.box2 {
	margin:0 10px;
	margin-bottom:24px;
	padding:10px;
	border:1px solid #003366;
}
section.product_box {
	margin-bottom:1.5rem;
	padding:0.5rem;
	/*border-top:1px solid #003366;*/
	/*border-bottom:1px solid #003366;*/
}

/**ダイレクト販売ページのみ**/
section.direct {
	margin-bottom:1.5rem;
	padding:0.5rem;
	border:1px solid #003366;
}

ul.menu_direct li {
	float:left;
	padding-right:8px;
	text-align:center;
}
ul.menu_direct li a {
	display:block;
	height:1.8em;  
	padding-top:5px;
	width:290px;
	font-weight:bold;	
	border:2px solid #003333;
}
ul.menu_direct li a.ex {
	color:#fff;
	background-color:#326292;
}
ul.menu_direct li a.hd {
	color:#fff;
	background-color:#333;
}
ul.menu_direct li a.ts {
	color:#fff;
	background-color:#b36733;
}
ul.menu_direct li a:hover {
  	filter: alpha(opacity=50);
  	opacity: .5;
}

/** 横並びaタグの中央揃え（エクセル統計の製品概要ページにて） **/
.yokonarabe {
	display: flex;
	justify-content: center;
	margin-bottom: 20px;
}
.yokonarabe a {
	display: block;
	text-align: center;
	font-weight: bold;
	color:#fff;
	background-color:#326292;
	border:2px solid #003333;
	padding-top: 4px;
	padding-bottom: 4px;
	width:45%;
	margin-right:3px;
	margin-left:3px;
}



/***************buyボタンの設定******************/

img.btn {
	padding:4px 2px 12px 2px;
}

.center {
	text-align:center !important;
	margin:auto 0 !important;
}

.box3 {
	margin:0 8px;
	border:1px solid #cccccc;
	padding:10px;
	margin-bottom:24px;
}


/*********割り込みお知らせ用ボックス********/
.box_b {
	margin-bottom:24px;
	padding:10px;
	border-bottom:1px solid #3c7ece;
}

strong {
	color:#cc3366;
	font-weight:bold;
}

em {
	color:#cc3366;
}

p.notice {
	color:#cc3366;
	margin-bottom:2px;
}
p.topnotice {
	clear:both;
	font-weight:bold;
	padding-top:12px;
	padding-bottom:20px;
}

.notice {  
	color:#cc3366;
	margin-bottom:2px;
}
.boldonly {
	font-weight:bold;
}

/**********購入フロー***********/

ol.flow {
	list-style:none;
}

ol.flow li {
	margin:8px;
	padding:8px;
	border:1px solid #ccc;
	text-align:center;
}

ol.flow p{
	text-align:left;
	margin-top:-24px;
	padding-top:0;
}
ol.flow img{
	margin:0.5rem 0.5rem 1.5rem 0.5rem;
	padding-bottom:0.5rem;
}


/**********プロダクト***********/

ul.product li {
	margin:8px;
	padding:8px;
	text-align:center;
}

ul.product h4{
	background-color:#333333;
	color:#fff5ee;
}

ul.product p {
	border-bottom:1px dotted #333;
	padding-bottom:12px;
}

/********ダイレクト販売のページのみ製品リスト**********/

ul.direct_list {
	margin-bottom:4px;
	padding:0 16px 0 0;
}
ul.direct_list li {
	/*display: block;*/
	/*border-top:1px solid #333;*/
	border-bottom:1px dotted #333;
	padding:4px;
}

ul.direct_list li:last-child {
	border-bottom:none;
}

ul.direct_list img{
	margin:0 6px 4px 0;
	vertical-align:middle;
}

li.gray {
	background-color:#e6e6e6;
}

/*ダイレクト販売ページぶら下がりインデント用リスト*/

ul.indent {
	list-style-image:url(img/indent.png);
	margin-bottom:1.5rem;
	margin-bottom:24px;
	margin-left:2rem;
	margin-left:32px;/* 左マージンインデント用 */
	margin-top:0.25rem;		
	margin-top:4px;	
}

ul.indent li{
	border:none;
	border-bottom:none;
}
.summary2 {
	width:100%;
	padding:0 10px;
	margin-bottom:24px;
}
.summary2 h4{
	margin-bottom:8px;
}

.summaryp {
	width:100%;
	margin:auto;
}
.pck2 {
	margin-top:8px;
	margin-top:0.5rem;
	width:100%;
	text-align:center;
	vertical-align:bottom;	
}

span.product_name {
	font-weight:bold;
}

/*********動画用レスポンシブ*********/
.movief {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}
 
.movief iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/*********footer********/

footer {
	padding:24px 10px;
	background-color:#e5e5e5;
	color:#666666;
	font-size:100%;
}

footer p {
	margin-bottom:5px;
	text-align:left;	
}

footer img{
	text-align: center;
}

footer ul li{
	line-height:32px;
	line-height:2rem;
	text-align:center;
}

small {
	color:#666666;
}

/** margin list **/
.mgntop10 { margin-top:10px }
.mgntop20 { margin-top:20px }
.mgntop30 { margin-top:30px }
.mgntop40 { margin-top:40px }
.mgntop50 { margin-top:50px }
.mgntop60 { margin-top:60px }

.mgnbtm10 { margin-bottom:10px }
.mgnbtm20 { margin-bottom:20px }
.mgnbtm30 { margin-bottom:30px }
.mgnbtm40 { margin-bottom:40px }
.mgnbtm50 { margin-bottom:50px }
.mgnbtm60 { margin-bottom:60px }

.mgnlft10 { margin-left:10px }
.mgnlft20 { margin-left:20px }
.mgnlft30 { margin-left:30px }
.mgnlft40 { margin-left:40px }
.mgnlft50 { margin-left:50px }
.mgnlft60 { margin-left:60px }


/*******icomoonの設定mediascreen768以下に入れるとIEで認識できない********/
@font-face {
    font-family: 'icomoon';
    src:    url('../fonts/icomoon.eot?tdpp4q');
    src:    url('../fonts/icomoon.eot?tdpp4q#iefix') format('embedded-opentype'),
        url('../fonts/icomoon.ttf?tdpp4q') format('truetype'),
        url('../fonts/icomoon.woff?tdpp4q') format('woff'),
        url('../fonts/icomoon.svg?tdpp4q#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

[class^="icon-"], [class*=" icon-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'icomoon' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;

    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-home:before {
	content: "\e900";
	font-size:24px;
	font-size:1.5rem;
	vertical-align:middle;
}
.icon-menu:before {
	content: "\e901";
	/*font-size:32px;*/
	/*font-size:2rem;*/
	font-size:24px;
	font-size:1.5rem;
}

.icon-circle-up:before {
	content: "\e902";
}

.icon-circle-right:before {
	content: "\e903";
	padding:0 3px;
}

ul#mob.icon-circle-right:before {
	content: "\e903";
   	font-size:24px;
	font-size:1.5rem;
	font-weight:bold;
}

.icon-cart:before {
	content: "\e904";
}

.icon-download:before {
	content: "\e905";
	font-size:24px;
	font-size:1.5rem;
	padding:0 3px;
}
ul.menu span.icon-download:before, ul.menu span.icon-circle-right:before, ul.top span.icon-download:before, ul.top span.icon-circle-right:before, div.col3 ul li a span.icon-download:before, div.col3 ul li a span.icon-circle-right:before {
	font-size:110%;
}
ul#login-link span.icon-home:before, ul#login-link span.icon-cart:before {
	font-size:100%;
}
ul#mob-head span.icon-home:before, ul#mob-head span.icon-download:before, ul#mob-head span.icon-circle-right:before, ul#mob-head span.icon-cart:before {
	font-size:100%;
}
.icon-new-tab:before {
	content: "\e906";
      	font-size:16px;
	font-size:1rem;
	padding:0 4px;
}

.icon-file-excel:before {
	content: "\e907";
}

.icon-key:before {
	content: "\e98d";
}
.icon-question:before {
	content: "\ea09";
}
.icon-facebook2:before {
	content: "\ea91";
}
.icon-twitter:before {
	content: "\ea96";
}

.icon-x-logo:before {
  content: "\e910";
}



/***トップへ戻るボタン***/
#pagetop {
	font-size: 72px;
	font-size: 4.5rem;
	position:fixed;
	right:48px;
	right:3rem;
	bottom:24px;
	bottom:1.5rem;
  	display:none;
	margin-bottom:24px;
	margin-bottom:1.5rem;
}

#pagetop a:hover {
	color:#ffbc2c;
}

#logo img {
	margin:0;
	padding:0;
/*	width: 150px; */
	width: 220px; 
}
.company-logo {
	text-align:center;
}

/***基本テーブル：レスポンシブテーブル指定theadを固定してtbodyをスクロールする形に***/

table.common {	
	font-size:12px;
	width:95%;
	display:block;
	margin: 0 auto;
	padding:0;
	border-collapse:collapse;
	position:relative;
	border-spacing:0;
	margin-bottom:24px;
}
table.common thead {
	float:left;
}

table.common thead tr th {
	display:block;
}

table.common thead th {
	white-space: nowrap;
}

table.common tbody {
	display:block;
	position:relative;
	overflow-x: auto;
	white-space:nowrap;
}

table.common tbody tr {
	border-collapse:collapse;
	border-spacing:0;
	display:inline-block;
	vertical-align:middle;
	border-right:1px solid #fff;
}

table.common tbody tr th,
table.common tbody tr td {
	display:block;
	vertical-align:top;
	margin-right:0;
}

table.common tr th{
	text-align:center;
	background:#f5f5dc;
	font-weight:bold;
	padding:6px;
	border-top:1px solid #333;
}

table.common tr td {
	text-align:center;
	background:#fff;
	padding:6px;
	border-top:1px solid #333;
}

table.common tr.alignleft td {
	text-align:left;
}

table.common tr th:last-child,
table.common tr td:last-child {
	border-bottom:1px solid #333;
}

table.common ul {
	margin-bottom:2px;/***テーブルの中のulボトム隙間なくす***/
}


/***************2セルのテーブル768以下******************/

section table.cell2   { 
	font-size:12px;
	width:95%;
	margin:0 auto; 
	margin-bottom:24px;
	border-collapse:collapse;
}

section table.cell2 th,
section table.cell2 td {
        display: block;
 	border-top:1px solid #333;
	padding:6px;
	text-align:left;
 }
 
section table.cell2 th {
	background: #f5f5dc;
	font-weight:bold;
}

section table.cell2 tr:last-child {
	border-bottom:1px solid #333;
}

table.nores {
	width:95%;
	margin:0 auto; 
	margin-bottom:24px;
	border-collapse:collapse;
}

table.nores th,
table.nores td {
 	border-top:1px solid #333;
	padding:6px;
	text-align:left;
}
table.nores th {
	background: #f5f5dc;
	font-weight:bold;
}

table.nores tr:last-child {
	border-bottom:1px solid #333;
}

.clearboth {
	clear:both;
}


/************ form フォーム ************/
select {
	font-size:120%;
}
 

/**********Function内のサブメニュー横並びで***********/

ul#ex-function {
	display:block;
	margin-left:24px;
	margin-left:1.5rem;
}
ul#ex-function li {
	padding-bottom:8px;
	border-bottom:1px dotted #ccc;
	font-weight:bold;
}


figcaption {
	color:#000099;
	font-size:0.9rem;
}

/**********秀吉ポイントページのサブメニュー横並びで***********/

ul#hd-point {
	display:block;
	margin-left:24px;
	margin-left:1.5rem;
}
ul#hd-point li {
	padding-bottom:8px;
	border-bottom:1px dotted #ccc;
	font-weight:bold;
}

/**********support内のサブメニュー横並びで***********/
ul#support {
	display:block;
	margin-left:24px;
	margin-left:1.5rem;
}
ul#support li {
	padding-bottom:8px;
	border-bottom:1px dotted #ccc;
	font-weight:bold;
}

.float-left {
	float:left;
}
.float-left img {
	display:block;
	margin-left:0;
	margin-right:2rem;
}

/********とりあえず何にでもインデントつける********/
.indent {
	text-indent:2rem;	/* 行頭インデント */
}

/**ボタンデザイン**/
section.gobutton {
	text-align:center;
	margin-bottom:1.2rem;
	padding:4px;
}

div.gobutton_button {
	background-color: #326292;
  	font-size: 1.6rem;
  	line-height: 54px;
  	height: 54px;
  	width: 560px;
	margin: 0 auto;
	margin-top:1.2rem;
	margin-bottom:1.2rem;
  	border-radius: 5px;
}

div.gobutton_button a {
	color: #fff;
	text-decoration:none;
}

div.gobutton_button:hover {
  	filter: alpha(opacity=50);
  	opacity: .5;
}



@media print,screen and (min-width:768px) {
/**************************************************************************************ここに768-1023まで*/
html {
	font-size:95%;
}
body {
	/*border-top:15px solid #3c7ece;*/
	border-top:15px solid #003366;
}

#ggsearch {
	display:block;
	float:right;
	height:52px;
	width:220px;
}
.cse .gsc-control-cse,
.gsc-control-cse {
	padding: 0 !important;
}

table.gsc-search-box td.gsc-input {
  	padding-right: 0 !important;
}

#logo {
	margin:4px 0 0 2px;
}
#logo img {
	/*width : 200px;*/
	width : 241px;
	float:left;
	margin: 8px 24px 8px 2px;
}

ul#mob-head {
	display:none;
}

#pc {
	display:block;
	clear:both;
}


.pc-only {
	display:block;
}
.mobile-only {
	display:none;
}

#mobile {
	display:none;
}

header {
	width:90%;
	margin:0 auto;
}

ul#login-link {
	display:block;
	margin:0 auto;
	font-size:100%;
	padding: 8px 0 0;
	height:20px;
}

nav {
	display:block;
	clear:both;
}

ul.menu{
	zoom:1;
	width:100%;
}

ul.menu li{
	float:left;
	width:18%;
	height:48px;
	height:3rem;
	position:relative;
	text-align:center;
	/*background-color:#3c7ece;*/
	background-color:#003366;
}

/* 割り込みボックス  */
.box_b {
	margin-bottom:24px;
	padding:10px;
	border:1px solid #3c7ece;
}

/**グローバルナビ一番右ボタンの色だけ変更***/
ul.menu li:last-child {
	background-color:#7db800;
	/*background-color:#ff6699;
	background-color:#ff9966;
	background-color:#669900;
	background-color:#009999;*/
	/*background-color:#990066;*/
	width:18%;
}
ul.menu li#home{
	width:10%;	
}

ul.menu li a{
	display:block;
	width:100%;
	height:100%;
	line-height:48px;/*これを入れておかないと文字を真ん中に配置できない*/
	line-height:3rem;
	border-left:2px solid #fff;
	font-weight:bold;
	color:#fff;
}
ul.menu li#home a {
	border-left:1px dotted #ffffff;	
}
ul.menu li a:hover {
	color:#fff;
	background-color:#339999;
  	/*filter: alpha(opacity=50);
  	opacity: .5;*/
}

/**グローバルナビ一番右ボタンの色だけ変更***/
ul.menu li:last-child a:hover {
	color:#fff;
	background-color:#b6d7a8;
}

ul.menu:after {
	height:0;
	visibility:hidden;
	content:".";
	display:block;
	clear:both;
}
#buy-menu.icon-circle-right:before {
   	font-size:24px;
	font-size:1.5rem;
	font-weight:bold;
}

ul.sub{
	position:absolute;
}
ul.sub li{
	width:100%;
	font-size:100%;
	text-align:left;
	text-indent:10px;
	z-index:100;	
	font-weight:bold;
	border-top:1px solid #fff;
	background-color:#666;
}

ul.sub li a:hover {
	color:#fff;
	/*background-color:#6495ed;*/
	background-color:#339999;
}

p.topnotice {
	padding-top:0;
	margin-top:0;
}

/*******ギャラリー***********/

img { 
	max-width : 100%;
}
#mainslide {
	width:98%;
	margin-bottom:12px;
	margin-bottom:0.75rem;
	z-index:10;
	display:block;
	clear:both;
	margin:0 auto;
	padding:0;
}

#mainslide img {
	margin:0;
}

#contents { 
	/*width:90%;*/
	text-align:left;
	overflow:hidden;
	/*border:1px solid #333;*/?
}
/*パンくず表示*/
#pan{
	display:block;
	margin-bottom:1rem;
	margin-bottom:16px;
	text-align:left;
	font-size:90%;
}
/*******section********/

section#toppage {
	/*border:1px solid #333333;*/
	width:100%;
	overflow:hidden;
}

section#toppage img {
	float:left;
	margin:0.75rem;
	margin:12px;
}

section#topic {
	/*float:left;*/
	/*margin:0 10px;*/
	margin:0 4px 24px 4px;
	padding:0;
	width:100%;
}
section#ranking {
	float:right;
	margin:0 10px;
	width:100%;
}
section#ranking ol li {
	/*border-top:1px dotted #3c7ece;*/
	border-top:1px dotted #003366;
	padding:4px 16px;
}
section.box {
	overflow:hidden;
}
section.box2 {
	float:left;
	width:31.745833333%;/*302/960*/
	width:302px;
}

/**ダイレクト販売ページのみ**/
section.direct {
	float:left;
	margin:4px;
	width:33.3333333%;/*320/960*/
	width:320px;
	text-align:center;
}
section.product_box {
	float:left;
	margin:4px;
	width:33.3333333%;/*320/960*/
	width:320px;
	text-align:center;
}

ul.indent {
	margin-bottom:0.25rem;
	margin-bottom:4px;
}
.price{
	display:block;
	margin-top:2px;
	margin-bottom:0;
}

ul.direct_list {
	margin-bottom:4px;
	padding:0;
}

.summaryp {
	float:right;
	width:100%;
	padding:0;
}

.summary2 {
	float:right;
	width:80%;
	padding:0 4px;
}

section.box3 {
	float:left;
	width:37.916666666%;/*364/960*/
	width:364px;
	border:1px solid #333333;
}

ul.menu_direct li a {
	display:block;
	height:1.8em;  
	padding-top:5px;
	width:370px;
	font-weight:bold;	
	border:2px solid #003333;
}


/*box内box*/
.summary {
	float:right;
	width:70%;
	padding:0 10px;
	border-left:1px dotted #009999;
}
.pck {
	float:left;
	margin-top:24px;
	margin-top:1.5rem;
	width:26%;
	height:160px;
	text-align:center;
	vertical-align:bottom;	
}
.more {
	display:block;
	margin-bottom:16px;
	text-align:right;
	font-size:90%;
}

.floatright {
	display:block;
	float:right;
}


/**ダイレクト販売のページのみ製品リスト**/

.summary2 {
	float:right;
	width:80%;
	padding:0 10px;
}
.summaryp {
	float:right;
	width:80%;
	padding:0 10px;
}
.pck2 {
	float:left;
	margin-top:8px;
	margin-top:0.5rem;
	width:15%;
	text-align:center;
	vertical-align:bottom;	
}

/*********768以上レスポンシブ対応テーブル指定*************/

table.common {
	font-size:100%;
	width:100%;
	margin:0 auto;
	display:table;
	/*border-collapse:separate;*/
	margin-bottom:24px;
}

table.common thead {
	display:table-header-group;
	float:none;
}

table.common thead tr {
	display:table-row;
	float:none;
}

table.common thead tr th {
	display:table-cell;
	border-right:1px solid #fff;
	border-bottom :none;/*separateだと二重になっちゃう*/
}

table.common tbody{
	display:table-row-group;
}

table.common tbody td{
	white-space:normal;.*/thだけを改行なし指定にしないと*/
}

table.common tbody tr {
	display:table-row;
	border-right:1px solid #fff;
}

table.common tbody tr th,
table.common tbody tr td {
	display:table-cell;
}

table.common tbody tr td {
	text-align:left;
}

table.common tr:last-child {
	border-bottom:1px solid #333;
}

/**********2セルのテーブル普通*********************/

section table.cell2   { 
	font-size:100%;
	width: 100%; 
}
section table.cell2  th  { 
	padding: 1rem; 
	display:table-cell;
}
section table.cell2  td  { 
	padding: 1rem; 
	display:table-cell;
}
section table.cell2 th  { 
	width:25%;
 }
/******thの幅30から50を決める************/
section table.cell2 th.w50  { 
	width:50%;
 }
 
 section table.cell2 th.w40  { 
	width:40%;
 }
  section table.cell2 th.w30  { 
	width:30%;
 }
  section table.cell2 th.w20  { 
	width:20%;
 }
 
section table.cell2 tr:last-child {
	border-bottom:1px solid #333;
}

/**********レスポンシブしないテーブル************/
table.nores {
	width: 100%; 
}
table.nores th,
table.nores td {
	padding: 6px; 
	display:table-cell;
}
table.nores th {
	width:25%;
}

/******************************************/

/**********購入フロー***********/

ol.flow p {
	padding:1rem;
}

/**********プロダクト***********/

ul.product li {
	width:45.8333333333%;/*440/960*/
	height:220px;
	padding:0;
	float:left;
}

ul.product p {
	padding-bottom:16px;
	
}

/**********support内のサブメニュー横並びで***********/

ul#support {
	display:block;
	height:48px;
	padding-bottom:24px;
	width:100%;
	margin-left:0;/*モバイル打ち消し用*/
}

ul#support li {
	width:24%;
	float:left;
	font-weight:normal;
	margin-bottom:2px;
	text-align:center;
	padding:1px 2px;/*モバイル打ち消し用*/
	border-bottom:none;/*モバイル打ち消し用*/
}

ul#support li a {
	display:block;	
	height:1.5em;  
	line-height:1em;
	background-color:#568800;
	padding:8px 8px 2px 8px;
	color: #fff;
	text-decoration:none;
}

ul#support li.last a {
	background-color:#ff9966;
	font-weight:bold;
}

ul#support li a:hover {
  	filter: alpha(opacity=50);
  	opacity: .5;
}

/**********Function内のサブメニュー横並びで***********/

ul#ex-function {
	display:block;
	height:24px;
	padding-bottom:56px;
	width:100%;
	margin-left:0;/*モバイル打ち消し用*/
}

ul#ex-function li {
	width:32%;
	float:left;
	font-weight:normal;
	border-right:1px solid #fff;
	margin-bottom:2px;
	text-align:center;
	padding:1px 2px;/*モバイル打ち消し用*/
	border-bottom:none;/*モバイル打ち消し用*/
}


ul#ex-function li.last {
	border-right:0;
}

ul#ex-function li a{
	display:block;	
	height:1.5em;  
	line-height:1em;
	background-color:#006699;
	background-color:#3489b4;
	padding:8px 8px 2px 8px;
	color: #fff;
	text-decoration:none;
}

ul#ex-function li a:hover {
  	filter: alpha(opacity=50);
  	opacity: .5;
}

/**********秀吉pointのサブメニュー横並びで***********/

ul#hd-point {
	display:block;
	height:48px;
	padding-bottom:56px;
	margin-bottom:24px;
	width:100%;
	margin-left:0;/*モバイル打ち消し用*/
}

ul#hd-point li {
	width:32%;
	float:left;
	font-size:85%;
	font-weight:bold;
	border-right:1px solid #fff;
	margin-bottom:2px;
	text-align:left;
	padding:1px 2px;/*モバイル打ち消し用*/
	border-bottom:none;/*モバイル打ち消し用*/
}

ul#hd-point li a{
	display:block;	
	height:3em;  
	line-height:1.5em;
	background-color:#ccc;
	padding:8px 8px 2px 8px;
	color: #000;
	text-decoration:none;
}

ul#hd-point li a:hover {
  	filter: alpha(opacity=50);
  	opacity: .5;
}

/*footer内ボックス*/

footer {
	clear:both;
	margin: 0 auto;
}

footer h3 {	
	margin:24px 5px 12px 5px;
}

footer p {
	clear:both;
}
footer ul li {
	text-align:left;
}

.col3 {
	float:left;
	border-left:1px dotted #666666;
	width:27.083333333%;/*260/960*/
	margin:15px 5px;
	padding:5px 15px;
	text-align:left;
}

.col2 {
	float:left;
	border-left:1px dotted #666666;
	width:45.6%;/*260/960*/
	margin:15px 5px;
	padding:5px 15px;
	text-align:left;
}


/*詳細のリスト*/
.foot-last {
	clear:both;
}
.foot-last ul {
	overflow:hidden;
	margin:10px auto;
}
.foot-last ul li  {
	float:right;
	margin:2px 5px;
	padding:5px 5px;
}
#copy {
	clear:both;
	text-align:center;
}
}

@media screen and (min-width:1024px) {
/***************************************************************************************ここに1024以上*/
html {
	/*background: url(../img/960_grid_12_col.png) no-repeat top center;*/
	font-size:100%;
	overflow:auto;
}

body {
	overflow:hidden;
}
	
header {
	width : 960px;
	margin : 0 auto;
	padding-top:0;
}

#ggsearch {
	width:280px;
}

#logo img {
	margin:8px 24px 8px 0;
}

nav {
	width:100%;
}

#contents {
	overflow:hidden;
	width : 960px;
	margin : 0 auto;
}


section#topic {
	/*width:46.8750%;/*450/960*/
}
section#ranking {
	width:46.8750%;/*450/960*/
}

section.box2 {
	float:left;
	width:45.55208333333%;/*437/960*/
	width:437px;
}

/* cumulative layout shift対策  */
#mainslide {
	width:100%;
        height:290px;
}


/**ダイレクト販売ページのみ**/
section.direct {
	float:left;
	width:46.875%;/*450/960*/
	width:450px;
}
section.product_box {
	float:left;
	width:100%;
}


section.box3 {
	width:28.9584%;/*278/960*/
	width:278px;
}

ul.menu_direct li a {
	width:450px;
}



/**********購入フロー***********/

ol.flow li {
	list-style-position:inside;
	width:31.1875%;/*306/960*/
	height:330px;
	padding:0;
	float:left;
}
/**********プロダクト***********/

ul.product li {
	width:47.91666666%;/*460/960*/
	padding:0;
	height:200px;
}


/**********Function内のサブメニュー横並びで***********/

ul#ex-function {
	display:block;
	height:24px;
	width:100%;
}
ul#ex-function li {
	width:24%;
}


/**********support内のサブメニュー横並びで***********/

ul#support {
	display:block;
	height:48px;
	width:100%;
}
ul#support li {
	width:19%;
}
/*******フッター******/

footer {
	width:100%;
}

.footer-in {
	width : 960px;
	margin :0 auto;
}	

footer ul li{
	line-height:28px;
	line-height:1.75rem;
}

.col3 {
	width:28.9584%;/*278/960*/
}

small {
	font-size:90%;

}

.company-logo {
	text-align:right;
}

}

/******************プリント用テスト*************************/

@media print {
html,body {
	/*_zoom: 70%;*/
}

/* 印刷時に画面と変更するスタイルを定義 */

html{
	font-size:85%;
	overflow:auto;
}

#contents {
	overflow:hidden;
	width : 95%;
	margin : 0 auto;
}

#mainslide img {
	width : 670px;	
}

aside {
	display:none;
}

section.box2 {
	float:left;
	width:40%;
}
/**ダイレクト販売ページのみ**/
section.direct {
	float:left;
	width:40%;
}
section.product_box {
	float:left;
	width:40%;
}

section.box3 {
	float:left;
	width:40%;
}

nav,footer {
	display:none;
}

ol.flow li {
	float:left;
	width:28%;
	height:350px;
}
}


/*****Amazon Product Advertising API（商品情報API）の設定**********/

.paapi5-pa-ad-unit {
    border: 1px solid #eee;
    margin:2px;
    position: relative;
    overflow: hidden;
    padding: 22px 20px;
    line-height: 1.1em;
}
.paapi5-pa-ad-unit * {
    box-sizing: content-box;
    box-shadow: none;
    font-family: Arial, Helvetica, sans-serif;
    margin: 0;
    outline: 0;
    padding: 0;
}
.paapi5-pa-ad-unit.pull-left {
    float: left;
}
.paapi5-pa-ad-unit.pull-right {
    float: right;
}
.paapi5-pa-ad-unit a {
    box-shadow: none !important;
}
.paapi5-pa-ad-unit a:hover {
    color: #C45500;
}
.paapi5-pa-product-container {
    width: 180px;
    height: 210px;
}
/* fixed width and height of product image to 150px */
.paapi5-pa-product-image {
    display: table;
    width: 150px;
    height: 150px;
    margin: 0 auto;
    text-align: center;
}
.paapi5-pa-product-image-wrapper {
    display: table-cell;
    vertical-align: middle;
}
.paapi5-pa-product-image-link {
    position: relative;
    display: inline-block;
    vertical-align: middle;
}
.paapi5-pa-product-image-source {
    max-width: 150px;
    max-height: 150px;
    vertical-align: bottom;
}
.paapi5-pa-percent-off {
    display: block;
    width: 32px;
    height: 25px;
    padding-top: 8px;
    position: absolute;
    top: -16px;
    right: -16px;
    color: #FFFFFF;
    font-size: 12px;
    text-align: center;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
    background-color: #A50200;
    background-image: -webkit-linear-gradient(top, #CB0400, #A50200);
    background-image: linear-gradient(to bottom, #CB0400, #A50200);
}
.paapi5-pa-ad-unit.hide-percent-off-badge .paapi5-pa-percent-off {
    display: none;
}
.paapi5-pa-product-details {
    display: inline-block;
    max-width: 100%;
    margin-top: 11px;
    text-align: center;
    width: 100%;
}
.paapi5-pa-ad-unit .paapi5-pa-product-title a {
    display: block;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 13px;
    color: #0066C0;
    text-decoration: none;
    margin-bottom: 3px;
}
.paapi5-pa-ad-unit .paapi5-pa-product-title a:hover {
    text-decoration: underline;
    color: #C45500;
}
.paapi5-pa-ad-unit.no-truncate .paapi5-pa-product-title a {
    text-overflow: initial;
    white-space: initial;
}
.paapi5-pa-product-offer-price {
    font-size: 13px;
    color: #111111;
}
.paapi5-pa-product-offer-price-value {
    color: #AB1700;
    font-weight: bold;
    font-size: 1.1em;
    margin-right: 3px;
}
.paapi5-pa-product-list-price {
    font-size: 13px;
    color: #565656;
}
.paapi5-pa-product-list-price-value {
    text-decoration: line-through;
    font-size: 0.99em;
}
.paapi5-pa-product-prime-icon .icon-prime-all {
    background: url("https://images-na.ssl-images-amazon.com/images/G/01/AUIClients/AmazonUIBaseCSS-sprite_2x_weblab_AUI_100106_T1-4e9f4ae74b1b576e5f55de370aae7aedaedf390d._V2_.png") no-repeat;
    display: inline-block;
    margin-top: -1px;
    vertical-align: middle;
    background-position: -192px -911px;
    background-size: 560px 938px;
    width: 52px;
    height: 15px;
}
.paapi5-pa-product-offer-price,
.paapi5-pa-product-list-price,
.paapi5-pa-product-prime-icon {
    display: inline-block;
    margin-right: 3px;
}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .paapi5-pa-ad-unit .paapi5-pa-product-prime-icon .icon-prime-all {
        background: url("https://images-na.ssl-images-amazon.com/images/G/01/AUIClients/AmazonUIBaseCSS-sprite_2x_weblab_AUI_100106_T1-4e9f4ae74b1b576e5f55de370aae7aedaedf390d._V2_.png") no-repeat;
        display: inline-block;
        margin-top: -1px;
        vertical-align: middle;
        background-position: -192px -911px;
        background-size: 560px 938px;
        width: 52px;
        height: 15px;
    }
}
/* css for mobile devices when device width is less than 441px*/
@media  screen and (max-width: 440px) {
    .paapi5-pa-ad-unit {
        float: none;
        width: 100%;
    }
    .paapi5-pa-product-container {
        margin: 0 auto;
        width: 100%;
    }
    .paapi5-pa-product-details {
        text-align: center;
        margin-top: 11px;
    }
}
