/* カスタマイズ用CSS */
@charset "UTF-8";

/*
ヘッダー：カテゴリナビ

ヘッダー内で使用されている商品のカテゴリ一覧として使用します。
`li`の中に`ul > li`要素を入れることで、階層を深くする事ができます。

Markup:
include /assets/tmpl/elements/11.4.categoryNavi.pug
+ec-itemNav

sg-wrapper:
<div class="ec-categoryNaviRole" style="padding-bottom:150px;">
  <sg-wrapper-content/>
</div>

Styleguide 11.2.5
*/
/*------------------------------------------------------*/
/* カテゴリー */
/*------------------------------------------------------*/

.ec-categoryNaviRole {
    display: block;
    width: 100%;
    margin-bottom: 15px;
    padding: 0;
    border: 1px solid #ccc;
    border-radius: 3px;
}

.ec-categoryNaviRole:before {
    content: "\f0caカテゴリ";
    width: 100%;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: .05rem;
    background: #f1f3f8;
    color: #005eb7;
    padding: 10px 14px 10px 1rem;
    margin-bottom: 0;
    border: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: inline-block;
    line-height: 1.7em;
    font-family: 'Font Awesome 5 Free';
    box-sizing: border-box;
}

.ec-itemNav {
    margin: 0;
    padding: 8px;
    width: 100%;
    height: 100%;
    text-align: left;
}

ul.dropdown_nav ul{
    display:none;
}

ul.dropdown_nav > li > a {
    color: #96588a;
    font-size: 18px;
    line-height: 2em;
    font-weight: bold;
}

ul.dropdown_nav ul > li > a {
    color: #96588a;
    font-size: 18px;
    line-height: 2em;
}

ul.dropdown_nav > li > span {
    display: inline-block;
    width: 20px;
    font-size: 18px;
    color: #005eb7;
}

ul.dropdown_nav > li > span.envelope-type {
    cursor: hand;
    cursor: pointer;
}

ul.dropdown_nav > li > span.no-type {
    font-size: 8px;
}

/*------------------------------------------------------*/
/* 商品詳細 */
/*------------------------------------------------------*/

.ec-producDetails p{
    margin-top: 0;
    margin-bottom: 5px;
}

#produc_attribute td{
    padding: 3px;
    width: 50%;
    border-bottom:1px dotted #999;
}

.ec-productRole__actions > div > div > label{
    font-weight: bold;
}

.ec-productRole__actions > div{
    margin-bottom: 20px;
}

#productoption3,
#productoption4,
#productoption10,
#productoption11{
    display: flex;
    flex-wrap: wrap;
    justify-content:start ;
    /*justify-content:stretch;*/
}

#productoption8,
#productoption16{
    display: flex;
    flex-wrap: wrap;
    justify-content:space-between ;
    /*justify-content:stretch;*/
}

#productoption3 > div,
#productoption4 > div,
#productoption10 > div,
#productoption11 > div{
    width: 20%;
}

#productoption8 > div{
    width: 30%;
}

#productoption16 > div{
    width: 25%;
}

#productoption3 label,
#productoption4 label,
#productoption10 label,
#productoption11 label{
    margin: 0;
    font-size: 75%;
}

#productoption8 label{
    margin: 0;
}

#productoption8 input[type=radio]{
    margin: 0;
}

.pstyle3 img,
.pstyle4 img,
.pstyle10 img,
.pstyle11 img{
    height: 80px;
    width: 80px;
}

.pstyle8 img{
    width:75%;
}

.ec-productRole__btn{
    margin: auto;
}

#produc_attribute td span:first-child{
    font-size: 80%;
}

#produc_attribute td span:nth-child(2){
    font-weight: bold;
}

.ec-productRole .ec-productRole__description{
    padding: 1em 1.41575em;
    /*font-weight: bold;*/
}

.suggestbox {
    background: #f1f3f8;
    padding: 10px;
}

/* 商品タイトル */
.ec-productRole__title>h2.ec-headingTitle{
    margin:10px 0 0 !important;
    font-weight:bold;
    font-size: 1.4rem !important;
}

/* 商品画像 */
.ec-sliderItemRole{
    margin-top: 10px;
}

/* 商品一覧ディスクリプション */
.ec-grid2__cell{
    margin-top: 10px;
}
.pro_des_list{
    color:#247ed4;
    margin:10px 14px 5px !important;
}
/* タグ */
.ec-productRole__tag{
    background: #f1f1f1;
    border: solid 1px #ccc;
}

