@charset "utf-8";

* {
	margin: 0;
	padding: 0;
}

	
body {
	font-family: 'Noto Sans JP', sans-serif;
	/*font: 100%/1.4 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;*/
	margin: 0;
	padding: 0;
	color: #555;
	font-size: large;
}

/* ~~ エレメント / タグセレクター ~~ */
ul, ol, dl { /* ブラウザー間の相違により、リストの余白とマージンをゼロにすることをお勧めします。一貫性を保つために、量をここで指定するか、リストに含まれるリスト項目 (LI、DT、DD) で指定できます。より詳細なセレクターを記述しない限り、ここで指定する内容が .nav リストにも適用されることに注意してください。 */
	padding: 0;
	margin: 0;
}

h1, h2, h3, h4, h5, h6, p {
	margin-top: 0;	 /* 上マージンを削除すると、マージンを含む div からマージンがはみ出す場合があるという問題を回避できます。残った下マージンにより、後続のエレメントからは離されます。 */
	padding-right: 15px;
	padding-left: 15px; /* div 自体ではなく div 内でエレメントの両側に余白を追加すると、ボックスモデル計算が不要になります。代わりに、両側に余白を指定した div をネストして使用することもできます。 */
	margin-bottom: 10px;
}
h1, h2, h3, h4, h5, h6 {
	clear: both; /* 見出しの回り込み解除 */
}
a img { /* このセレクターは、一部のブラウザーでイメージをリンクで囲んだ場合にイメージの周囲に表示される初期設定の青いボーダーを削除します。 */
	border: none;
}

/* ~~ サイトのリンクのスタイル付けは、ホバー効果を作成するセレクターグループも含め、この順序にする必要があります。~~ */
a:link {
	color: #060;
	text-decoration: underline; /* 非常に特殊な表示方法でリンクをスタイル付けする場合を除き、一目で見分けられるように下線を指定することをお勧めします。 */
}
a:hover { /* このセレクターグループは、キーボードを使用するユーザーに対し、マウスを使用するユーザーと同じホバー効果を提供します。 */
	text-decoration: none;
}

/* ~~ コンテナ ~~ */
#container {
	width: 100%;
	clear: both;
	overflow: hidden;
	display: flex;
	-moz-display: flex;
	/* flexはmainの横幅を可変状態にしたまま横並びにするための指定です。DW上ではプレビューされません。 */
}



/* ~~ このセレクターグループは、#main 内のリストに領域間隔を指定します。~~ */
#main ul, #main ol { 
	padding: 0 15px 15px 40px; /* この余白は、上述の見出しと段落ルールの右の余白を表します。下の余白はリスト内の他のエレメントとの間隔用に配置され、左の余白はインデント作成用に配置されています。これは必要に応じて調整できます。 */
}

/* ~~ フッター ~~ */
footer {
	width: 100%;
	overflow: hidden;
	clear: both;
	margin-top: 10px;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
	padding-top: 10px;
	padding-right: 0;
	padding-bottom: 10px;
	padding-left: 0;
}
footer h2 {
	color: #FFF;
	background-color: #0C0;
	width: 98%;
	text-align: center;
	padding: 0.3%;
	margin-right: auto;
	margin-left: auto;
	border-radius: 5px;
}
footer .foot_box {
	overflow: hidden;
	display: flex;
	-moz-display: flex;
	margin-top: 0.8em;
	margin-right: 0;
	margin-bottom: 0.5em;
	margin-left: 0;
	padding-right: 0;
	padding-bottom: 0.5em;
	padding-left: 0;
	/* flexはmainの横幅を可変状態にしたまま横並びにするための指定です。DW上ではプレビューされません。 */
}
footer .foot_box p {
	clear: both;
}
footer .foot_box .foot_left,
footer .foot_box .foot_right {
	width: 50%;
	margin: 0 0.5em;
	padding: 0 0 5px;
	background: #FFF;
	border-radius: 10px;
}
footer .foot_box .foot_left {
	margin: 0 0.5em 0 1em;
}
footer .foot_box .foot_right {
	margin: 0 1em 0 0.5em;
}

footer .foot_box h3  {
	background: #0C0;
	font-size: medium;
	text-align: center;
	line-height: 200%;
	margin-bottom: 5px;
	color: #FFF;
	border-radius: 5px;
}
footer .foot_box ul {
	width: 95%;
	overflow: hidden;
	margin: 0 auto;
}
footer .foot_box ul li {
	width: auto;
	float: left;
	list-style-type: none;
	padding: 0.5em;
	margin: 0.5em;
	display: block;
	background: #FFF;
	border: 2px #FF9900 solid;
	border-radius: 10px;
	color: #600;
	font-weight: bold;
}
footer .foot_box ul li:first-child {
	background: #F90;
}



table {

		  border-collapse: collapse;
  border-spacing: 0;
	}
	
	
/* サイドバー削除用ID */	
#side_none #side {
	display:none;
}
/* サイドバー削除用時のメイン幅 */

#side_none #main {
	width:75%;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}
	
	

