/* カスタマイズ用CSS */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP&display=swap');
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@100;300;400;500;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Kosugi+Maru&display=swap');

*{
    box-sizing: border-box;
}

a:hover{
    text-decoration: none;
    opacity: 0.6;
}

body{
    font-family: 'Noto Sans JP', sans-serif;
}

.ec-layoutRole__header{
    position: fixed;
    padding-left:10%;
    background-color:#ffffff;
    width:100%;
    z-index:100;
}

.ec-productRole__priceRegular{
    text-align:center;
}

.ec-layoutRole .ec-layoutRole__contents{
    padding-top:80px;
    max-width: 1980px;
}

.ec-sliderRole{
    max-width: 1024px;
}

.ec-productRole{
    width:80%;
    max-width: 1920px;
    min-width: 1024px;
}


.ec-productRole__price{
    text-align:center;
}

.ec-productRole__code, .ec-productRole__limitedtime, .ec-productRole__maker, .ec-productRole__category, .ec-productRole__actions{
    margin-left:20%;
}

.ec-productRole__btn{
    margin: auto;
}

hr{
  border-top: 3px double #8c8b8b;
  width:80%;
}

.centeringbox{
    text-align: center;
}

.toplinktext{
    font-size:1em;
}

@media screen and (max-width: 768px){
.ec-productRole__code, .ec-productRole__limitedtime, .ec-productRole__maker, .ec-productRole__category, .ec-productRole__actions{
    margin-left:0;
}
}

@media screen and (max-width: 900px){
.toplinktext{
    font-size:1rem;
}
    
.ec-productRole{
    width:99%;
    max-width: 99%;
    min-width: 99%;
    padding-left: 0;
    padding-right: 0;
}

.ec-layoutRole .ec-layoutRole__contents{
    padding-top:64px;
}

.ec-productRole__profile{
    padding:0 8px;
}

}

.ec-sliderItemRole{
    max-width: 1280px;
}

.ec-sliderItemRole .slideThumb{
    width: 10%;
}

.thinarea{
    width: 70%;
    margin: auto;
    background-color: #ffdddd;
    padding: 32px;
    border-radius: 16px;
}

.ec-productRole__description{
    padding: 32px;
}

.spbr{
    display: none;
}

.ec-sliderItemRole .item_nav{
    justify-content: center;
}

/* トップブロック用 */
.topbannerB{
    display:block;
    width:80%;
    margin:auto;
}

.topflexbox{
    display:flex;
    flex-wrap: wrap;
    justify-content:center;
}

.toptogglebox{
    display:none;
}

.toptogglebutton{
    background-color:#ff6700;
    color:#ffffff;
    padding:8px 32px;
    width:70%;
    margin:0 auto 8px auto;
    border-radius:8px;
    font-size: 1.4em;
}

.toptogglebutton:hover{
    background-color:#ffcc00;
}

.toptogglebutton:active{
    background-color:#ffcc00;
}

.topname{
    display:inline-block;
    width:60%;
    text-align: left;
    padding-left:32px;
}

.topblockbox{
    width:19%;
    border:2px solid #ffcc00;
    padding:8px;
}

@media screen and (max-width: 1200px){
.topblockbox{
    width:33%;
    border:2px solid #ffcc00;
    padding:8px;
}
}

.topbanner{
    display:block;
    width:100%;
    margin:auto;
    padding:8px;
    text-align: center;
}

.topicon{
    width:30%;
    border-radius: 8px;
}

@media screen and (max-width: 900px){
.toptogglebutton{
    padding:8px;
    width:100%;
    margin:0 auto;
    text-align: center;
}

.toptogglebutton:active{
    background-color:#ffcc00;
}

.toptogglebutton:hover{
    background-color:#ff6700;
}

.topname{
    display:block;
    width:100%;
    text-align: center;
    padding-left:0;
}

.topicon{
    width:100%;
}

.topbannerB{
    display:block;
    width:100%;
}

.topflexbox{
    display:block;
}

.topblockbox{
    width:100%;
    border:2px solid #ffcc00;
    padding:8px;
}

.topbanner{
    display:block;
    width:100%;
}
}
/* トップブロック用ここまで */