.ec-productRole__tag a {
    color:#005eb7;
}
/* 商品詳細情報 */
.ec-detail-list li:before
{
    content: "・";
    color: #005eb7;
    left: 0;
    top: 0;
    font-size: 1.2rem;
    position: relative;
    top: 4px;
}
.ec-detail-list li span:first-child{
    font-weight:bold;
}

/* オプションチェックボックス */
#productoption1{
    margin: 5px 0 0 5px;;
}
input[type=checkbox]#productoption1_1{
    transform: scale(2);
}
input[type=checkbox]#productoption1_1+label{
    font-size: 120%;
    font-weight: 700;
}

/* 商品金額 */
.ec-price__price{
    color:#de5d50;
}

/* 料金表一覧 */
/* 全体 */
#priceList {
    margin-bottom: 2em;
}
/* 説明テキスト */
.priceList-text {
    margin: 0 1em;
}
/* 1行 */
.priceList-frame {
    border: solid 1px #ccc;
    cursor: pointer;
}

/* マウスオーバー時 */
.priceList-frame:hover > .priceList-count {
    background: #eee;
}
.priceList-frame:hover > .priceList-price {
    background: #eee;
}
/* 枚数 */
.priceList-count {
    padding:0.5em 2em;
    display:inline-block;
    width: 30%;
    background: #e1f3ff;
    font-weight:bold;
}
/* 金額 */
.priceList-price {
    padding:0.5em 2em;
    display:inline-block;
    width: 70%;
    background: #fff;
    color: #005eb7;
    font-weight: bold;
}
/* クリック無効化時 */
.priceList-disabled {
    opacity: 0.5;
    cursor: not-allowed;
}
/*------------------------------------------------------*/
/*　カート　*/
/*------------------------------------------------------*/
.ec-cartRole .ec-cartRole__cart{
    margin: 0;
}
.ec-cartRole .ec-cartRole__actions{
    width: 50%;
    margin-right: 5%
}

/*------------------------------------------------------*/
/*　サンクスページ　*/
/*------------------------------------------------------*/
.ec-off3Grid .ec-off3Grid__cell{
    margin :0;
    width : 100%
}
/*------------------------------------------------------*/
/*--------------- >= 720px -------------------------------*/
/*------------------------------------------------------*/
@media screen and (max-width: 45em) {

    #produc_attribute td{
        display: block;
        text-align: left;
        width: 100%;
    }

    #productoption3 > div,
    #productoption10 > div{
        width: 25%;
    }

    #productoption16 > div{
        width: 50%;
    }

}
/*------------------------------------------------------*/
/*--------------- >= 620px -------------------------------*/
/*------------------------------------------------------*/
@media screen and (max-width: 38.75em) {

    #productoption3 > div,
    #productoption10 > div{
        width: 33%;
    }

    #productoption8 > div{
        width: 50%;
    }

    #productoption16 > div{
        width: 50%;
    }
}

/*------------------------------------------------------*/
/*--------------- >= 500px -------------------------------*/
/*------------------------------------------------------*/
@media screen and (max-width: 31.25em) {

    #productoption3 > div,
    #productoption10 > div{
        width: 50%;
    }
    .ec-cateImg{
        width:40%;
        padding: 15px;
    }
    .ec-cateDescription{
        width:55%;
        font-size:90%;
        padding-top: 20px;
    }
}



/*------------------------------------------------------*/
/* 検索 */
/*------------------------------------------------------*/
.ec-headerSearch{
    margin-bottom: 15px;
    padding: 0;
}

/*------------------------------------------------------*/
/* タグ */
/*------------------------------------------------------*/
.ec-tagNaviRole {
    /*padding: 25px 15px;*/
    margin-bottom: 15px;
    border: 1px solid #ccc;
    border-radius: 3px;
}

.ec-productRole-custom__tags{
    display: flex;
    flex-wrap: wrap;
    padding: 20px 10px;
}

.ec-productRole-custom__tags a {
    line-height: 1.2;
    font-size: 16px;
    font-weight: normal;
    color: #005eb7;
    letter-spacing: .01rem;
    text-decoration-line: none;
    background: #f1f1f1;
    border: solid 1px #ccc;
    border-radius: 2px;
    display: inline-block;
    padding: 5px;
    margin: 3px 3px 8px 3px;
}