/* サイドバー */
#side {
	width: 250px;
	min-width: 250px;
	overflow: hidden;
	text-align: center;
	line-height: 200%;
	padding: 10px;
	margin-right: 10px;
	background-color: #DFE8E0;
}
#side ul {
	text-align: left;
	margin-left: 3em;
	list-style-type: square;
	color: #060;
}
#rank,
#category {
	margin: 0 0 30px;
}
#rank,
#category,
#sub_nav {
	background-color: #FFF;
	border-radius: 10px;
	padding: 5px 0;
}
#sub_nav h2 {
	margin: 1.5em;
}
#sub_nav ul {
	width: 85%;
	height: auto;
	margin: 0 auto;
	list-style-type: none;
}
#sub_nav ul li {
	text-align: center;
	margin: 0 0 0.5em;
}
#sub_nav ul li a {
	width: 100%;
	height: auto;
	display: block;
	background: #0C0;
	border: 1px outset #090;
	border-radius: 8px;
	color: #FFF;
	font-weight: bold;
	text-decoration: none;
	padding: 0.5em 0;
}
#sub_nav ul li a:hover {
	background-color: #090;
}

/* メイン */
#main {
	width: 100%;
	min-width: 518px;
	/* サイドと合わせて768pxになるように指定 */
	overflow: hidden;
	padding: 10px 0;
}

	/* サイドなしの時の設定 */
#pc_container #main {
	width: 100%;
	padding: 10px 0;
}



/* パンくずリスト */
#pankuzu {
	line-height: 200%;
}

/* スライダー */
.swiper-container {
	width: 1100px;
	height: auto;
}
.swiper-slide {
	text-align: center;
}


/* 商品一覧 */
#listbox {
	padding: 0px;
	margin: 0 1em 10px;
	overflow: hidden;
}
#listbox dt {
	display: block;
	overflow: hidden;
}
#listbox dd {
	width: 100%;
	display: block;
	padding: 10px;
	padding-left: 0px;
	margin: 0px;
}
/*#listbox img {
	width: inherit !important;
	height: inherit !important;
}*/
#listbox ul {
	list-style-type: none;
	margin: 0;
	padding: 0 0.5em;
}
#listbox ul li {
	float: left;
	margin: 0 0.5em;
}

/* コンテンツ区切り */
#main .contents {
	margin: 1em;
/*overflow: hidden;*/	
}






/* 続きを読むボタン */
.readmore {
    position: relative;
}
.readmore label {
	height: 200px; /* グラデーションの高さ */
	cursor: pointer;
	text-align: center;
	font-size: xx-large;
	position: absolute;
	bottom: -64px;
	width: 100%;
	/* 以下グラデーションは「背景が白」に併せて設定しています */ 
	background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.95) 90%);
	background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.95) 90%);
	background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.95) 90%);
	background: -ms-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.95) 90%);
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.95) 90%);
	left: -4px;
}
.readmore input:checked + label {
    background: inherit; /* 開いた時には背景グラデーションを消す */
}
.readmore label:after {
    content: "続きを見る"; /* ラベルの文字 */
    line-height: 2.5rem;
    position: absolute;
    bottom: 20px;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    color: #fff;
    background-color: #0C6;
    width: 30%;
	border: #060 1px solid;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
	color: #FFF;
	font-weight: bold;
	padding: 0.5em 0;
}
.readmore input {
    display: none;
}
.readmore .readmore_box {
    overflow: hidden;
    /*height: 4000px;  開く前に見えている部分の高さ */
    -webkit-transition: all 0.1s;
    -moz-transition: all 0.1s;
    -ms-transition: all 0.1s;
    -o-transition: all 0.1s;
    transition: all 0.1s;
}

.readmore input:checked + label {
     display: none ; /*閉じるボタンは要らないとき */
}
.readmore input:checked ~ .readmore_box {
    height: auto;
    -webkit-transition: all 0.1s;
    -moz-transition: all 0.1s;
    -ms-transition: all 0.1s;
    -o-transition: all 0.1s;
    transition: all 0.1s;
}


/* 商品ページ外部ショップリンク横並び */
.shop_link {
	overflow: hidden;
}
.shop_link p {
	clear: both;
}
.shop_link img {
	width: 100%;
	height: auto;
}
.shop_link p.shop_link_c {
	width: 48%;
	height: auto;
	float: left;
	clear: none;
	padding: 5px;
}

video {
	margin: 0px;
	padding: 0px;
}



#hikaku-scroll {
	width: 99%;
	overflow: scroll;
	margin-right: auto;
	margin-left: auto;
}

#hikaku-itiran{
	width: 93%;
	border-width: 1px 0px 1px 1px;
	border-style: solid;
	border-color: #CCC;
	margin-right: auto;
	margin-left: auto;
}
#hikaku-itiran td {
	width: 12%;
	border-style: solid;
	border-width: 0px 1px 0px 0px;
	text-align: center;
	padding: 1%;
	border-color: #CCC;
}





@media screen and ( min-width:920px ) {
	

/*==================  P　C　用  ==================*/	

	.pc_none{
		display:none;}
		
		
		/* ページトップへ戻る */
#pagetop {
	display: none;
	position: fixed;
	bottom: 0;
	right: 10px;
}
#pagetop a {
	background-color: #0C6;
	color: #FFF;
	font-weight: bold;
	text-decoration: none;
	padding: 10px;
	border: 2px #FFFFFF solid;
	border-radius: 10px 10px 0 0;
}
	
	
	/* ~~ ヘッダー ~~ */
header {
	overflow: hidden;
	display: block;
}
header h1 {
	width: 100%;
	font-size: medium;
	line-height: 200%;
	margin: 0 0 10px;
	padding: 0 1em;
	color: #060;
}
header #left {
	float: left;
}
header #right {
	float: right;
}
header #left img,
header #right img {
	width: auto;
	height: auto;
}



h1 {
	font-size: small;
	padding: 0px;
	text-align: center;
	}
	






/*   ▼▼メニュー ▼▼  */