@media screen and (max-width: 900px){
.thinarea{
    width: 90%;
    padding: 8px;
}

.ec-productRole__description{
    padding: 0;
}

.spbr{
    display: block;
}

}

@media screen and (max-width: 900px){
.ec-sliderItemRole .slideThumb{
    width: 25%;
}
}

.topsalebox{
    display:flex;
    flex-wrap: wrap;
    margin-left:10%;
    width:80%;
}

.toppagebox{
    margin:auto;
    padding: 16px 16px 0 16px;
    width:78%;
    border: 3px solid #ff9900;
    border-radius: 16px;
}

.saleitembox{
    display:block;border:3px solid #ff9900;
    margin:1px;
    width:33%;
}

.saleitembox2{
    display:block;
    border:5px solid #ff9900;
    border-left:18px solid #ff9900;
    border-right:18px solid #ff9900;
    margin:1px;
    width:98%;
    border-radius: 16px
}

.saleitembox2 .topimage{
    width:75%;
}


.saleitembox3{
    display:block;
    border:4px solid #ff9900;
    border-top:4px solid #ff9900;
    border-bottom:4px solid #ff9900;
    margin:1px;
    width:24%;
    border-radius: 16px;
    padding:16px;
}

.saleitembox3 .topimage{
    object-fit: contain;
    height:10vw;
    min-height:100px;
    margin-top:8px;
    margin-bottom:8px;
}

.saleitembox4{
    display:block;border:3px solid #ff9900;
    margin:1px;
    width:33%;
}

.saleitembox5{
    display:block;
    border:4px solid #ff9900;
    border-top:4px solid #ff9900;
    border-bottom:4px solid #ff9900;
    margin:1px;
    width:16%;
    border-radius: 16px;
    padding:4px;
}

.saleitembox5 .topimage{
    height:8vw;
    min-height:80px;
    margin-bottom:8px;
    object-fit: contain;
}

.saleitembox3 .expandfont{
    font-size:clamp(0.8em, 0.8vw, 1.2em);
    font-weight:500;
    background-color:#ffeeaa;
    color:#000000;
}

.saleitembox5 .expandfont{
    font-size:clamp(0.6em, 0.6vw, 1em);
    font-weight:500;
    background-color:#ffeeaa;
    color:#000000;
}

@media screen and (max-width: 1240px){
.saleitembox3{
    width:33%;
}

.saleitembox5{
    width:24%;
}
}

.saleitembox3 .topimage, .saleitembox5 .topimage{
    width:90%;
}

.saleitembox2 .expandfont{
    font-size:1.2em;
}

.indentbox{
    margin-left:32px;
    margin-bottom:16px;
    margin-top:8px;
}

@media screen and (max-width: 900px){
.topsalebox{
    display:flex;
    margin:auto;
    width:94%;
}

.toppagebox{
    display:block;
    margin-left:5%;
    margin-right:5%;
    width: 90%;
    padding: 8px;
}

.saleitembox,.saleitembox3{
    display:block;
    border:3px solid #ff9900;
    margin:0 0 1 0;
    width: 48%;
    padding:4px;
}

.saleitembox2{
    display:block;
    width:100%;
}

.saleitembox2 .topimage{
    width:90%;
}

.saleitembox .expandfont{
    font-size:0.9em;
    padding:8px;
    margin-bottom:4px;
}

.saleitembox2 .expandfont{
    font-size:0.9em;
    padding:8px;
    margin-bottom:4px;
}

.saleitembox3 .expandfont{
    background:none;
    color:#000000;
    font-size:clamp(0.8em, 0.9vw, 1.2em);
}

.saleitembox5{
    width:48%;
}

.saleitembox5 .expandfont{
    background:none;
    color:#000000;
    font-size:clamp(0.8em, 0.9vw, 1.2em);
}

.indentbox{
    margin-left:8px;
    margin-bottom:8px;
    margin-top:4px;
}

.saleitembox4{
    width:90%;
}

}

