/* --------------------------------------------------- header menu */
.menu              {position:relative; width:100%; max-width:1200px; height:70px; margin:0 auto; margin-top:10px;}
.menu > li         {float:left; text-align:center; width:10%; height:20px; padding-top:50px; line-height:12px; font-size:12px;}
.menu > li a       {display:block; color:#000000;}
.menu > li a:hover {text-decoration: none;}

.menu > li.menu_a{background-image:url(../img/header/menu_a.jpg);}/* セ・熙ヌチェ、ヨ */
.menu > li.menu_a:hover{background-image:url(../img/header/menu_a_h.jpg);}
.menu > li.menu_b{background-image:url(../img/header/menu_b.jpg);}/* ・モ・ヒ。シ・・*/
.menu > li.menu_b:hover{background-image:url(../img/header/menu_b_h.jpg);}
.menu > li.menu_c{background-image:url(../img/header/menu_c.jpg);}/* ・ォ。シ・ニ・・シ・・*/
.menu > li.menu_c:hover{background-image:url(../img/header/menu_c_h.jpg);}
.menu > li.menu_d{background-image:url(../img/header/menu_d.jpg);}/* エヨサナタレ、・ン。シ・・*/
.menu > li.menu_d:hover{background-image:url(../img/header/menu_d_h.jpg);}
.menu > li.menu_e{background-image:url(../img/header/menu_e.jpg);_h}/* ・ヘ・テ・ネ */
.menu > li.menu_e:hover{background-image:url(../img/header/menu_e_h.jpg);}
.menu > li.menu_f{background-image:url(../img/header/menu_f.jpg);}/* ・ム・、・ラ */
.menu > li.menu_f:hover{background-image:url(../img/header/menu_f_h.jpg);}
.menu > li.menu_g{background-image:url(../img/header/menu_g.jpg);}/* ノツア。サワタ゜ */
.menu > li.menu_g:hover{background-image:url(../img/header/menu_g_h.jpg);}
.menu > li.menu_h{background-image:url(../img/header/menu_h.jpg);}/* ・、・ニ・・「、ス、ホツセ */
.menu > li.menu_h:hover{background-image:url(../img/header/menu_h_h.jpg);}
.menu > li.menu_i{background-image:url(../img/header/menu_i.jpg);}/* ニテスク */
.menu > li.menu_i:hover{background-image:url(../img/header/menu_i_h.jpg);}
.menu > li.menu_j{background-image:url(../img/header/menu_j.jpg);}/* 、エヘム・ャ・、・ノ */
.menu > li.menu_j:hover{background-image:url(../img/header/menu_j_h.jpg);}

.menu_a,.menu_a:hover,
.menu_b,.menu_b:hover,
.menu_c,.menu_c:hover,
.menu_d,.menu_d:hover,
.menu_e,.menu_e:hover,
.menu_f,.menu_f:hover,
.menu_g,.menu_g:hover,
.menu_h,.menu_h:hover,
.menu_i,.menu_i:hover,
.menu_j,.menu_j:hover
{background-repeat:no-repeat; background-position: center center;}

.menu_a,.menu_a:focus,
.menu_b,.menu_b:focus,
.menu_c,.menu_c:focus,
.menu_d,.menu_d:focus,
.menu_e,.menu_e:focus,
.menu_f,.menu_f:focus,
.menu_g,.menu_g:focus,
.menu_h,.menu_h:focus,
.menu_i,.menu_i:focus,
.menu_j,.menu_j:focus
{outline:none; cursor: default;}

.menu:before,
.menu:after {content: " ";display: table;}
.menu:after {clear: both;}
.menu {*zoom: 1;}

/* --------------------------------------------------- ニ筵・ケ・ネ */
ul.menu_second    {visibility: hidden;opacity: 0;z-index: 1;}
.menu_second li a:hover,.menu_third li a:hover {color: #c82200; text-decoration: underline;}

/* --------------------------------------------------- mega menu */
li.menu_mega ul.menu_second {position:absolute; top:60px; left:0; box-sizing:border-box; width:100%; padding:15px 2%; background:#ffffff; border:1px solid #ffce2b; transition:all .2s ease;}
li.menu_mega:hover ul.menu_second {top:70px;visibility:visible; opacity:1;}
li.menu_mega ul.menu_second > li {float:left; border:none; text-align:left; padding:10px; font-size:120%; line-height:120%;}
li.menu_mega ul.menu_second > li span {font-weight:bold; font-size:120%;}
li.menu_mega ul.menu_second ul.menu_third           {padding-top:10px; width:140px;}
li.menu_mega ul.menu_second ul.menu_third li        {padding:0 0 10px 0;}
li.menu_mega ul.menu_second ul.menu_third li:before {font-family:'FontAwesome'; content:'\f0da'; color:#ec8f00; margin:0 3px 0 0; float: left;}

li.menu_mega ul.menu_second > li.image{margin:0; padding:10px; float:left; width:100%;}

/* ===============================
・ノ・・シ・皈ヒ・蝪シ
================================= */
#mobile {display: none;}

@media screen and (max-width: 768px) {
/* #mobile  {display:block; color:#ffffff; background-color:#e2e2e2; margin-top: 0px;} */
#mobile  {display:block; position:relative; float:left; width:7%; background:#ec8f00; padding: 5px 0;}
#mobile a{display:block; position:relative; padding:8px 0 6px; text-align:center; text-decoration:none;}
#mobile:before{display:block; content:""; position: absolute; top:50%; left:10px; width:20px; height:20px; margin-top:-10px; background:#fff;}
#mobile a:before, #mobile a:after{display:block; content: ""; position:absolute; top:50%; left:10px; width:20px; height:4px; background:#ec8f00;}
#mobile a:before{margin-top:-6px;}
#mobile a:after{margin-top:2px;}
#mobile i{padding-left:50px; font-style:normal; color:#ec8f00;}
#head-nav{display:none;}
#head-nav img{width:40%;}
}

@media screen and (max-width: 481px) {
#mobile  {display:block; position:relative; float:left; width:13%; background:#ec8f00; padding: 5px 0;}
#mobile a{display:block; position:relative; padding:8px 0 6px; text-align:center; text-decoration:none;}
#mobile:before{display:block; content:""; position: absolute; top:50%; left:10px; width:20px; height:20px; margin-top:-10px; background:#fff;}
#mobile a:before, #mobile a:after{display:block; content: ""; position:absolute; top:50%; left:10px; width:20px; height:4px; background:#ec8f00;}
#mobile a:before{margin-top:-6px;}
#mobile a:after{margin-top:2px;}
#mobile i{padding-left:50px; font-style:normal; color:#ec8f00;}
}

/* --------------------------------------------------- cart */
.cBox      {width:99%; padding:1%;}
.cBox .img {width:53.5%; float:left; margin-right:3.44%;}
.cBox .txt {width:43%; float:right;}
.cBox .txt p.tit {padding:2%; background:#ec8f00; color:#fff; font-weight:bold;}
.cBox .txt ul  {margin:0; padding:0; list-style:none; overflow: hidden;}
.cBox .txt li  {width:23.5%; float:left; padding:2.332%; margin-bottom:3.79%; margin-left:3.79%; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border: solid 1px #ccc; text-align:center; font-size:75%;}
.cBox .cartpcs {border:0;padding:10px; font-size:1.3em; border:solid 1px #ccc; margin:0 0 20px; width:50px; -webkit-border-radius:3px; -moz-border-radius: 3px; border-radius: 3px;}

@media screen and (max-width: 481px) {
.cBox .img {width:100%; margin:0; padding:0;}
.cBox .txt {width:100%; margin:0; padding:0;}
}

/* ---------------------------------------------- itemswap */
div.swap {overflow:hidden; width:100%;}
div.swap p {padding:0; margin:0 0 2.238% 0; border:solid 3px #ddd; display:block;}
div.swap ul {display:inline; margin:0; padding:0; list-style:none;}
div.swap li a {display:block; border:solid 3px #ddd;}
div.swap li a.selected {border:solid 3px #bd3415;}
div.swap li {width:18%; float:left; margin-right:1.9%; margin-bottom:3.33%; background:#fff; text-align:center;}

/* --------------------------------------------------- btn */
.btn__box {width:250px;height:50px; line-height:50px; margin:100px auto 0; font-size:13px;}
.btn__box a {position: relative;display: block;color: #666;background: #fff;}
.btn__box a:before {content: '';position: absolute;top: -5px;left: -5px;box-sizing: border-box;width: 250px;height: 50px;border: 1px solid #666;-webkit-transition: all .5s ease;transition: all .5s ease;}
.btn__box a:hover:before {-webkit-transform: translate(10px, 10px);-ms-transform: translate(10px, 10px);transform: translate(10px, 10px);}

/* =======================================
    ・オ・、・ノ・ハ・モ
======================================= */
.item_list_link   {margin:0 auto; padding: 5px 0;}
.item_list_link a {display:block; border-radius:5px; border:1px #cc0000 solid; font-size:12px; width:180px; height:50px; line-height:50px; text-align: center; background-color:#fff; margin:0 auto;}
.item_list_link a:active,
.item_list_link a:visited,
.item_list_link a:link  {color:#cc0000; text-decoration:none;}
.item_list_link a:hover {background-color:#cc0000; color:#fff; text-decoration: none;}

/* =======================================
    ・・シ・ラ・「・ヒ・癸シ・キ・逾・======================================= */
/* イ」 */
#loopslider       {margin:10px auto 5px; width:100%; height:100px; text-align:left; position:relative; overflow:hidden;}
#loopslider ul    {height:100px; float:left; display:inline; overflow:hidden;}
#loopslider ul li {width:100px; height:100px; float:left; display:inline; overflow:hidden;}
#loopslider ul li a       {position:relative; overflow:hidden; float:left;}
#loopslider ul li a img   {vertical-align: bottom;}
#loopslider ul li a:after {position:absolute; z-index:9999; content:""; top:50%; left:50%; width:0%; height:0%; transition:0.2s; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
#loopslider ul li a:hover:after {top:0%; left:0%; width:100%; height:100%; border:5px solid rgba(255,0,0,0.5);}

/* テクセキ */
#loopslider_h       {auto 5px; width:100%; height:135px; text-align:left; position:relative; overflow:hidden;}
#loopslider_h ul    {height:135px; float:left; display:inline; overflow:hidden;}
#loopslider_h ul li {width:300px; height:135px; margin-right:20px; float:left; display:inline; overflow:hidden;}
#loopslider_h ul li img   {vertical-align: bottom; margin-right:5px; float:left; width:135px;}
#loopslider_h ul li span.date  {color: #727272; font-size:85%;}
#loopslider_h ul li span.kakaku  {color: #dc123c; font-size:85%;}

@media only screen and (max-width:481px){
#loopslider       {margin:10px auto 5px; width:100%; height:50px; text-align:left; position:relative; overflow:hidden;}
#loopslider ul    {height:50px; float:left; display:inline; overflow:hidden;}
#loopslider ul li {width:50px; height:50px; float:left; display:inline; overflow:hidden;}
	}
/* =======================================
    ClearFixElements
======================================= */
#loopslider ul:after {content:"."; height:0; clear:both; display:block; visibility:hidden;}
#loopslider ul       {display:inline-block; overflow:hidden;}


/* =======================================
    ー・ム・ニ。シ・ヨ・・======================================= */
.table_all         {width:100%; border-collapse:collapse;}
.table_all td,
.table_all th      {padding:5px; border:1px solid #ccc;}
.table_all th      {font-weight:bold; background:#e6e6e6; white-space:nowrap;}
.table_all td      {background:#fff;}
.table_all td ul   {padding:0 0 0 20px;}
.table_all thead th{background:#e6e6e6;}

@media only screen and (max-width:769px){
.table_all         {display:block;}
.table_all thead   {display:none;}
.table_all tbody   {display:block;}
.table_all tbody tr{display:block; margin-bottom:1.5em;}
.table_all tbody th,
.table_all tbody td{display:list-item; border:none;}
.table_all tbody th{list-style-type:none; color:#000; background:#e6e6e6;}
.table_all tbody td{list-style-type:none; margin:0; background:#fff;}
}

/* =======================================
    ・ネ・テ・ラ ・・シ・ラ・「・ヒ・癸シ・キ・逾・======================================= */
.wideslider       {width: 100%; text-align: left; position: relative; overflow: hidden;}
.wideslider ul,
.wideslider ul li {float: left; display: inline; overflow: hidden;}
.wideslider ul li img {width:100%; display: none;}
.wideslider_base  {top: 0; position: absolute;}
.wideslider_wrap  {top: 0; position: absolute; overflow: hidden;}
.slider_prev,
.slider_next      {top: 0; overflow: hidden; position: absolute; z-index: 100; cursor: pointer;}
.slider_prev      {background: #fff url(../img/top/prev.jpg) no-repeat right center;}
.slider_next      {background: #fff url(../img/top/next.jpg) no-repeat left center;}
.pagination       {bottom: 20px;left: 0;width: 100%;height: 60px;text-align: center;position: absolute;z-index: 200;}/* bottom、ヌトエタ・*/
.pagination a     {margin: 0 5px;width: 180px;height: 60px;display: inline-block;overflow: hidden;}
/*-- .pagination a.pn1 {background: transparent url(../img/top/top-sale2017aw-180.jpg) no-repeat left top;} --*/
.pagination a.pn1 {background: transparent url(../img/top/top-01-180.jpg) no-repeat left top;}
.pagination a.pn2 {background: transparent url(../img/top/top-02-180.jpg) no-repeat left top;}
.pagination a.pn3 {background: transparent url(../img/top/top-03-180.jpg) no-repeat left top;}
.pagination a.pn4 {background: transparent url(../img/top/top-04-180.jpg) no-repeat left top;}
.pagination a.pn5 {background: transparent url(../img/top/top-05-180.jpg) no-repeat left top;}
.pagination a.pn6 {background: transparent url(../img/top/top-06-180.jpg) no-repeat left top;}
.pagination a.active {filter:alpha(opacity=100)!important;-moz-opacity: 1!important;opacity: 1!important; box-shadow: 0 0 0 3px #ffd966 inset;}
@media only screen and (max-width:769px){
.pagination {top: 83%; left: 0;width: 100%; height: 60px; text-align: center;position: absolute;z-index: 200;}/* bottom、ヌトエタ・*/
.pagination a {margin: 0 5px; width: 10px; height: 10px;display: inline-block;overflow: hidden;}
.pagination a.pn1,
.pagination a.pn2,
.pagination a.pn3,
.pagination a.pn4,
.pagination a.pn5,
.pagination a.pn6 {background: transparent url(../img/top/top-w10h10.jpg) no-repeat left top;}
}
/* =======================================
   ・ネ・テ・ラ・「・ヒ・癸シ・キ・逾・ClearFixElements
======================================= */
.wideslider ul:after {
    content: ".";
    height: 0;
    clear: both;
    display: block;
    visibility: hidden;
}
 
.wideslider ul {
    display: inline-block;
    overflow: hidden;
}

/* =======================================
   イシサーウム「ヲ
======================================= */
.triangle-top {
  width: 0;
  height: 0;
  margin: 0 auto;
  background: transparent;
  border-top: 20px solid #EE7C31;
  border-left: 20px solid transparent;
  border-bottom: 20px solid transparent;
  border-right: 20px solid transparent;   
  }

/* =======================================
   イ霖・。・ュ・罕ラ・キ・逾・======================================= */
.details    {overflow: hidden; *zoom: 1; width: 101.19%;}
.details ul {list-style: none; top: 0; margin:  0 0 -1.17% 0; padding: 0; text-align: left;}
.details ul li     {width: 24.27%; margin: 0 0 1.17% 0; height: 235px;}
@media screen and (max-width: 481px) {.details ul li {width: 46%; margin: 0 0 1.17% 0; height:auto;}}
.details ul li span{padding: 10px 0 0 0; display: block;}
.details ul li dl  {width: 100%; height: 207px;}
.details ul li     {display: inline-block; position: relative; overflow: hidden; margin: 0 0 1.17% 0; letter-spacing: 0;}
.details ul dl     {box-sizing: border-box; -moz-box-sizing: border-box; position: absolute; top: 0; margin: 0; padding: 15px; color: #fff; background: rgba(205,92,92,.9);}
.details ul dl dt  {margin-bottom: 0.3em;}
.details ul dl dd  {margin: 0; font-size: 90%; line-height: 1.6; text-align: justify; word-break: break-all;}
@media screen and (max-width: 481px) {.details ul dl dd {font-size:80%;}}
.details ul dl dd:last-of-type {margin-top: 10px; text-align: center;}
.details ul a                  {padding: 0.5em 0.5em; background-color: #fff;}
 
/* type1 */
.details .type1 dl {
  opacity: 0;
  -webkit-transform: translateY(100%);
  transform: translateY(100%);
  -webkit-transition: opacity 0.6s, -webkit-transform 0.6s;
  transition: opacity 0.6s, transform 0.6s;
}
 
.details .type1:hover dl {
  opacity: 1;
  -webkit-transform: translateY(0);
  transform: translateY(0);
}

/* =======================================
   イ。、キ・ワ・ソ・・======================================= */
/* btn01 */
.btn01 a {font-size: 120%;display: block;cursor: pointer;width: 50%;margin: 0 auto;padding: 20px;color: #845800;text-align: center;text-decoration: none;background-color: #ffd966;border-radius: 5px;box-shadow: 0px 6px 0px #e0a100, 0 12px 0 rgba(0,0,0,0.2); -webkit-transition: color 0.3s, background-color 0.3s, box-shadow 0.3s, -webkit-transform 0.3s; transition: color 0.3s, background-color 0.3s, box-shadow 0.3s, transform 0.3s;}
.btn01 a:hover {background-color: #ffda7d;box-shadow: 0 3px 0 #e0a100, 0 6px 0px rgba(0,0,0,0.2); -webkit-transform: translateY(3px);transform: translateY(3px);}
.btn01 a:active {color: #ddd;background-color: #f10000;box-shadow: 0 0 0 #900000, 0 0 0px rgba(0,0,0,0.2); -webkit-transform: translateY(6px); transform: translateY(6px); transition-duration: 0.1s;}
@media screen and (max-width: 481px) {.btn01 a {width:270px; margin: 0 5px 0 0;font-size: 100%; padding: 10px 20px;}}

/* btn02 、筅テ、ネクォ、・*/
.btn02 a {font-size: 100%; display:block; border-bottom:1px #ccc dotted; width:99.047%; padding:5px 8px 5px 0; text-align: right; background-color:#fff; margin:0 auto;}
.btn02 a:active,
.btn02 a:visited,
.btn02 a:link  {text-decoration:none;}
.btn02 a:hover {background-color:#ffd966; color:#fff; text-decoration: none; border-bottom:1px #ffd700 dotted;}
@media screen and (max-width: 481px) {.btn02 a {width:96%; padding:5px 5px 5px 0;border-bottom:0px;}}

/* btn03 */
.btn03 ul      {width:100%;}
.btn03 ul li a {font-size: 120%; float: left; display: block;cursor: pointer;width: 31.333%; margin: 0 1%;padding: 20px 0;color: #000;text-align: center;text-decoration: none;background-color: #ffffff; box-shadow: 0 0 0 3px #dfdfdf inset; -webkit-transition: color 0.3s, background-color 0.3s, box-shadow 0.3s, -webkit-transform 0.3s; transition: color 0.3s, background-color 0.3s, box-shadow 0.3s, transform 0.3s;}
.btn03 ul li  a:hover  {background-color: #ffffff; box-shadow: 0 0 0 3px #ffd700 inset; -webkit-transform: translateY(3px); transform: translateY(3px);}
.btn03 ul li  a:active {background-color: #ffffff; -webkit-transform: translateY(6px); transform: translateY(6px); transition-duration: 0.1s;}
@media screen and (max-width: 481px) {.btn03 ul li a {width:96%; margin: 0 5px 10px 0;font-size: 100%; padding: 10px 0;}}

/* ・ユ・ュ・タ・キ */
.arrow_box {position: relative;background: #ffffff;border: 3px solid #e5e5e5; padding: 10px;text-align: center;}
.arrow_box:after, .arrow_box:before {top: 100%;left: 50%;border: solid transparent;content: " ";height: 0;width: 0;position: absolute;pointer-events: none;}
.arrow_box:after {border-color: rgba(255, 255, 255, 0);border-top-color: #ffffff;border-width: 15px;margin-left: -15px;}
.arrow_box:before {border-color: rgba(217, 217, 217, 0);border-top-color: #e5e5e5;border-width: 19px;margin-left: -19px;}
@media only screen and (max-width:769px){.arrow_box {padding: 0px;font-size: 80%;border: none;}
.arrow_box:after, .arrow_box:before {border: none;}
.arrow_box:after {border: none;}
.arrow_box:before {border: none;}}

/* General button style (reset) */
.btn {
	width: 100%;
	border: none;
	font-family: inherit;
	font-size: inherit;
	color: inherit;
	background: none;
	cursor: pointer;
	padding: 10px;
	display: inline-block;
	margin: 10px 0px;
	text-transform: uppercase;
	letter-spacing: 1px;
	outline: none;
	position: relative;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.btn:after {
	content: '';
	position: absolute;
	z-index: -1;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

/* Pseudo elements for icons */
.btn:before,
.icon-heart:after,
.icon-star:after,
.icon-plus:after,
.icon-file:before {
	font-family: 'Font Awesome 5 Free';
	font-style: normal;
	font-weight: 900;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	position: relative;
	-webkit-font-smoothing: antialiased;
}

/* Button 1 */
.btn-1 {border: 1px solid #000;color: #000; font-size:110%;}
.btn-1 a {color: #000; text-decoration: none;}
.btn-1 a:hover {color: #fff;}

/* Button 1b */
.btn-1b:after {width: 100%;height: 0;top: 0;left: 0;background: #000; color:#fff;}
.btn-1b:hover,.btn-1b:active {color: #fff;}
.btn-1b:hover:after,.btn-1b:active:after {height: 100%; color:#fff;}

/* Button 2 */
.btn-2 {border: 1px solid #ffb039;color: #ff9a00; font-size:110%;}
.btn-2 a {color: #ffb039; text-decoration: none;}
.btn-2 a:hover {color: #fff;}

/* Button 2b */
.btn-2b:after {width: 100%;height: 0;top: 0;left: 0;background: #ffb039; color:#fff;}
.btn-2b:hover,.btn-1b:active {color: #fff;}
.btn-2b:hover:after,.btn-1b:active:after {height: 100%; color:#fff;}


/* =======================================
   、隍ッ、「、・チフ・======================================= */
/* --- ・・ケ・ネ・ィ・・「 --- */
ol.qa {width: 100%;/* ・・ケ・ネ・ィ・・「、ホノ*/ margin: 0;padding: 0; list-style-type: none;}

/* --- ・・ケ・ネケ猯ワ、ホニ簣ニ --- */
ol.qa dl {margin: 0 0.5% 0 0.5%;}
@media screen and (max-width: 481px) {ol.qa dl {margin: 0 2% 0 0.5%;}}

/* --- Question・ィ・・「 --- */
ol.qa dt {
margin: 0;
padding: 23px 6px 20px 70px; /* Question・ィ・・「、ホ・ム・ヌ・」・ー。ハセ螻ヲイシコク。ヒ */
background:#f9f9f9 url(../img/item/icon_q.png) no-repeat 10px 6px; /* Question・ィ・・「、ホヌリキハ */
border: 1px #c0c0c0 solid; /* Question・ィ・・「、ホカュウヲタ*/
font-weight: bold;
line-height: 120%;
font-size: 110%;
}

/* --- Answer・ィ・・「 --- */
ol.qa dd {
margin: 10px 0 20px 0;
padding: 20px 6px 20px 70px; /* Answer・ィ・・「、ホ・ム・ヌ・」・ー。ハセ螻ヲイシコク。ヒ */
background: #ffffff url(../img/item/icon_a.png) no-repeat 10px 6px; /* Answer・ィ・・「、ホヌリキハ */
line-height: 150%;
}