header nav ul {
		width: 100%;
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	text-align:center;
	background-color: rgb(51,153,0);

}
/*ドロップダウン*/

.menu {
	position: relative;
	width: 100%;
	height: 50px;
	max-width: 100%;
	margin: 0 auto;
}
.menu > li {
	float: left;
	width: 20%; /* グローバルナビ5つの場合 */
	height: 50px;
	line-height: 50px;
	background-color: rgb(51,153,0);
}
.menu > li a {
	display: block;
	color: #fff;
	text-decoration: none;
}
.menu > li a:hover {
	color: #FFF;
}
ul.menu__second-level {
	visibility: hidden;
	opacity: 0;
	z-index: 1;
}
ul.menu__third-level {
	visibility: hidden;
	opacity: 0;
}
ul.menu__fourth-level {
	visibility: hidden;
	opacity: 0;
}
.menu > li:hover {
	transition: all .5s;
	background-color: #66CC00;
}
.menu__second-level li {
	border-top: 1px solid #111;
}
.menu__third-level li {
	border-top: 1px solid #111;
}
.menu__second-level li a:hover {
	background-color: #9F6;
}
.menu__third-level li a:hover {
	background: #2a1f1f;
}
.menu__fourth-level li a:hover {
	background: #1d0f0f;
}

/* 下矢印 */
.init-bottom:after {
	content: '';
	display: inline-block;
	width: 6px;
	height: 6px;
	margin: 0 0 0 15px;
	border-right: 1px solid #fff;
	border-bottom: 1px solid #fff;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}
/* floatクリア */
.menu:before, .menu:after {
	content: " ";
	display: table;
}
.menu:after {
	clear: both;
}
.menu {
 *zoom: 1;
}
/**/
.menu > li.menu__single {
	position: relative;
}
li.menu__single ul.menu__second-level {
	position: absolute;
	top: -1px;
	width: 100%;
	-webkit-transition: all .2s ease;
	transition: all .2s ease;
	background-color: #00CC00;
	left: 1px;
}
li.menu__single:hover ul.menu__second-level {
	top: 50px;
	visibility: visible;
	opacity: 1;
}
.lp_wrapper {
	width: 1000px;
	margin-right: auto;
	margin-left: auto;
}

/*   ▲▲メニュー ▲▲  */




	/* アイボリー　ボックス*/
	
	.ca_box {
	background-color: #FBF8C9;
	width: 750px;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
}

	
		
	
/*商品定義リスト*/
.item_list {
	border: 1px solid #999;
	height: auto;
	width: 96%;
	overflow: hidden;
	display: flex;
	margin-top: 0.5em;
	margin-right: auto;
	margin-bottom: 0.5em;
	margin-left: auto;
}
.item_list dt {
	margin: 0%;
	padding: 2% 0% 1% 2%;
	text-align: center;
	width: 28%;
	display: block;
}
.item_list dt img {
	padding: 0%;
}
.item_list dd {
	width:65%;
	vertical-align: top;
	border: 0px solid #999;
	display: block;
	padding: 2%;
	margin: 0px;
	text-align: left;
}
.item_list dd h3 {
	padding-left: 10px;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	border: 2px dotted #999;
}
.item_list dd form {
	padding: 8px 10px 5px 0px;
	text-align: right;
	border: 1px dotted #999;
	margin: 0.5em 10px 0.5em 0.5em;
	display: block;
}
.item_list dd form input {
	font-size: medium;
	letter-spacing: 0.1em;
	margin-right: 10px;
}
.item_list dd form select {
	font-size: medium;
}

.left_txt01{
	width: 80%;
	text-align: left;
	margin-right: auto;
	margin-left: auto;
	}
	
	
div.ec_link{
	display: flex;
	width: 820px;
	margin-right: auto;
	margin-left: auto;
}	
	
	div.ec_link p {
	padding: 10px;
}

.mail_link {
	margin-top: 1em;
	margin-bottom: 1em;
}
.mail_link a {
	font-size: 50px;
	line-height: 130%;
	font-weight: bolder;
	color: #FFF;
	background-color: #F03;
	text-align: center;
	padding: 5px;
	display: block;
	text-decoration: none;
	transition: all  0.3s ease;
}
.mail_link a:hover {
	font-size: 50px;
	line-height: 130%;
	font-weight: bolder;
	color: #F03;
	background-color: #FF0;
	text-align: center;
	padding: 5px;
	display: block;
	text-decoration: none;
	transition: all  0.3s ease;
}




/*幅広LP用設定　一部BODYidで振り分け設定使用*/
#side_none .lp-wide001{
	width: 1000px;
	margin-right: auto;
	margin-left: auto;
	}

#lp01 #side{
	display:none;
	}
	
/*LP用商品定義リスト*/
.lp_list {
	border: 0;
	height: auto;
	width: 96%;
	margin: 0.5em auto;
	overflow: hidden;
	display: flex;
	clear: both;
}
.lp_list dt {
	margin: 0%;
	padding: 2% 0% 1% 2%;
	text-align: center;
	width: 35%;
	display: block;
}
.lp_list dt img {
	padding: 0%;
}
.lp_list dd {
	width:60%;
	vertical-align: top;
	border: 0px solid #999;
	display: block;
	padding: 2%;
	margin: 0px;
	text-align: left;
}
.lp_list dd h3 {
	padding-left: 10px;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	border: 2px dotted #999;
}
.lp_list dd .cart_box {
	padding: 8px 10px 5px 0px;
	text-align: right;
	border: 1px dotted #999;
	margin: 0.5em 10px 0.5em 0.5em;
	display: block;
}
.lp_list dd .cart_box input {
	font-size: medium;
	letter-spacing: 0.1em;
	margin-right: 10px;
}
.lp_list dd .cart_box select {
	font-size: medium;
}
	
	
/* LPの丸い買い物かごボタン */
#cart_circle {
	position: fixed;
	bottom:10%;
	right: 1%;
}
#cart_circle a {
	padding: 10px;

}
	