.caption{
    display:block;
    padding: 4px 8px;
    border-top:5px solid #6699ff;
    border-bottom:5px solid #6699ff;
    color:#ffffff;
    background-color: #3366ff;
    font-weight: bold;
    font-size:1.8rem;
    width:60%;
    margin:8px auto;
    text-align: center;
    border-radius: 16px;
}

.toplinkbutton{
  display:inline-block;
  margin:auto;
  background-color:#ff6700;
  color:#ffffff;
  text-decoration:none;
  margin-top:8px;
  border-radius:8px;
  padding:8px;
  font-weight: bold;
}

.toplinkbutton:hover{
  text-decoration:none;
  opacity: 0.8;
}

.cautionbox{
    border:3px solid #ff0000;
    color:#ff0000;
    border-radius: 16px;
    padding:8px;
    margin:8px auto;
    width:56%;
    font-weight:bold;
    font-size:0.8em;
}

.cautionbox2{
    border:3px solid #ff0000;
    color:#ff0000;
    border-radius: 16px;
    padding:8px;
    margin:8px auto;
    width:60%;
    font-weight:bold;
    font-size:1.1em;
}

.expandfont{
    font-weight: 900;
    font-family: 'Noto Sans JP';
    font-size: 1em;
    padding: 0 4px;
    transform:rotate(0.03deg);
}

.largefont{
    font-weight: 900;
    font-family: 'M PLUS Rounded 1c';
    font-size: 1.4em;
    padding: 0 4px;
}

.pagecaption{
    display: block;
    font-weight: 900;
    font-family: 'M PLUS Rounded 1c';
    font-size: 1.8em;
    text-align: center;
}

.boxcaption{
    display:block;
    font-weight: 900;
    font-family: 'M PLUS Rounded 1c';
    font-size: 1.8em;
    margin-bottom: 16px;
}

.redfont{
    color: #ff3333;
}

.violetfont{
    color: #8a00ff;
}

.pinkfont{
    color: #ff9999;
}

.lightazaleafont{
    color: #FF73B9;
}

.orangefont{
    color: #ff9646;
}

.bluefont{
    color: #3333ff;
}

.lightbluefont{
    color: #6699ff;
}

.greenfont{
    color: #009900;
}

.grayfont{
    color: #5e7b96;
}

.brownfont{
    color: #7d5b2e;
}

@media screen and (max-width: 900px){
.cautionbox{
    width:90%;
}
.cautionbox2{
    width:80%;
}

.pagecaption{
    font-size: 1.4em;
}
}

.topimage{
    width:45%;
}

.topimage2{
    width:30%;
}

.subtitle{
    background-color:#ff0000;
    color:#ffffff;
    padding:4px;
    display:table;
}

.cautionbox hr{
    height: 1px;
    background-color: #ff0000;
}

@media screen and (max-width: 900px){
.topimage{
    width:90%;
}
.topimage2{
    width:80%;
}
}

.panels{
    display:flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width:80%;
    margin:auto;
}

.panelbox{
    display:block;
    width:32%;
    position: relative;
    height:auto;
    margin: 8px auto;
}

.panelboxT{
    display:block;
    width:24%;
    height:auto;
    margin-bottom: 16px;
    color:#000000;
    border:3px solid #ff9900;
    padding:8px;
}

.panelboxT .title{
    background-color:#ff9900;
    color:#ffffff;
    padding:4px;
    text-align:center;
    font-weight: bold;
}

.panelbox2{
    display:block;
    width:24%;
    position: relative;
    height:auto;
    margin-bottom:16px;
}

.productminibox{
    display:block;
    width:300px;
    height:200px;
    margin: auto;
    margin-bottom: 8px;
    background-size:cover;
    background-position: center center;
    border-radius: 8px;
    border:4px solid #00cc00;
}

.productminibox:hover{
    border:4px solid #ffcc00;
}

.miniboxtitle{
    display:block;
    font-size:0.9 rem;
    margin-top: 120px;
    text-align:center;
}

.paneltitle{
    position: absolute;
    bottom:2px;
    text-align: center;
    font-size:0.8vw;
    width:100%;
    font-weight:bold;
}