.ec-tagNaviRole:before{
    content: "\f02cタグ";
    width: 100%;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: .05rem;
    background: #f1f3f8;
    color: #005eb7;
    padding: 10px 14px 10px 1rem;
    margin-bottom: 0;
    border: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: inline-block;
    line-height: 1.7em;
    font-family: 'Font Awesome 5 Free';
    box-sizing: border-box;
}

/*------------------------------------------------------*/
/* 商品リスト */
/*------------------------------------------------------*/
.ec-shelfGrid{
    display: block;
}

.ec-shelfGrid .ec-shelfGrid__item:nth-child(odd){
    padding-right: 0;
    padding-left: 0;
}

.ec-shelfGrid .ec-shelfGrid__item:nth-child(even){
    padding-right: 0;
    padding-left: 0;
    /*background-color: #eaeaea;*/
}

.ec-shelfGrid .ec-shelfGrid__item{
    width: 100%;
    display: inline-block;
    margin-bottom: 0px;
    border-top: dotted 0.5px #0a95e0;
}

.ec-shelfGrid .ec-shelfGrid__item p{
    margin-top: 5px;
    margin-bottom: 0;
    margin-right: 5px;
    display: table-row;
    /*font-size:100%;*/
}
.ec-shelfGrid .ec-shelfGrid__item p.productname{
    font-weight: bold;
}

.ec-shelfGrid .ec-shelfGrid__item-image{
    width: 100px;
    height: 100px;
    float: left;
}
.ec-shelfGrid .ec-shelfGrid__item img{
    float: left;
}

.ec-shelfGrid__item a:first-child{
    width: calc(100% - 20%);
    float: left;
}
.ec-shelfGrid__item a::nth-child(2){
    width: 10%;
    float: right;
}
.product_detail{
    width: 10%;
    float: right;
}

.ec-shelfGrid .ec-shelfGrid__item .ec-productRole__btn{
    margin: 10px 0;
    float: right;
}

.ec-shelfGrid .ec-shelfGrid__item .ec-productRole__btn button{
    border-radius: 5px;
}
.ec-cate{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 10px;
    padding-right: 15px;
    background-color: #f1f3f8;
    border-radius:3px;
    width: 100%;
}
.ec-cateImg{
    width:32.5%;
    padding: 15px;
}
.ec-cateDescription{
    width:65%;
    font-size:90%;
    padding-top: 20px 0 10px;
}
#ec-cateh2{
    color: #005eb7;
    font-style: bold;
    border:0px none;
    margin:0;
    padding: 15px 0 10px;
}
#Categorys ol {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 10px;
}
#Categorys ol li{
    width: 32.5%;
}
#Categorys ol li:before{
    content: "\f139";
    font-family: dashicons;
    color: #005eb7;
    left: 0;
    top: 0;
    font-size: 1.2rem;
    position: relative;
    top: 4px;
}
.price02-default{
    color: #DE5D50;
    font-weight: bold;
    font-size: 120%;
}
/*------------------------------------------------------*/
/*--------------- >= 620px -------------------------------*/
/*------------------------------------------------------*/

@media screen and (max-width: 38.75em) {
    .ec-cateImg{
        width:45%;
        padding: 10px;
    }
    .ec-cateDescription{
        width:53%;
        font-size:90%;
        padding: 10px 5px;
    }
}
/*
@media screen and (min-width: 31.26em) {
	.ec-shelfGrid .ec-shelfGrid__item .ec-productRole__btn{
    margin: 10px 0;
    float: right;
}
}*/
@media screen and (max-width: 43.75em) {
    .ec-shelfGrid__item a:first-child{
        width: 100%;
        float: left;
    }
}
/*.ec-shelfGrid .ec-shelfGrid__item .ec-productRole__btn{
		width: 50%;
		
	}
	.ec-shelfGrid .ec-shelfGrid__item p{
	font-size:75%;
}
	.ec-shelfGrid .ec-shelfGrid__item p.price02-default{
		padding-bottom: 20px;
	}
}
*/
/*------------------------------------------------------*/
/* プラグイン */
/*------------------------------------------------------*/
ul.recommendLists {
    font-size: 80%;
    background: #f1f3f8;
    padding: 10px;
}
ul.recommendLists p{
    font-weight: bold;
}
ul.recommendLists .ec-shelfGrid__item a:first-child{
    width: 100%;
}
dt.item_name{
    font-weight: normal;
}
dd.item_price {
    color: #DE5D50;
    font-weight: bold;
}
/*------------------------------------------------------*/
/* ログイン */
/*------------------------------------------------------*/
.ec-grid3 form{
    margin: 0;
}