/* テキストLPの広め行間 */
.txt_lh_lp01{
	line-height: 150%;
	}
	
/* 広めだと大きく流れるので
寄せるテキストボックス */	
.txt_box001 {
	width: 80%;
	margin-right: auto;
	margin-left: auto;
	display: block;
}

.txt_margin01 {
	padding-bottom: 0.4em;
}


	
	
	
/*横並び用BOX*/
.flex_box{
	width: 100%;
	display: flex;
	padding-top: 2em;
	padding-bottom: 2em;
}
.flex_txt{
	/*background-color:#FC0;*/
	width: 52%;
	font-size: 20px;
	line-height: 160%;
	color: #333;
}	

.flex_txt p {
	padding-bottom:10px;
}
	
.flex_img{
	/*background-color:#3FF;*/	
	width: 48%;
}	

.padding_box{
	padding:1em 0;
	}


	

/*横並び用BOX(float)*/
.float_box{
	width: 100%;
	padding-top: 2em;
	padding-bottom: 2em;
	clear: both;
}
.float_l{
	float:left;


}	
.float_r{
	float:right;	
}
.float_txt {
	/*padding-bottom:10px;*/
	line-height: 130%;
	font-size: 22px;
}
	

}


@media screen and ( max-width:920px ) {
	/*max-width:1500px のをひとまとめに↓*/


	   /*　SP用　*/
	   
body{
	padding-bottom: 90px;	
	}	   
	
.sp_none { display: none !important;}



/* ページトップへ戻る */
#pagetop {
	display: none;
	position: fixed;
	bottom: 0;
	right: 0px;
}
#pagetop a {
	background-color: #0C6;
	color: #FFF;
	font-weight: bold;
	text-decoration: none;
	padding: 10px;
	border: 2px #FFFFFF solid;
	border-radius: 10px 10px 0 0;
}


/* グルーバルメニュー */
nav.globalMenuSp {
    position: fixed;
    z-index: 2;
    top: 0;
    left: 0;
    height: 100%;
    overflow: auto;
	background: rgba(220,220,220,0.8);
    color: #000;
    text-align: center;
    transform: translateX(-100%);
    transition: all 0.6s;
    width:100%;
    -webkit-overflow-scrolling: touch;
}
 
nav.globalMenuSp ul {
	background: rgba(230,230,230,0.5);
    margin: 0 auto;
    padding: 0;
    width: 100%;
}
 
nav.globalMenuSp ul li {
    font-size: 1.1em;
    list-style-type: none;
    padding: 0;
    width: 100%;
    border-bottom: 1px dotted #333;
}
.btm_line {
    font-size: 1.1em;
    list-style-type: none;
    padding: 0;
    width: 100%;
    border-bottom: 1px dotted #333;
}
 
/* 最後は点線のラインを描かない */
nav.globalMenuSp ul li:last-child {
    padding-bottom: 0;
    border-bottom: none;
}
 
nav.globalMenuSp ul li a {
    display: block;
    color: #000;
    padding: 1em 0;
}
 
/* このクラスを、jQueryで付与・削除する */
nav.globalMenuSp.active {
    transform: translateX(0%);
}
 
/* メニュー内ヘッダ */
nav.globalMenuSp .menuHeader {
    background: #ccc;
    padding: 1.5em 0;
}
 
/* メニューだけをスクロールさせる工夫 */
.overflowHidden {
    overflow: hidden;
}

.navToggle {
	display: block;
	position: fixed;    /* bodyに対しての絶対位置指定 */
	right: 8px;
	top: 8px;
	width: 42px;
	height: 51px;
	cursor: pointer;
	z-index: 3;
	background: #666;
	border: 1px solid #fff;
	text-align: center;
}
 
.navToggle span {
    display: block;
    position: absolute;    /* .navToggleに対して */
    width: 30px;
    border-bottom: solid 3px #eee;
    -webkit-transition: .35s ease-in-out;
    -moz-transition: .35s ease-in-out;
    transition: .35s ease-in-out;
    left: 6px;
}
 
.navToggle span:nth-child(1) {
    top: 9px;
}
 
.navToggle span:nth-child(2) {
    top: 18px;
}
 
.navToggle span:nth-child(3) {
    top: 27px;
}
 
.navToggle span:nth-child(4) {
    border: none;
    color: #eee;
    font-size: 9px;
    font-weight: bold;
    top: 34px;
}