.paneltitle2{
    position: absolute;
    bottom:8px;
    text-align: center;
    font-size:0.7em;
    width:100%;
    font-weight:bold;
    padding:8px;
    color:#ffffff;
    background-color:rgba(0,12,64,0.7);
}

.panelbox:before{
    content: "";
    display: block;
    padding-top:80%;
}

.panelbox2:before{
    content: "";
    display: block;
    padding-top:100%;
}

.linkbox{
    position: absolute;
    top: 0; 
    left: 0;
    width: 100%;
    height: 100%;
    
    display:block;
    background-size:contain;
    background-repeat: no-repeat;
    background-position: top center;
    text-align:center;
    text-decoration:none;
    color:#000000;
    border:4px solid #ff9900;
    border-radius:16px
}

.linkbox2{
    position: absolute;
    top: 0; 
    left: 0;
    width: 100%;
    height:100%;
    
    display:block;
    background-size:contain;
    background-repeat: no-repeat;
    background-position: top center;
    text-align:center;
    text-decoration:none;
    color:#000000;
    border:2px solid #ff6600;
}

@media screen and (max-width: 900px){
.productminibox{
    width:90%;
    height:200px;
    margin-bottom:8px;
}

.panels{
    display:flex;
    width:80%;
    margin:auto;
}
.panelbox{
    width:100%;
    margin-bottom:8px;
}
.panelboxT{
    width:100%;
    margin-bottom:8px;
}
.panelbox2{
    width:49.5%;
    margin-bottom:8px;
}

.empty{
    display: none;
}

.caption{
    margin:8px auto;
    font-size:1.2rem;
}
.linkbox{
    border:1px solid #ff0000;
}
.linkbox2{
    border:1px solid #0000ff;
}
.paneltitle{
    font-size:0.9em;
    width:100%;
    font-weight:bold;
}
.paneltitle2{
    font-size:0.8em;
    width:100%;
    font-weight:bold;
}

.panelbox2:before{
    content: "";
    display: block;
    padding-top:100%;
}
.linkbox2{
    background-position: top 8px left 0px;
}
}

.redbox{
    border:2px solid #ff0000;
    border-radius: 16px;
    padding:16px;
    font-weight: bold;
}

.bluebox{
    border:2px solid #0000ff;
    border-radius: 16px;
    padding:16px;
    font-weight: bold;
}

.dotbox, .dotbox2, .dotbox3, .dotbox4{
    border:2px dotted #ffb600;
    border-radius: 16px;
    background-color: #fff0d5;
    padding:32px;
    font-weight: bold;
    font-size: 1.2em;
    line-height:1.6em;
    margin-left: 16px;
    margin-right: 16px;
}

.dotbox img{
    float: left;
    margin: 0 16px 16px 0;
    max-height:280px;
    width: auto;
}

.dotbox .pic{
    float: none;
    width:90%;
    max-height:initial;
    height:auto;
}

.dotbox .pic2{
    float: none;
    width:70%;
    max-height:initial;
    height:auto;
}

.dotbox .pic3{
    float: none;
    width:40%;
    max-height:initial;
    height:auto;
}

.dotbox a{
    text-decoration: underline;
}

.ec-grid2{
    display: block;
}

.ec-grid2 .ec-grid2__cell{
    width: 100%;
}

.slick-slider img{
    width: 100%;
    height: 50vw;
    object-fit: contain;
    max-height:600px;

}

.ec-productRole__title{
    border-top: 1px solid #cccccc;
    border-bottom: 1px solid #cccccc;
    padding: 16px 0;
    text-align: center;
    margin-bottom: 8px;
    font-weight: 900;
    font-family: 'M PLUS Rounded 1c';
}

@media only screen and (max-width: 768px){
.dotbox img,.dotbox .pic,.dotbox .pic2,.dotbox .pic3{
    float: none;
    display: block;
    margin: auto;
    width: 90%;
}

.slick-slider{
    touch-action:auto;
}

.slick-slider img{
    width: auto;
    height:200px;
    display: block;
    margin: auto;
}

.ec-productRole__title{
    text-align: left;
}

.dotbox{
    margin-left: 4px;
    margin-right: 4px;
    border-radius: 16px;
    padding:8px;
    font-weight: bold;
    font-size: 0.85em;
    line-height:1.7em;
}
}

