@charset "euc-jp";

/*--------- CSS MENU ---------*/
/*------------------------------
/*  01.  ITME - DETAIL
/*  02.  ITEM - IMAGE
/*  03.  ITEM - INFO
/*  04.  ITME - CART BUTTON
/*  05.  ITEM - SNS
/*  06.  ITEM - LEGAL
/*  07.  ITEM - EXPLAIN
/*  08.  ITEM - ITEM LIST
--------------------------------
------------------------------*/

/*  01.  ITME - DETAIL
------------------------------*/
/*  PC  */
@media screen and (min-width: 980px) {
/*  ITEM  *//*  DETAIL  */
#item_detail_wrap {width: 980px; margin: auto;}
#item_detail {float: left; width: 100%; height: auto; padding-top: 50px; padding-bottom: 50px;}
}

/*  SP  */
@media screen and (max-width: 979px) {
#item_detail_wrap {float: left; width: 100%; height: auto;}
#item_detail {float: left; width: 100%; height: auto;}
}

/*  02.  ITEM - IMAGE
------------------------------*/
/*  PC  */
@media screen and (min-width: 980px) {
/*  ITME  *//*  IMAGE  */
#item_image_wrap {float: left; width: 50%; height: auto;}
#item_image {float: left; width: 100%; height: auto;}

.item_image_slider {position: relative; width: 100%; height: auto; margin: 0; padding: 0; text-align: center;}
.item_image_slider .slides {zoom: 1;}
.item_image_slider .slides li {display: none;}
.item_image_slider .slides img {display: block; width: 100%; height: auto; vertical-align: top;}
.item_image_slider .slides:after {clear: both; display: block; height: 0; line-height: 0; visibility: hidden;}
.item_image_slider .slides li:first-child {display: block;}
.flex-direction-nav a,
.flex-direction-nav .flex-prev,
.flex-direction-nav .flex-next {display: none;}
.flex-nav-prev,
.flex-nav-next {list-style: none;}
.flex-control-thumbs {list-style: none; margin: 0; padding: 5px; box-sizing: border-box;}
.flex-control-thumbs li {display: block; float: left; width: calc(25% - 14px); height: auto; margin: 5px; border: 2px solid #FFF;}
.flex-control-thumbs img {display: block; width: 100%; height: auto; vertical-align: top; border: 2px solid #FFF; box-sizing: border-box; cursor: pointer;}
.flex-control-thumbs img:hover,
.flex-control-thumbs .flex-active {border: 2px solid #000DFF;}
}

/*  SP  */
@media screen and (max-width: 979px) {
/*  ITME  *//*  IMAGE  */
#item_image_wrap {float: left; width: 100%; height: auto;}
#item_image {float: left; width: 100%; height: auto;}

.item_image_slider {position: relative; width: 100%; height: auto; margin: 0; padding: 0; text-align: center;}
.item_image_slider .slides {zoom: 1;}
.item_image_slider .slides li {display: none;}
.item_image_slider .slides img {display: block; width: 100%; height: auto; vertical-align: top;}
.item_image_slider .slides:after {clear: both; display: block; height: 0; line-height: 0; visibility: hidden;}
.item_image_slider .slides li:first-child {display: block;}
.flex-direction-nav a,
.flex-direction-nav .flex-prev,
.flex-direction-nav .flex-next {display: none;}
.flex-nav-prev,
.flex-nav-next {list-style: none;}
.flex-control-thumbs {list-style: none; margin: 0; padding: 5px; box-sizing: border-box;}
.flex-control-thumbs li {display: block; float: left; width: calc(25% - 10px); height: auto; margin: 5px; border: 2px solid #FFF;}
.flex-control-thumbs img {display: block; width: 100%; height: auto; vertical-align: top; border: 2px solid #FFF; box-sizing: border-box; cursor: pointer;}
.flex-control-thumbs img:hover,
.flex-control-thumbs .flex-active {border: 2px solid #000DFF;}
}

/*  03.  ITEM - INFO
------------------------------*/
/*  pc  */
@media screen and (min-width: 980px) {
/*  ITEM  *//*  INFO  */
#item_info_wrap {float: right; width: 50%; height: auto;}
#item_info {float: left; width: 100%; height: auto; padding-left: 40px; padding-right: 40px; box-sizing: border-box;}

/*  ITEM  *//*  INFO  *//*  NAME  */
#item_name {float: left; width: 100%; height: auto;}
#item_name h2 {line-height: 30px; font-size: 20px; font-weight: bold;}
#item_name p {line-height: 20px; font-size: 12px; font-weight: normal;}
#item_name dl {float: left; width: 100%; height: auto;}
#item_name dl dt {float: left; width: auto; height: auto; line-height: 20px; font-size: 12px; font-weight: normal;}
#item_name dl dd {float: left; width: auto; height: auto; line-height: 20px; margin-left: 20px; font-size: 12px; font-weight: bold; }
#item_name dl dd a {color: #000;}
#item_name dl dd a:hover {color: #AAA;}

/*  ITEM  *//*  INFO  *//*  PRICE  */
#item_price {float: left; width: 100%; height: auto; margin-top: 20px; margin-bottom: 20px;}
#item_price p.price {float: left; line-height: 20px; font-size: 16px; font-weight: bold; color: #000;}
#item_price p.sale {float: left; line-height: 20px; font-size: 16px; font-weight: bold; color:  #FF0004;}
#item_price p.sale span {padding: 5px; margin-right: 10px; font-size: 10px; font-weight: bold; color: #FFF; background-color: #FF0004;}
 
/*  ITEM  *//*  INFO  *//*  SPEC  */
#item_detail_spec {float: left; width: 100%; height: auto; margin-top: 20px;}
#item_detail_spec dl {float: left; width: 100%; height: auto; padding-top: 10px; padding-bottom: 10px;}
#item_detail_spec dl dt {float: left; width: 100%; height: 30px; line-height: 30px; font-size: 14px; font-weight: normal; color: #000;}
#item_detail_spec dl dd {float: left; width: 100%; height: auto; color: #000;}
#item_detail_spec dl dd.soldout {line-height: 40px; font-size: 14px; font-weight: bold; color: #AAA;}
#item_detail_spec dl dd input,
#item_detail_spec dl dd select {width: 200px; height: 40px; line-height: 20px; padding: 10px; font-size: 14px; font-weight: normal; background-color: #FFF; box-sizing: border-box; outline: 0px; border: 1px solid #000DFF; border-radius: 10px; -webkit-appearance: none;}

/*  ITEM  *//*  INFO  *//*  OPTION TABLE  */
#item_detail_option_table {float: left; width: 100%; height: auto; margin-top: 20px; margin-bottom: 20px;}
#option_tbl {float: left; width: 100%; height: auto; border: 1px solid #AAA;}
#option_tbl th {line-height: 20px; padding-top: 10px; padding-bottom: 10px; font-size: 12px; font-weight: bold; text-align: center; border: 1px solid #AAA;}
#option_tbl td {position: relative; line-height: 20px; padding-top: 10px; padding-bottom: 10px; font-size: 12px; font-weight: normal; text-align: center; border: 1px solid #AAA;}
}

/*  SP  */
@media screen and (max-width: 979px) {
/*  ITEM  *//*  INFO  */
#item_info_wrap {float: left; width: 100%; height: auto;}
#item_info {float: left; width: 100%; height: auto; padding: 20px; box-sizing: border-box;}

/*  ITEM  *//*  INFO  *//*  NAME  */
#item_name {float: left; width: 100%; height: auto;}
#item_name h2 {line-height: 30px; font-size: 20px; font-weight: bold;}
#item_name p {line-height: 20px; font-size: 12px; font-weight: normal;}
#item_name dl {float: left; width: 100%; height: auto;}
#item_name dl dt {float: left; width: auto; height: auto; line-height: 20px; margin-right: 20px; font-size: 12px; font-weight: normal;}
#item_name dl dd {float: left; width: auto; height: auto; line-height: 20px; font-size: 12px; font-weight: bold; }
#item_name dl dd a {display: inline-block; color: #000;}

/*  ITEM  *//*  INFO  *//*  PRICE  */
#item_price {float: left; width: 100%; height: auto; margin-top: 20px;}
#item_price p.price {float: left; line-height: 20px; font-size: 14px; font-weight: bold; color: #000;}
#item_price p.sale {float: left; line-height: 20px; font-size: 14px; font-weight: bold; color:  #FF0004;}
#item_price p.sale span {padding: 5px; margin-right: 10px; font-size: 10px; font-weight: bold; color: #FFF; background-color: #FF0004;}

/*  ITEM  *//*  INFO  *//*  SPEC  */
#item_detail_spec {float: left; width: 100%; height: auto; margin-top: 20px;}
#item_detail_spec dl {float: left; width: 100%; height: auto; padding-top: 10px; padding-bottom: 10px;}
#item_detail_spec dl dt {float: left; width: 100px; height: 30px; line-height: 30px; font-size: 12px; font-weight: normal; color: #000;}
#item_detail_spec dl dd {float: right; width: 100%; color: #000;}
#item_detail_spec dl dd.soldout {line-height: 40px; font-size: 14px; font-weight: bold; color: #AAA;}
#item_detail_spec dl dd input,
#item_detail_spec dl dd select {width: 100%; height: 40px; line-height: 20px; padding: 10px; font-size: 14px; font-weight: normal; background-color: #FFF; box-sizing: border-box; outline: 0px; border: 1px solid #000DFF; border-radius: 10px; -webkit-appearance: none;}

/*  ITEM  *//*  INFO  *//*  OPTION TABLE  */
#item_detail_option_table {float: left; width: 100%; height: auto; margin-top: 20px;}
#option_tbl {float: left; width: 100%; height: auto; border: 1px solid #AAA;}
#option_tbl th {line-height: 20px; padding-top: 10px; padding-bottom: 10px; font-size: 12px; font-weight: bold; text-align: center; border: 1px solid #AAA;}
#option_tbl td {position: relative; line-height: 20px; padding-top: 10px; padding-bottom: 10px; font-size: 12px; font-weight: normal; text-align: center; border: 1px solid #AAA;}
}

/*  04.  ITME - CART BUTTON
------------------------------*/
/*  PC  */
@media screen and (min-width: 980px) {
/*  ITEM  *//*  CART BUTTON  */
#item_detail_cart {float: left; width: 100%; height: auto; margin-top: 20px;}
#cart_button {float: left; width: 200px; height: 50px;}
#cart_button input[type=submit] {display: block; width: 100%; height: 50px; line-height: 50px; padding-left: 20px; font-size: 14px; font-weight: bold; color: #FFF; background-color: #AAA; box-sizing: border-box; outline: 0px; border: 0px; border-radius: 10px; cursor: pointer; -webkit-appearance: none;  background-image: url("https://img21.shop-pro.jp/PA01433/072/etc/icon_cart.png"); background-size: 20px; background-position: 30px; 10px; background-repeat: no-repeat;}
#cart_button input[type=submit]:hover {background-color:  #000DFF;}
}

/*  SP  */
@media screen and (max-width: 979px) {
/*  ITEM  *//*  CART BUTTON  */
#item_detail_cart {float: left; width: 100%; height: auto; margin-top: 20px;}
#cart_button {float: left; width: 100%; height: 50px;}
#cart_button input[type=submit] {display: block; width: 100%; height: 50px; line-height: 50px; padding-left: 20px; font-size: 14px; font-weight: bold; color: #FFF; background-color:  #000DFF; box-sizing: border-box; outline: 0px; border: 0px; border-radius: 10px; cursor: pointer; -webkit-appearance: none;  background-image: url("https://img21.shop-pro.jp/PA01433/072/etc/icon_cart.png"); background-size: 20px; background-position: 30%; 10px; background-repeat: no-repeat;}
}

/*  05.  ITEM - SNS
------------------------------*/
/*  ITEM  *//*  SNS  */
#item_detail_sns {float: left; width: 100%; height: auto; margin-top: 20px;}
#item_detail_sns ul {float: left; width: auto; height: auto;}
#item_detail_sns ul li {float: left; width: auto; height: auto; margin-right: 20px;}
#item_detail_sns ul li:first-child {margin-right: 5px;}

/*  06.  ITEM - LEGAL
------------------------------*/
/*  ITEM  *//*  LEGAL  */
#item_detail_legal {float: left; width: 100%; height: auto; margin-top: 40px;}
#item_detail_legal ul {float: left; width: auto; height: auto;}
#item_detail_legal ul li {clear: both; float: left; width: auto; height: auto; line-height: 20px; font-size: 12px; font-weight: normal;}
#item_detail_legal ul li a {display: inline; color: #000;}
#item_detail_legal ul li a::before {content: "- ";}
#item_detail_legal ul li a:hover {text-decoration: underline;}

/*  07.  ITEM - EXPLAIN
------------------------------*/
/*  PC  */
@media screen and (min-width: 980px) {
/*  ITEM  *//*  EXPLAIN  */
#item_explain_wrap {float: left; width: 100%; height: auto; margin-top: 40px; margin-bottom: 40px;}
#item_explain {line-height: 30px; font-size: 14px; font-weight: normal;}
#item_explain iframe {width: 100%;}
}

/*  SP  */
@media screen and (max-width: 979px) {
/*  ITEM  *//*  EXPLAIN  */
#item_explain_wrap {float: left; width: 100%; height: auto; margin-top: 20px; margin-bottom: 20px;}
#item_explain {line-height: 20px; font-size: 12px; font-weight: normal;}
#item_explain iframe {width: 100%;}
}

/*  08.  ITEM - ITEM LIST
------------------------------*/
/*  PC  */
@media screen and (min-width: 980px) {
/*  ITEM  *//*  LIST  */
.item_itemlist {float: left; width: 100%; height: auto; margin-top: 50px; margin-bottom: 50px;}
.item_itemlist .item_list {margin-top: 50px;}
.item_itemlist .item_list_body ul li {float: left; width: calc(33.3% - 40px); height: auto;}
}

/*  SP  */
@media screen and (max-width: 979px) {
/*  ITEM  *//*  LIST  */
.item_itemlist {float: left; width: 100%; height: auto; margin-top: 20px; margin-bottom: 20px;}
.item_itemlist .item_list {margin-top: 20px;)
}

/*  EX.  ANIMATION
------------------------------*/
/*  ANIMATION  */
.flex-control-thumbs img,
.flex-control-thumbs .flex-active,
#item_name dl dd a,
#cart_button input[type=submit],
.item_list ul li .item_list_detail {transition: all .3s; -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s;}