/* 最初のspanをマイナス45度に */
.navToggle.active span:nth-child(1) {
    top: 18px;
    left: 6px;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
 
/* 2番目と3番目のspanを45度に */
.navToggle.active span:nth-child(2),
.navToggle.active span:nth-child(3) {
    top: 18px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    transform: rotate(45deg);
}
/*グローバルメニュ↑*/





	
		header #left,
	header #right {
		width: 45%;
		margin: 0;
	}
	header #left img,
	header #right img,
	#main img,
	#diagnosis img,
	.click01_bn a img {
		width: 100%;
		height: auto;
	}
	#diagnosis {
		width: 100%;
	}
	.swiper-container {
		width: 100%;
		height: auto;
	}
	.click01_bn {
		background-size: 100% auto !important;
		width: 100% !important;
		height: auto !important;
	}
	.shop_link p.shop_link_c {
		width: 95%;
		float: none;
		padding: 0;
		margin: auto;
	}
	/*max-width:1500px のをひとまとめに↑*/
	

	body {
		font-size: medium;
	}
	header {
		margin-top: 10px;
	}
	header p {
		padding: 0;
	}
	header #right {
		width: 100%;
		margin: 0;
	}
		header #left {
		width: 90%;
		margin: 0;
	}
	h1 {
	font-size: x-small;
	padding: 0px;
	}
	
	nav ul {
		width: 100%;
	}
	#container {
		display: block;
	}
	#side {
		display: none;
	}
	#main {
		min-width: 100%;
	}
	#diagnosis {
		font-size: large;
	}
	#diagnosis button {
		width: 50%;
		font-size: large;
	}
	#listbox .sm_img img {	/* 画像個別スマホ対応 */
		width: 100% !important;
		height: auto !important;
	}
	.click01_bn,
	.click02_bn {
		width: 100% !important;
		height: auto !important;
		background: none !important;
	}
	.click01_bn a:link,
	.click02_bn a:link {
		opacity:1 !important;
		transition: none !important;
	}
	.click01_bn a:hover,
	.click02_bn a:hover {
		opacity:1 !important;
		transition: none !important;
	}
	table {
		width: 95% !important;
		font-size: medium;
	}
	footer img {
		width: 100%;
		height: auto;
	}
	footer .foot_box {
		display: block;
		margin: 0;
		padding: 0;
	}
	footer .foot_box .foot_left,
	footer .foot_box .foot_right {
		width: 100%;
		border-radius: 0;
	}
	footer .foot_box .foot_left {
		margin: 0;
	}
	footer .foot_box .foot_right {
		margin: 0;
	}
	.img_left,
	.img_right {
		float: none !important;
	}
	
	
	
	
	/*商品定義リスト*/
.item_list {
	border: 1px solid #999;
	height: auto;
	width: 90%;
	margin: 0.5em auto;
	clear: both;
	display: block;
}
.item_list dt {
	margin: 0%;
	padding: 1%;
	text-align: center;
	width: 94%;
	display: block;
}
.item_list dt img {
	width: auto!important;
	height:300px !important;
	padding: 0%;
}
.item_list dd {
	width:98%;
	vertical-align: top;
	border: 0px solid #999;
	display: block;
	padding: 1%;
	margin: 0px;
	text-align: left;
}
.item_list dd h3 {
	padding-left: 10px;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	border: 2px dotted #999;
}
.item_list dd form {
	padding: 8px 10px 5px 0px;
	text-align: right;
	border: 1px dotted #999;
	margin: 0.5em 10px 0.5em 0.5em;
	display: block;
}
.item_list dd form input {
	font-size: medium;
	letter-spacing: 0.1em;
	margin-right: 10px;
}
.item_list dd form select {
	font-size: medium;
}

.left_txt01{
	width: 95%;
	text-align: left;
	margin-right: auto;
	margin-left: auto;
	}	
	
	
	
	
	
/*スマホ用文字サイズ、行間など　調整*/
.yellow_back_xxl {
	font-size: medium !important;
	font-weight: bold;
	color: #F00;
	background-color: #FF0;
	padding: 3px;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	line-height: 130%;
}	


.glay_box02 {
	padding: 0px;
	width: auto;
	margin: 0em;
	border: 1px solid #CCC;
	font-size: medium !important;
	font-weight: bold;
	color: #fff !important;
	background:#666;
	border-radius:10px;
}

/* パンくずリスト */
#pankuzu {
	line-height: 110%;
}



	
	
	/* 動画レシポンシブ */
video {
	width: 100%;
	height:auto;
}


/* YouTube動画レシポンシブ */
.movie-wrap {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}
.movie-wrap iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	margin:1em 0px;
}

	.mail_link {
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}
.mail_link a {
	font-size: 30px;
	line-height: 130%;
	font-weight: bolder;
	color: #FFF;
	background-color: #F03;
	text-align: center;
	padding: 5px;
	display: block;
	text-decoration: none;
	transition: all  0.3s ease;
}
.mail_link a:hover {
	font-size: 30px;
	line-height: 130%;
	font-weight: bolder;
	color: #F03;
	background-color: #FF0;
	text-align: center;
	padding: 5px;
	display: block;
	text-decoration: none;
	transition: all  0.3s ease;
}
	
	
	
	
	
	/* スマホ用　LPの丸い買い物かごボタン */
#cart_circle {
	width:20%;
	position: fixed;
	bottom:0%;
	left: 0%;
}
#cart_circle a {
	padding: 0;

}

/* スマホ用　文字サイズ */
.fnt24{
	
	font-size:16px !important;
	}



}

/* テーブルレスポンシブル */	
	
.responsive-table {
  width: 100%;
  overflow-x: auto;
}

.responsive-table table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}

.responsive-table th, .responsive-table td {
  padding: 12px;
  border: 1px solid #e0e0e0;
  text-align: left;
}

.responsive-table th {
  background-color: #f7f7f7;
  font-weight: bold;
  width: 20%;
}

@media screen and (max-width: 920px) {
  .responsive-table th, .responsive-table td {
    display: block;
    text-align: left;
    width: 100%;
    box-sizing: border-box;
  }

  .responsive-table th {
    font-size: 1.2em;
    background-color: #fff;
    font-weight: bold;
    padding-top: 20px;
  }
  
  .responsive-table td {
    padding-left: 50px;
    position: relative;
  }

  .responsive-table td:before {
    content: attr(data-label);
    position: absolute;
    left: 0;
    padding-left: 15px;
    font-weight: bold;
    width: 35%;
  }
}	
	








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