.tanipage{
    width:80%;
    margin:auto;
}

.senderbox{
    border-radius: 16px;
    font-weight: 800;
    padding: 8px 16px;
    font-size: 1.4em;
    color: #ffffff;
    display: block;
    text-align: center;
    width:80%;
    margin:auto;
}

.senderbox2{
    display: inline-block;
    border-radius: 16px;
    font-weight: 800;
    padding: 4px 16px;
    font-size: 1em;
    color: #ffffff;
    margin:4px;
}

.hiromedocolor{
    background-color: #ff0000;
    color:#ffffff;
}

.rakuencolor{
    background-color: #cc00ff;
    color:#ffffff;
}

.taikancolor{
    background-color:#0000ff;
    color:#ffffff;
}

.maihimecolor{
    background-color:#ff9900;
    color:#ffffff;
}

.tanikawacolor{
    background-color: #009900;
    color:#ffffff;
}

@media screen and (max-width: 900px){
.hiromedocolor{
    background-color: #ffffff;
    border-color: #ff0000;
    color: #ff0000;
}

.rakuencolor{
    background-color: #ffffff;
    border-color: #cc00ff;
    color: #cc00ff;
}

.taikancolor{
    background-color: #ffffff;
    border-color: #0000ff;
    color: #0000ff;
}

.maihimecolor{
    background-color: #ffffff;
    border-color: #ff9900;
    color: #ff9900;
}

.tanikawacolor{
    background-color: #ffffff;
    border-color: #009900;
    color: #009900;
}
}

a.linkbutton{
  display:inline-block;
  margin:auto;
  background-color:#ff6700;
  color:#ffffff;
  text-decoration:none;
  border-radius:8px;
  margin: 8px;
  padding:8px 16px;
  font-weight: 700;
}

a.linkbutton2{
  display:block;
  width:50%;
  margin:8px auto;
  background-color:#ff6700;
  color:#ffffff;
  text-decoration:none;
  border-radius:8px;
  padding:16px 16px;
  font-weight: 700;
  text-align: center;
}

a.linkbutton_top{
  display:block;
  width:80%;
  margin:8px auto;
  background-color:#ff6700;
  color:#ffffff;
  text-decoration:none;
  border-radius:8px;
  padding:16px 16px;
  font-weight: 700;
  text-align: center;
}

a.linkbutton:hover, a.linkbutton2:hover{
  text-decoration:none;
  background-color:#ffaa00;
}

@media screen and (max-width: 900px){
a.linkbutton2, a.linkbutton_top{
  width:90%;
}
}


a.linkbutton3{
  width:80%;
  text-align: center;
  display:block;
  margin:auto;
  background-color:#ff6700;
  color:#ffffff;
  text-decoration:none;
  border-radius:8px;
  padding:8px 16px;
  font-weight: 700;
}

/* 商品一覧 */
.ec-shelfGrid__item{
    border:1px solid #ff6700;
    padding:8px;
}

.ec-shelfGrid .ec-shelfGrid__item-image{
    height:auto;
}

.ec-shelfGrid .ec-shelfGrid__item:nth-child(odd),.ec-shelfGrid .ec-shelfGrid__item:nth-child(even){
    padding:8px 16px;
}

/* まちカドまぞく */
.mazoku{
    background-color:#ffffff;
    background-image:url(/html/user_data/assets/img/mazokuback.jpg);
    background-size: contain;
    border:9px solid #8341A5;
    border-radius: 16px
}

.mazoku .dotbox{
    border:3px solid #4f3057;
    background-color:#ffefef;
    color:#713328;
}

.mazoku .color1{
    color:#d985d9;
}

.mazoku .color2{
    color:#d94343;
}

.mazoku .color3{
    color:#ed9a1c;
}

.mazoku .color4{
    color:#21a5bf;
}

.mazoku .color5{
    color:#2cc71e;
}

.mazoku .linkbutton,.mazoku .linkbutton2{
    background-color: #b833b6;
}

