/* カスタマイズ用CSS */
body{
 font-size: 15px;
 color: #222;
}
a:hover{
 text-decoration: none;
}
ol, ul,li {
 margin: 0px;
 padding: 0px;
}
.ec-layoutRole{
 background: url(../img/bg.gif);
}
.ec-layoutRole .ec-layoutRole__contents{
 max-width: none;
 display: block;
}
.ec-borderedDefs{
 border: none;
}
.ec-borderedDefs dl {
 display: block;
}
.ec-borderedDefs dd {
 width: auto;
}
#page_product_detail .ec-layoutRole__contents{
 margin-top:50px;
}
#header{
 position: relative;
 padding-top:15px;
 padding-bottom: 15px;
}
#header #shopttl{
 margin: 0px;
 padding: 0px;
}
#header #shopttl img{
 max-width: 416px;
 width: 100%;
 height: auto;
}
#header .ec-headerNaviRole{
 padding: 0px;
 margin: 0px;
 max-width:none;
 align-items: flex-end;
}
#header .ec-headerNaviRole__left{

}
#header .ec-headerNaviRole__right{
 align-items: flex-end;
 vertical-align: bottom;
}
#header .ec-headerNaviRole__nav{
 margin-right: 15px;
 font-weight: bold;
}
#header .ec-headerNav .icon{
 height: 15px;
 width: auto;
}
#header .ec-headerNav__itemIcon {
 font-size: 15px;
 margin: 0px;
}
#header .ec-headerNav__item{
 font-size: initial;
 margin-top: 5px;
 margin-right: 10px;
}
#header .ec-headerNav__item:last-child{
 margin-right: 0px;
}
#header .ec-headerNav__item a{
 display: block;
 position: relative;
}
#header .ec-headerNav__item a:before{
 transition: .5s;
 content: "";
 display: block;
 width: 100%;
 height: 2px;
 position: absolute;
 bottom: -2px;
 left: 0px;
 background: #000;
 opacity: 0;
 transform: scaleX(0);
}
#header .ec-headerNav__item a:hover:before{
 opacity: 1;
 transform: scaleX(1);
}
#header .ec-headerNav__itemLink{
 margin-right: 0px;
}
#header .contact{
 text-align: center;
 font-weight: bold;
 min-width: 160px;
}
#header .contact p{
 margin: 0px
}
#header .contact .link a{
 color: #000;
 background: #ccc;
 display: block;
 text-decoration: none;
 font-size: 13px;
 padding:4px 10px;
 margin-bottom: 5px;
 transition: .5s;
}
#header .contact .link a:hover{
 background: #000;
 color: #fff;
}
#header .contact .tell a{
 font-weight: bold;
 color: #931019;
 display: inline-block;
 font-size: 20px;
 position: relative;
 padding-left: 25px;
}
#header .contact .tell a:before{
 content: "";
 display: block;
 width: 20px;
 height: 20px;
 background: url(../img/icon_tell.jpg) no-repeat center center;
 background-size: cover;
 position: absolute;
 left: 0px;
 top: 3px;
}
#header .contact .time{
 font-size: 13px;
 letter-spacing: .15em;
 color: #000;
 margin-bottom: 0px;
}
#header .officialLink{
 position: absolute;
 top: 15px;
 right: 190px;
 display: inline-block;
 background: #222;
 color: #fff;
 padding: 3px 3em;
 font-size: 14px;
 letter-spacing: .1em;
 transition:.5s;
}
#header .officialLink:hover{
 background: #ccc;
 color: #222;
}
#main .homeimg{
 text-align: center;
}
#main h1,
#main h2,
#main h3 {
 margin-top: 0px;
 margin-bottom: 0px;
 font-weight: normal;
}
#main .homeimg img{
 width: 100%;
 height: auto;
}
#footer .ec-footerRole{
 background: none;
 border-top: none;
 padding: 0px;
 margin-top: 35px;
}
#footer .ec-footerNavi__link{
 border-right: solid 1px #fff;
}
#footer .ec-footerNavi__link:last-child{
 border:none;
}
#footer .ec-footerNavi__link a{
 text-decoration: none;
 display: block;
}
#footer .ec-footerTitle__copyright{
 margin-top: 25px;
 border-top: solid 1px #ccc;
 padding: 20px;
}
#footer .ec-footerTitle{
 margin: 0px;
 padding: 0px;
}
#footer .ec-footerRole__inner{
 max-width: none;
 margin: 0px;
 padding: 0px
}
.mincho{
 font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
}
.maxWidth{
 max-width: 1200px;
 margin-left: auto;
 margin-right: auto;
 padding-left: 15px;
 padding-right: 15px;
}
.maxWidth2{
 max-width: 800px;
 margin-left: auto;
 margin-right: auto;
 padding-left: 15px;
 padding-right: 15px;
}
.maxWidth3{
 max-width: 600px;
 margin-left: auto;
 margin-right: auto;
 padding-left: 15px;
 padding-right: 15px;
}
img.sizeAuto{
 max-width: 100%;
 height: auto;
}
.sizeAuto img{
 max-width: 100%;
 height: auto;
}
.lh1_5em{
 line-height: 1.5em;
}
.lh2em{
 line-height: 2em;
}
.tCenter{
 text-align: center;
}
.tLeft{
 text-align: left;
}
.tRight{
 text-align: right;
}
.dNone{
 display: none;
}
.dBlock{
 display: block;
}
.dIBlock{
 display: inline-block;
}
.mt1em{
 margin-top: 1em !important;
}
.mt2em{
 margin-top: 2em !important;
}
.mt3em{
 margin-top: 3em !important;
}
.mt50{
 margin-top: 50px !important;
}
.mt75{
 margin-top: 75px !important;
}
.mt100{
 margin-top: 100px !important;
}
.mb1em{
 margin-bottom: 1em !important;
}
.mb2em{
 margin-bottom: 2em !important;
}
.mb3em{
 margin-bottom: 3em !important;
}
.mb50{
 margin-bottom: 50px !important;
}
.mb75{
 margin-bottom: 75px !important;
}
.mb100{
 margin-bottom: 100px !important;
}
.pt1em{
 padding-top: 1em !important;
}
.pt2em{
 padding-top: 2em !important;
}
.pt3em{
 padding-top: 3em !important;
}
.pt50{
 padding-top: 50px !important;
}
.pt75{
 padding-top: 75px !important;
}
.pt100{
 padding-top: 100px !important;
}
.pb1em{
 padding-bottom: 1em !important;
}
.pb2em{
 padding-bottom: 2em !important;
}
.pb3em{
 padding-bottom: 3em !important;
}
.pb50{
 padding-bottom: 50px !important;
}
.pb75{
 padding-bottom: 75px !important;
}
.pb100{
 padding-bottom: 100px !important;
}
.pl1_5em{
 padding-left: 1.5em;
}
.bold{
 font-weight: bold;
}
.font-ss{
 font-size: 50%;
}
.font-s{
 font-size: 75%;
}
.font-m{
 font-size: 100%;
}
.font-l{
 font-size: 140%;
}
.font-ll{
 font-size: 200%;
}
.ls1{
 letter-spacing: .1em;
}
.ls2{
 letter-spacing: .2em;
}
.black,
.black:hover,
.black:visited{
 color: #222222;
}
.white,
.white:hover,
.white:visited{
 color: #ffffff;
}
.red {
 color: #931019;
}
.bgGray{
 background: #2c2d2e;
}
.styleList1{
 list-style: none;
 display: flex;
 justify-content: space-between;
}
.styleList1 li{
 width: 23%;
}
.styleList1 li .price{
 text-align: right;
}
.styleList1 li .price span{
 display: inline-block;
 background: #931019;
 padding: 5px 8px;
}
.styleList1 li .text{
 position: relative;
 padding-left: 1.5em;
}
.styleList1 li .text:before{
 width: 1em;
 height: 1em;
 content: "";
 display: block;
 position: absolute;
 left: 0px;
 top: 5%;
 background: #931019;
}
.styleList2{
 list-style: none;
}
.styleList2 li{
 margin-bottom: 40px;
}
.styleList2 li .flex{
 display: flex;
}
.styleList2 li .flex .photo{
 width: 50%;
}
.styleList2 li .flex .photo img{
 width: 100%;
 height: auto;
}
.styleList2 li .flex .text{
 padding-left: 30px;
 line-height: 2em;
 width: 50%;
}
.styleList2 .ttl1{
 background: url(../img/ttlicon1.png) no-repeat left center;
 background-size: 3em auto;
 padding-left: 4em;
 height: 2em;
 display: flex;
 align-items: center;
}
.styleList2 .ttl2{
 background: url(../img/ttlicon2.png) no-repeat left center;
 background-size: 3em auto;
 padding-left: 4em;
 height: 2em;
 display: flex;
 align-items: center;
}
.styleList2 .ttl3{
 background: url(../img/ttlicon3.png) no-repeat left center;
 background-size: 3em auto;
 padding-left: 4em;
 height: 2em;
 display: flex;
 align-items: center;
}
.styleTtl1{
 background: #2c2d2e;
 text-align: center;
 padding: 10px;
 color: #fff;
 width: 80%;
 margin-left: auto;
 margin-right: auto;
}
.styleTable {
 border-collapse: collapse;
 border-spacing: 0;
}
.styleTable th,
.styleTable td{
 padding: 10px;
 border: solid 1px #ddd;
}
.styleTable th{
 background: #eee;
 min-width: 6em;
 text-align: center;
}
.styleTable td{
 background: #fff;
 min-width: 5em;
 text-align: center;
}
.overScrollX{
 overflow-x: auto;
 width: 100%;
}
.font_vertical{
 -ms-writing-mode: tb-rl;
 writing-mode: vertical-rl;
}
.font_horizon{
 writing-mode: horizontal-tb;
 margin-bottom: -.6em;
}
#page_homepage #sec_maininfo1{
 background: url(../img/maininfo1_bg.jpg) no-repeat center center;
 background-size: cover;
 width: 100%;
 padding: 80px 15px 120px;
 min-height: 30vw;
}
#page_homepage #sec_maininfo1 .inner{
 background-size: 100px auto;
 display: flex;
 justify-content: center;
 position: relative;
}
#page_homepage #sec_maininfo1 .inner:after{
 content: "";
 display: block;
 width: 183px;
 height: 96px;
 background: url(../img/wave_deco1.png) no-repeat center center;
 background-size:cover;
 position: absolute;
 bottom: -35px;
 left: 43%;
}
#page_homepage #sec_maininfo1 .inner .textArea{
 margin-right: -30%;
 line-height: 2.5em;
}
#page_homepage #sec_maininfo1 .inner .textArea h3{
 position: relative;
 z-index: 1;
 line-height: 2.5em;
}
#page_homepage #sec_maininfo1 .inner .text{
 position: relative;
 z-index: 1;
}
#page_homepage #sec_maininfo2{
 background: url(../img/maininfo2_bg.jpg) no-repeat center center;
 background-size: cover;
 width: 100%;
 padding: 80px 15px 120px;
 min-height: 30vw;
}
#page_homepage #sec_maininfo2 .inner{
 background-size: 100px auto;
 display: flex;
 justify-content: center;
 position: relative;
}
#page_homepage #sec_maininfo2 .inner:after{
 content: "";
 display: block;
 width: 131px;
 height: 82px;
 background: url(../img/wave_deco2.png) no-repeat center center;
 background-size:cover;
 position: absolute;
 bottom: -20px;
 left: 40%;
}
#page_homepage #sec_maininfo2 .inner .text{
 position: relative;
 z-index: 1;
}
#page_homepage #sec_maininfo2 .inner .textArea{
 margin-left: -30%;
 line-height: 2.5em;
}
#page_homepage #sec_maininfo2 .inner .textArea h3{
 position: relative;
 z-index: 1;
 line-height: 2.5em;
}
#page_homepage #hugusashi .textArea{
 border-top: solid 18px #0f4852;
 background: #fff url(../img/top_hugu.png) no-repeat right center;
 background-size: 65% auto;
 min-height: 420px;
 position: relative;
}
#page_homepage #hugusashi .textArea .info{
 width: 45%;
}
#page_homepage #hugusashi .textArea .info:before{
 position: absolute;
 content: "";
 display: block;
 width: 200px;
 height: 200px;
 background: url(../img/top_hugu_deco.png) no-repeat center center;
 background-size: contain;
 left: 45px;
 bottom: 55px;
 z-index: 0;
}
#page_homepage #hugusashi .textArea .info span{
 position: relative;
}
#page_homepage #hugutiri .textArea{
 border-top: solid 18px #242f63;
 background: #fff;
}
#page_homepage #huguhire .textArea{
 border-top: solid 18px #258baa;
 background: #fff;
}
#page_homepage #iteminfo .sttl{
 position: relative;
 padding-left: 1.5em;
 font-size: 110%;
}
#page_homepage #iteminfo .sttl:before{
 content: "";
 display: block;
 width: 1em;
 height: 1em;
 background: #e9ced0;
 position: absolute;
 left: 0px;
 top:0.5em;
}
#page_homepage .optionMsg{
 background: #930e18;
 border-bottom: solid 5px #222222;
 text-align: center;
 color: #fff;
 padding: 10px;
}