/* 買い物かごボタン */
input[type="submit"], input[type="button"] {
	-webkit-appearance: none;	/* iOSデフォデザイン強制解除 */
	text-align: center;
}
.item_list input[type="submit"] {
	background: #F00;
	color: #FFF;
	font-weight: bold;
	font-size: large;
	border: none;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	box-shadow: 0px 5px 0px 0px #990000;
	-moz-box-shadow: 0px 5px 0px 0px #990000;
	-webkit-box-shadow: 0px 5px 0px 0px #990000;
	padding: 0.5em;
	width: 80%;
	margin-top: 0.5em;
	margin-right: 0;
	margin-bottom: 0.5em;
	margin-left: 0;
}
.item_list input[type="submit"]:hover {
	box-shadow: none;
	transform: translate3d(0, 5px, 0);
}
	


/*CLASS商品テーブル*/
.shouhin-table {
	padding: 0px;
	height: auto;
	width: 70%;
	margin: 0em auto 1em auto;
	border-width: 1px 1px 0px 1px;
	border-style: solid;
	border-color: #999;
	border-collapse: collapse;
	border-spacing: 0;
	clear: both;
}
.shouhin-table th {
	padding: 5px 5px 10px 5px;
	border-width: 0px 1px 1px 1px;
	border-style: solid dotted solid solid;
	border-color: #999 #CCC #999 #999;
	text-align:right;
}
.shouhin-table td {
	padding: 5px 5px 10px 5px;
	border-width: 0px 0px 1px 0px;
	border-style: solid;
	border-color: #999;
	vertical-align: top;
	text-align:left;
}

/*CLASS商品テーブル 縦幅を薄めに*/
.shouhin-table02 {
	padding: 0px;
	height: auto;
	width: 70%;
	margin: 0em auto 1em auto;
	border-width: 1px 1px 0px 1px;
	border-style: solid;
	border-color: #999;
	border-collapse: collapse;
	border-spacing: 0;
	clear: both;
}
.shouhin-table02 th {
	padding: 2px 10px;
	border-width: 0px 1px 1px 1px;
	border-style: solid dotted solid solid;
	border-color: #999 #CCC #999 #999;
	text-align:right;
}
.shouhin-table02 td {
	padding: 2px 10px;
	border-width: 0px 0px 1px 0px;
	border-style: solid;
	border-color: #999;
	vertical-align: top;
	text-align:left;
}

/*　===商品テーブル内のフォーム枠共通設定＝＝＝　*/
.shouhin-table form {
	text-align: right;
	padding: 0.5em;
	margin-top: 0em;
	margin-right: 0em;
	margin-bottom: 1em;
	margin-left: 0em;
}
.shouhin-table form input {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 5px;
	padding-top: 3px;
	padding-right: 5px;
	padding-bottom: 3px;
	padding-left: 5px;
	letter-spacing: 0.2em;
}

.table_midashi01 {
	font-size: x-large;
	font-weight: bold;
	color: #900;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 1px;
	border-left-width: 0px;
	border-top-style: dotted;
	border-right-style: dotted;
	border-bottom-style: dotted;
	border-left-style: dotted;
	border-top-color: #999;
	border-right-color: #999;
	border-bottom-color: #999;
	border-left-color: #999;
	text-shadow: #999 2px 2px 3px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 5px;
	padding-left: 0px;
	line-height: 130%;
}






/* 装飾 */

/*触るとふわっと半透明*/
.alpha a:link {
	opacity:1;
	transition: 1s;
}
.alpha a:hover {
	opacity:0.5;
	transition: 1s;
}

/*（触ると緑の半透明+クリック）「クリッククリック！！」1200x520px*/
.click01_bn {
	padding: 0px;
	background-size:1200px auto;
	background-repeat: no-repeat;
	width: 1200px;
	height: 520px;
	background-image: url(../img/click1200.jpg);
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}
/*（触ると緑の半透明+クリック）「クリッククリック！！」580x200px*/
.click02_bn {
	padding: 0px;
	background-size:580px auto;
	background-repeat: no-repeat;
	width: 580px;
	height: 200px;
	background-image: url(../img/click580.jpg);
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}
/* 上記ロールオーバーの処理まとめ */
.click01_bn a:link,
.click02_bn a:link {
	opacity:1;
	transition: 1s;
}
.click01_bn a:hover,
.click02_bn a:hover {
	opacity:0;
	transition: 0.5s;
}

.center {
	text-align: center;
}

.img_left {
	float: left;
	margin-right: 0.5em;
	margin-bottom: 0.5em;
}
.img_right {
	float: right;
	margin-left: 0.5em;
	margin-bottom: 0.5em;
}
.clear {
	clear: both;
}

.cap {
	font-size: small;
}


/* 買い物かご */
dl.item_list {
	border: 1px #999999 solid;
	margin: 10px;
	padding: 10px;
}
dl.item_list dt {
	text-align: center;
}
dl.item_list dd h3 {
	background: #9FF;
	padding: 5px;
}
dl.item_list dd h4 {
	color: #F66;
}


.red_radius {
	background: #ffffff;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border: 3px solid #ff0000;
	margin: 0.5em 1em;
	padding: 5px 10px;
}
.red_radius p {
	margin-top: 10px;
}