/* ごちうさ */
.gochiusa .dotbox{
    border:5px solid #713328;
    background-color:#ffeee0;
    color:#713328;
}

.gochiusa .linkbutton{
    background-color:#713328;
    border:1px solid #fff;
    color: #fff;
    width:80%;
}

.gochiusa .linkbutton2{
    background-color:#713328;
}

.gochiusa .linkbutton3{
    background-color:#713328;
    border:1px solid #fff;
    color: #fff;
}

.gochiusa hr{
    border-top: 1px solid #713328;
    width:500%;
    margin-left:-100%;
}

@media screen and (max-width: 900px){
.gochiusa hr{
    width:100%;
    margin-left:0;
}
}

/* ゆるキャン△ */
.yurucamp{
    background-color: #fff1f1;
}

.yurucamp .dotbox{
    border-color: #ffc597;
    color: #885934;
    background-color: #fffff5;
    border-width: 6px;
    border-style: solid;
 }

.yurucamp .color1{
    color: #ff7777;
}

.yurucamp .color2{
    color:#526ec8;
}

.yurucamp .color3{
    color:#c02626;
}

.yurucamp .color4{
    color: #4f9e3a;
}

.yurucamp .color5{
    color: #ffb525;
}

.yurucamp .color6{
    color: #c15b81;
}

/* ガルパン */
.garupan{
    background-color: #f2e5c0;
}

.garupan .dotbox{
    border-color: #cec2b2;
    color: #006600;
    background-color: #ffffff;
    border-width: 10px;
    border-style: ridge
 }

.garupan .color1{
    color: #ee0000;
}

.garupan .color2{
    color:#009900;
}

.garupan .color3{
    color:#0000ff;
}

.garupan .color4{
    color: #b2d142;
}

.garupan .color5{
    color: #7d7f75;
}

/* 結城友奈は勇者である */
.yuyuyu .dotbox{
    border-color: #FF73B9;
    background-color:#fff4f9;
    border-radius: 0;
}

.yuyuyu .color1{
    color:#FF73B9;
}

.yuyuyu .color2{
    color:#999999;
}

.yuyuyu .color3{
    color:#713328;
}


.yuyuyu .linkbutton{
    background-color:#FF73B9;
    border:1px solid #fff;
    color: #fff;
    width:80%;
}

.yuyuyu .linkbutton2{
    background-color:#FF73B9;
}

.yuyuyu .linkbutton3{
    background-color:#FF73B9;
    border:1px solid #fff;
    color: #fff;
}

.yuyuyu hr{
    border-top: 1px solid #FF73B9;
    width:500%;
    margin-left:-100%;
}

@media screen and (max-width: 900px){
.yuyuyu hr{
    width:100%;
    margin-left:0;
}
}

/* スローループ*/
.slowloop{
    background-color:#E3FFD2;
}

.slowloop .dotbox{
    border-color: #269DCA;
    color: #000000;
    background-color: #E1F4F9;
    border-width: 6px;
    border-style: solid;
    border-radius: 16px;
 }

.slowloop .color1{
    color: #61AA87;
}

.slowloop .color2{
    color:#269DCA;
}

.slowloop .color3{
    color:#70C947;
}

.slowloop .color4{
    color: #61AA87;
}

.slowloop .color5{
    color: #B4D580;
}

/* オッドタクシー */
.oddtaxi{
    color: #ffffff;
    background-color: #000000;
}

.oddtaxi .dotbox{
    border-color: #000000;
    color: #ffffff;
    background-color: #cc6666;
    border-width: 6px;
    border-style: solid;
 }

.oddtaxi .color1{
    color: #AE3937;
}

.oddtaxi .color2{
    color:#EFE035;
}

.oddtaxi .color3{
    color:#3B7436;
}

.oddtaxi .color4{
    color: #924290;
}

.oddtaxi .color5{
    color: #DF7C3B;
}


/* 観音寺睡蓮の苦悩 */
.kaeru .dotbox{
    border:12px solid #ec7088;
    background-color:#ffffff;
    border-radius: 16px;
}

.kaeru .color1{
    color:#ec7088;
}