@media screen and (max-width:768px) {
 body{
  font-size: 13px;
 }
 #header {
     padding-top: 4em;
 }
 #header .ec-headerNaviRole{
  display: block;
 }
 #header #shopttl{
  margin-top: 30px;
  text-align: center;
 }
 #header #shopttl a{
  display: inline-block;
  max-width: 250px;
 }
 #header .ec-headerNaviRole__left{
  width: auto;
 }
 #header .ec-headerNaviRole__right{
  height: 0px;
  display: block;
  text-align: center;
  width: auto;
 }
 #header .ec-headerNaviRole__nav{
  margin-right: 15px;
  font-weight: bold;
 }
 #header .ec-headerNav{
  position: absolute;
  right: 10px;
  top: 5px;
 }
 #header .ec-headerNav .icon{
  height: 15px;
  width: auto;
 }
 #header .ec-headerNav__itemIcon {
  font-size: 15px;
  margin: 0px;
 }
 #header .ec-headerNav__item{
  font-size: initial;
  margin-right: 15px;
 }
 #header .ec-headerNav__item a{
  display: block;
  position: relative;
 }
 #header .ec-headerNav__item a:before{
  transition: .5s;
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  position: absolute;
  bottom: -2px;
  left: 0px;
  background: #000;
  opacity: 0;
  transform: scaleX(0);
 }
 #header .ec-headerNav__item a:hover:before{
  opacity: 1;
  transform: scaleX(1);
 }
 #header .ec-headerNav__itemLink{
  margin-right: 0px;
 }
 #header .contact{
  text-align: center;
  font-weight: bold;
 }
 #header .contact .link a{
  color: #000;
  background: #ccc;
  display: inline-block;
  text-decoration: none;
  font-size: 13px;
  padding:4px 10px;
  margin-bottom: 5px;
  transition: .5s;
 }
 #header .contact .link a:hover{
  background: #000;
  color: #fff;
 }
 #header .contact .tell a{
  font-weight: bold;
  color: #931019;
  display: inline-block;
  font-size: 20px;
  position: relative;
  padding-left: 25px;
 }
 #header .contact .tell a:before{
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  background: url(../img/icon_tell.jpg) no-repeat center center;
  background-size: cover;
  position: absolute;
  left: 0px;
  top: 3px;
 }
 #header .contact .time{
  font-size: 13px;
  letter-spacing: .15em;
  color: #000;
 }
 #header .officialLink{
 position: static;
 top: 0px;
 right: 0px;
 display: block;
 padding: 3px;
 text-align: center;
 font-size: 14px;
}
 #footer .ec-footerRole{
  background: none;
  border-top: none;
  padding: 0px;
  margin-top: 35px;
 }
 #footerlogo{
  max-width: 200px;
  margin-left: auto;
  margin-right: auto;
 }
 #footer .ec-footerNavi__link{
  border-right: solid 1px #fff;
 }
 #footer .ec-footerNavi__link:last-child{
  border:none;
 }
 #footer .ec-footerNavi__link a{
  text-decoration: none;
  display: block;
 }
 #footer .ec-footerTitle__copyright{
  margin-top: 15px;
  border-top: none;
  padding: 10px 0px 25px;
 }
 #footer .ec-footerTitle{
  margin: 0px;
  padding: 0px;
 }
 #footer .ec-footerRole__inner{
  max-width: none;
  margin: 0px;
 }
 .mt1em{
  margin-top: 0.5em !important;
 }
 .mt2em{
  margin-top: 1em !important;
 }
 .mt3em{
  margin-top: 1.5em !important;
 }
 .mt50{
  margin-top: 25px !important;
 }
 .mt75{
  margin-top: 37.5px !important;
 }
 .mt100{
  margin-top: 50px !important;
 }
 .mb1em{
  margin-bottom: 0.5em !important;
 }
 .mb2em{
  margin-bottom: 1em !important;
 }
 .mb3em{
  margin-bottom: 1.5em !important;
 }
 .mb50{
  margin-bottom: 25px !important;
 }
 .mb75{
  margin-bottom: 37.5px !important;
 }
 .mb100{
  margin-bottom: 50px !important;
 }
 .pt1em{
  padding-top: 0.5em !important;
 }
 .pt2em{
  padding-top: 1em !important;
 }
 .pt3em{
  padding-top: 1.5em !important;
 }
 .pt50{
  padding-top: 25px !important;
 }
 .pt75{
  padding-top: 37.5px !important;
 }
 .pt100{
  padding-top: 50px !important;
 }
 .pb1em{
  padding-bottom: 0.5em !important;
 }
 .pb2em{
  padding-bottom: 1em !important;
 }
 .pb3em{
  padding-bottom: 1.5em !important;
 }
 .pb50{
  padding-bottom: 25px !important;
 }
 .pb75{
  padding-bottom: 37.5px !important;
 }
 .pb100{
  padding-bottom: 50px !important;
 }
 .font-l{
  font-size: 130%;
 }
 .font-ll{
  font-size: 180%;
 }
 .sp-tCenter{
  text-align: center;
 }
 .sp-tLeft{
  text-align: left;
 }
 .sp-tRight{
  text-align: right;
 }
 .sp-dNone{
  display: none;
 }
 .sp-dBlock{
  display: block;
 }
 .sp-dIBlock{
  display: inline-block;
 }
 .sp-pad{
  padding: 15px;
 }
 .sp-font-m{
  font-size: 100%;
 }
 .sp-font-l{
  font-size: 120%;
 }
 .sp-pt1em{
  padding-top: 1em !important;
 }
 .sp-pt2em{
  padding-top: 2em !important;
 }
 .sp-pt3em{
  padding-top: 3em !important;
 }
 .styleList1{
  list-style: none;
  text-align: center;
  display: block;
  justify-content: space-between;
 }
 .styleList1 li{
  text-align: center;
  vertical-align: top;
  width: auto;
  margin-bottom: 20px;
 }
 .styleList1 li:last-child{
  margin-bottom: 0px;
 }
 .styleList1 li .text{
  display: inline-block;
  padding-left: 1.5em;
 }
 .styleList1 li .price{
  text-align: center;
 }
 .styleList2{
  list-style: none;
 }
 .styleList2 li{
  margin-bottom: 20px;
 }
 .styleList2 li .flex{
  display: block;
 }
 .styleList2 li .flex .photo{
  width: auto;
 }
 .styleList2 li .flex .photo img{
  width: 100%;
  height: auto;
 }
 .styleList2 li .flex .text{
  padding-left: 0px;
  line-height: 2em;
  width: auto;
 }
 .styleList2 .ttl1{
  background: url(../img/ttlicon1.png) no-repeat left center;
  background-size: 2em auto;
  padding-left: 3em;
  height: 2em;
  display: flex;
  align-items: center;
 }
 .styleList2 .ttl2{
  background: url(../img/ttlicon2.png) no-repeat left center;
  background-size: 2em auto;
  padding-left: 3em;
  height: 2em;
  display: flex;
  align-items: center;
 }
 .styleList2 .ttl3{
  background: url(../img/ttlicon3.png) no-repeat left center;
  background-size: 2em auto;
  padding-left: 3em;
  height: 2em;
  display: flex;
  align-items: center;
 }
 .font_vertical{
  writing-mode: horizontal-tb;
 }
 #page_homepage #sec_maininfo1{
  background: url(../img/maininfo1_bg.jpg) no-repeat center center;
  background-size: cover;
  width: 100%;
  padding: 30px 15px 50px;
  min-height: 0px;
 }
 #page_homepage #sec_maininfo1 .inner{
  background-size: 100px auto;
  display: block;
  text-align: center;
 }
 #page_homepage #sec_maininfo1 .inner:after{
  width: 90px;
  height: 45px;
 }
 #page_homepage #sec_maininfo1 .inner .textArea{
  margin-right: 0%;
  line-height: 2em;
  background: rgba(255,255,255,0.65);
  text-shadow:1px 1px 3px rgba(255,255,255,0.7);
  padding: 15px;
  display: block;
 }
 #page_homepage #sec_maininfo1 .inner .text{
  letter-spacing: .2em;
 }
 #page_homepage #sec_maininfo1 .inner .textArea h3{
  line-height: 1.5em;
  margin-bottom: 15px;
  font-size: 18px;
 }
 #page_homepage #sec_maininfo2{
  background: url(../img/maininfo2_bg.jpg) no-repeat center center;
  background-size: cover;
  width: 100%;
  padding: 30px 15px 50px;
  min-height: 0px;
 }
 #page_homepage #sec_maininfo2 .inner{
  background-size: 100px auto;
  display: block;
  text-align: center;
 }
 #page_homepage #sec_maininfo2 .inner:after{
  width: 65px;
  height: 40px;
 }
 #page_homepage #sec_maininfo2 .inner .textArea{
  margin-left: 0%;
  line-height: 2em;
  background: rgba(255,255,255,0.65);
  text-shadow:1px 1px 3px rgba(255,255,255,0.7);
  padding: 15px;
  display: block;
 }
 #page_homepage #sec_maininfo2 .inner .text{
  letter-spacing: .2em;
 }
 #page_homepage #sec_maininfo2 .inner .textArea h3{
  line-height: 1.5em;
  margin-bottom: 15px;
  font-size: 18px;
 }
 #page_homepage #hugusashi .textArea{
  border-top: solid 18px #0f4852;
  background: #fff url(../img/top_hugu_sp.jpg) no-repeat center center;
  background-size: cover;
  min-height: 0px;
  padding:20px;
  position: relative;
  text-shadow:1px 1px 2px rgba(255,255,255,0.7);
  overflow: hidden;
 }
 #page_homepage #hugusashi .textArea .inner{
  background: rgba(255,255,255,0.65);
  padding: 15px;
 }
 #page_homepage #hugusashi .textArea .inner h4{
  margin-top: 0px !important;
 }
 #page_homepage #hugusashi .textArea .info{
  width: auto;
 }
 #page_homepage #hugusashi .textArea .info:before{
  position: absolute;
  content: "";
  display: block;
  width: 120px;
  height: 120px;
  background: url(../img/top_hugu_deco.png) no-repeat center center;
  background-size: contain;
  left:-30px;
  bottom: 0px;
  z-index: 0;
 }
 #page_homepage #hugusashi .textArea .info span{
  position: relative;
  display: block;
 }
 #page_homepage #hugutiri .textArea{
  border-top: solid 18px #242f63;
  background: #fff;
 }
 #page_homepage #huguhire .textArea{
  border-top: solid 18px #258baa;
  background: #fff;
 }
 #page_homepage #iteminfo .sttl{
  position: relative;
  padding-left: 1.5em;
  font-size: 110%;
 }
 #page_homepage #iteminfo .sttl:before{
  content: "";
  display: block;
  width: 1em;
  height: 1em;
  background: #e9ced0;
  position: absolute;
  left: 0px;
  top:0.5em;
 }
 #page_homepage .optionMsg{
  background: #930e18;
  border-bottom: solid 5px #222222;
  text-align: center;
  color: #fff;
  padding: 10px;
 }
}