.red-block {
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #FF3333;
	border-right-color: #CC0000;
	border-bottom-color: #990000;
	border-left-color: #FF3333;
	font-size: small;
	margin: 1em;
	padding-top: 5px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-left: 10px;
	height: auto;
	width: auto;
	clear: both;
}
.red-block02 {
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #FF3333;
	border-right-color: #CC0000;
	border-bottom-color: #990000;
	border-left-color: #FF3333;
	margin: 1em;
	padding-top: 5px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-left: 10px;
	height: auto;
	width: auto;
}

/* 注釈 */
.red_sfnt {
	color: #C00;
	font-size: small;
	margin: 0.5em;
	vertical-align: middle;
}

/* らく楽アシスト */
.red_box {
	background: #F00;
	color: #FFF;
	font-weight: bold;
	font-size: x-small;
	margin: 0.5em 1em 1em;
	padding: 0.2em;
	line-height: 200%;
	vertical-align: middle;
	border: 2px #CC0000 solid;
	border-radius: 5px;
}

/* 節電アシスト */
.green_box {
	background: #090;
	color: #FFF;
	font-weight: bold;
	font-size: x-small;
	margin: 0.5em 1em 1em;
	padding: 0.2em;
	line-height: 200%;
	vertical-align: middle;
	border: 2px #006600 solid;
	border-radius: 5px;
}

/*  */
.blue_box {
	background: #03C;
	color: #FFF;
	font-weight: bold;
	font-size: x-small;
	margin: 0.5em 1em 1em;
	padding: 0.2em;
	line-height: 200%;
	vertical-align: middle;
	border: 2px #000099 solid;
	border-radius: 5px;
}

.line_h01 {
	font-size: xx-large;
	color: #F30;
	border-bottom-width: 2px;
	border-bottom-style: dotted;
	border-bottom-color: #F90;
	font-weight: bold;
}
.line_h02 {
	font-size: large;
	color: #060;
	border-bottom-width: 2px;
	border-bottom-style: solid;
	border-bottom-color: #0C6;
	font-weight: bold;
	margin: 0.5em 1em;
	padding: 0;
}
.line_h03 {
	font-size: large;
	color: #C30;
	border-bottom-width: 2px;
	border-bottom-style: solid;
	border-bottom-color: #F90;
	font-weight: bold;
	margin: 0.5em 1em;
	padding: 0;
}

.blue_bar01 {
	background: #09F;
	font-size: xx-large;
	color: #FF0;
	text-align: center;
	margin: 1em 0;
}

.yellow_back01 {
	font-size: x-large;
	font-weight: bold;
	color: #F00;
	background-color: #FF0;
	padding: 5px;
	line-height: 130%;
}
.yellow_back_m {
	font-size: medium;
	font-weight: bold;
	color: #F00;
	background-color: #FF0;
	padding: 3px;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	line-height: 130%;
}
.yellow_back_xxl {
	font-size: xx-large;
	font-weight: bold;
	color: #F00;
	background-color: #FF0;
	padding: 3px;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	line-height: 130%;
}
.yellow_back02 {
	font-size: 50px;
	font-weight: bold;
	color: #F00;
	background-color: #FF0;
	padding: 3px;
	height: auto;
	line-height: 120%;
}

/*カラーなし文字サイズ*/
.fnt-lll {
	font-size: 48px;
	line-height: 135%;
	font-weight: bold;
	margin: 0.2em 0em;
}
.fnt-ll {
	font-size: xx-large;
	line-height: 135%;
	font-weight: bold;
	margin: 0.2em 0em;
}
.fnt-l {
	font-size: x-large;
	line-height: 135%;
	font-weight: bold;
	margin: 0.2em 0em;
}
.fnt-m {
	font-size: large;
	line-height: 135%;
	font-weight: bold;
	margin: 0.2em 0em;
}

/* グレー系 */
.glay_box02 {
	padding: 8px;
	width: auto;
	margin: 0em;
	border: 1px solid #CCC;
	font-size: x-large;
	font-weight: bold;
	color: #900;
}
.glay-lll {
	font-size: 48px;
	line-height: 135%;
	font-weight: bold;
	color: #666666;
	margin: 0.2em 0em;

}
.glay-ll {
	font-size: xx-large;
	line-height: 135%;
	font-weight: bold;
	color: #666666;
	margin: 0.2em 0em;

}
.glay-l {
	font-size: x-large;
	line-height: 135%;
	font-weight: bold;
	color: #666666;
	margin: 0.2em 0em;

}
.glay-m {
	font-size: large;
	line-height: 135%;
	font-weight: bold;
	color: #666666;
	margin: 0.2em 0em;

}

/* グリーン系 */
.green_box02 {
	padding: 8px;
	width: auto;
	margin: 0em 0em 5em 0em;
	border: 1px solid #CCC;
	font-size: x-large;
	font-weight: bold;
	color: #090;
}
.gree-lll {
	font-size: 48px;
	line-height: 135%;
	font-weight: bolder;
	color: #009933;
	margin: 0.2em 0em;

}
.gree-ll {
	font-size: xx-large;
	line-height: 135%;
	font-weight: bold;
	color: #009933;
	margin: 0.2em 0em;

}
.gree-l {
	font-size: x-large;
	line-height: 135%;
	font-weight: bold;
	color: #009933;
	margin: 0.2em 0em;

}
.gree-m {
	font-size: large;
	line-height: 135%;
	font-weight: bold;
	color: #009933;
	margin: 0.2em 0em;

}
.gree-b {
	line-height: 135%;
	font-weight: bold;
	color: #009933;
	margin: 0.2em 0em;

}
.gree-line01 {
	font-size: large;
	font-weight: bold;
	color: #060;
	padding: 5px;
	width: auto;
	margin: 0em 0em 5em 0em;
	border-width: 3px 0px;
	border-style: solid;
	borde-color: #3C0;
}