.kaeru .color2{
    color:#1b3c7f;
}

.kaeru .color3{
    color:#3b487c;
}

.kaeru .linkbutton{
    background-color:#ec7088;
    border:1px solid #ffffff;
    color: #fff;
    width:80%;
}

.kaeru .linkbutton2{
    background-color:#ec7088;
}

.kaeru .linkbutton3{
    background-color:#ec7088;
    border:1px solid #fff;
    color: #fff;
}

.kaeru hr{
    border-top: 1px solid #ec7088;
    width:500%;
    margin-left:-100%;
}

@media screen and (max-width: 900px){
.kaeru hr{
    width:100%;
    margin-left:0;
}
}

/* きんモザ */
.kinmosa {
    background-color:#fff8b6;
}

.kinmosa .dotbox{
    border:3px solid #ffdc00;;
    background-color:#fffff6;
    color:#713328;
}

.kinmosa .color1{
    color:#ffcc00;;
}

.kinmosa .color2{
    color:#87cefa;
}

.kinmosa .color3{
    color:#ffaaaa;;
}

.kinmosa .color4{
    color:#bc88cc;
}

.kinmosa .color5{
    color:#66cc66;
}

.kinmosa .color6{
    color:#ffcc00;
}

.kinmosa hr{
    border-top: 1px solid #ffff66;
    width:500%;
    margin-left:-100%;
}

@media screen and (max-width: 900px){
.kinmosa hr{
    width:100%;
    margin-left:0;
}
}

/* スーパーカブ */
.supercub .dotbox{
    border:3px solid #ea5283;
    background-color:#ffeff4;
    color:#000000;
}

.supercub .color1{
    color:#ea5283;
}

.supercub .color2{
    color:#0000ff;
}

.supercub .color3{
    color:#00cc00;
}

.supercub .linkbutton,.supercub .linkbutton2{
    background-color: #ea5283;
}


/* 梨ラジ */
.nashiradio .color1{
    color:#ff6666;
}

.nashiradio .color2{
    color:#66ff66;
}

.nashiradio .color3{
    color:#6666ff;
}

/* シンデレラガールズ */
.cinderella .dotbox{
    border: 6px double #ff9999;
    background-color: #fffcfc;
    color: #000000
}

.cinderella .dotbox2{
    border: 6px double #3333ff;
    background-color: #fcfcff;
    color: #000000
}

.cinderella .dotbox3{
    border: 6px double #ffdd00;
    background-color: #fffeee;
    color: #000000
}

.cinderella .dotbox4{
    border: 6px double #33dd33;
    background-color: #eeffee;
    color: #000000
}

.cinderella .color1{
    color:#ff9999;
}

.cinderella .color2{
    color:#3333ff;
}

.cinderella .color3{
    color:#ffaa00;
}

.cinderella .color4{
    color:#00dd00;
}

.cinderella .color5{
    color:#dd00dd;
}

/* ココからプラグインのスマホでの表示修正 */
@media screen and (max-width: 900px){
.ec-productRole__kokokara_select{
    font-size:0.8em;
}
}

/* 販売種別ボックス */
.saleinfobox{
    width:60%;
    display:flex;
    flex-wrap: wrap;
    margin:auto;
    font-size:1.2em;
}
.saleinfoitem1,.saleinfoitem2,.saleinfoitem3{
    margin:auto 0.5%;
    text-align:center;
    height:3em;
    vertical-align: middle;
    line-height: 3em;
    border-radius:8px;
    padding:0 24px;
}

.saleinfoitem4{
    display:block;
    margin:auto 0.5%;
    text-align:center;
    height:3em;
    vertical-align: middle;
    line-height: 3em;
    border-radius:8px;
    color:#ffffff;
    padding:0 24px;
    background-color: #cc3333;
}

.saleinfoitem4:hover{
    background-color:#ffffcc;
}

@media screen and (max-width: 900px){
.saleinfobox{
    width:100%;
    display:flex;
    margin:auto;
    font-size:0.9em;
}

.saleinfoitem1,.saleinfoitem2,.saleinfoitem3,.saleinfoitem4{
    padding:0 8px;
}
}