/* 水色系 */
.mizuiro-lll {
	font-size: 48px;
	line-height: 135%;
	font-weight: bold;
	color: #3399FF;
	margin: 0.2em 0em;

}
.mizuiro-ll {
	font-size: xx-large;
	line-height: 135%;
	font-weight: bold;
	color: #3399FF;
	margin: 0.2em 0em;

}

.mizuiro-l {
	font-size: x-large;
	line-height: 135%;
	font-weight: bold;
	color: #3399FF;
	margin: 0.2em 0em;

}
.mizuiro-m {
	font-size: large;
	line-height: 135%;
	font-weight: bold;
	color: #3399FF;
	margin: 0.2em 0em;

}

.red-lll {
	font-size: 48px;
	line-height: 135%;
	font-weight: bolder;
	color: #FF0000;
	margin: 0.2em 0em;

}

/* 赤系 */
.red-ll {
	font-size: xx-large;
	line-height: 135%;
	font-weight: bolder;
	color: #FF0000;
	margin: 0.2em 0em;

}
.red-l {
	font-size: x-large;
	line-height: 135%;
	font-weight: bold;
	color: #FF0000;
	margin: 0.2em 0em;

}
.red-m {
	font-size: large;
	line-height: 135%;
	font-weight: bold;
	color: #FF0000;
	margin: 0.2em 0em;

}
.red_back {
	font-size: medium;
	font-weight: bold;
	color: #FFF;
	background-color: #F00;
	margin: 0em 0em 5em 0em;
	padding: 5px 10px;	border-radius:5px;
}


/* 青系 */
.blue-lll {
	font-size: 48px;
	line-height: 135%;
	font-weight: bold;
	color: #0033FF;
	margin: 0.2em 0em;

}
.blue-ll {
	font-size: xx-large;
	line-height: 135%;
	font-weight: bold;
	color: #0033FF;
	margin: 0.2em 0em;

}
.blue-l {
	font-size: x-large;
	line-height: 135%;
	font-weight: bold;
	color: #0033FF;
	margin: 0.2em 0em;

.blue-m {
	font-size: large;
	line-height: 135%;
	font-weight: bold;
	color: #0033FF;
	margin: 0.2em 0em;

}
.blue_box02 {
	padding: 8px;
	width: auto;
	margin-top: 0em;
	margin-right: 0em;
	margin-bottom: 0.5em;
	margin-left: 0em;
	border: 1px solid #CCC;
	font-size: x-large;
	font-weight: bold;
	color: #00F;
}
.blue-line01 {
	font-size: large;
	font-weight: bold;
	color: #006;
	padding: 5px;
	width: auto;
	margin: 0em 0em 5em 0em;
	border-width: 3px 0px;
	border-style: solid;
	border-color: #03C;
}



.price_box {
	border-radius: 20px;
	font-size: xx-large;
	text-align: center;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	display: block;
	border: 1px solid #999;
	background: linear-gradient(#ffffff,#cccccc);
	line-height: 130%;
	padding-top: 5px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-left: 10px;
}

.dod_line01 {
	font-size: x-large;
	line-height: 110%;
	font-weight: bold;
	color: #300;
	margin-bottom: 1em;
	padding-bottom: 5px;
	border-bottom-width: 2px;
	border-bottom-style: dotted;
	border-top-color: #933;
	border-right-color: #933;
	border-bottom-color: #933;
	border-left-color: #933;
	clear: both;
}

.tel01 {
	font-size: 90px;
	color: #060;
	text-align: center;
	font-weight: bolder;
	line-height: 110%;
	padding: 0px;
	background-color: #FF0;
	margin-top: 0.2em;
	margin-right: 0em;
	margin-bottom: 0.2em;
	margin-left: 0em;
}



/* 会社概要ページ用送料表テーブル */
table#soryo-table {
	width: 95%;
	margin: 0.5em auto;
	border-spacing: 0;
	border-collapse:collapse;
	border:#CCCCCC solid 1px;
}
#soryo-table th {
	background-color:#CFC;
	border-spacing: 0;
	border-collapse:collapse;
	border:#CCCCCC solid 1px;
}
#soryo-table td {
	border-spacing: 0;
	border-collapse: collapse;
	border: #CCCCCC solid 1px;
	padding: 5px;
	text-align: center;
	font-size: medium;
	border-radius: 5px;
}


/* シンプルテーブル */
table.simple, .simple th, .simple td {
	border-spacing: 0;
	border-collapse: collapse;
	border: 1px solid #CCC;
}

table.simple {
	width: 95%;
	margin: 1em auto;
}

.simple th {
	background-color: #CFF;
}
.simple td {
	padding: 0.5em;
}
table.simple02 {
	width: 95%;
	margin: 1em auto;
}
table.simple02, .simple02 th, .simple02 td {
	border-spacing: 0;
	border-collapse: collapse;
	border: 1px solid #CCC;
}

.yell_back {
	font-size: medium;
	font-weight: bold;
	color: #F00;
	background-color: #FF0;
	padding: 3px;
	margin-top: 0.3em;
	margin-bottom: 0.3em;
}




    /*
@media screen and (max-width:760px) { 
　画面サイズが760pxからはここを読み込む　
	



}
*/