@import url("https://fonts.googleapis.com/earlyaccess/roundedmplus1c.css");
* { box-sizing: border-box !important; }
p, blockquote, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, th, td, hr, form, fieldset, legend, input, button, textarea { margin: 0px; padding: 0px; }
ul, ol, li { list-style: none; }
a { color: rgb(55, 201, 9); }
html, body { font-family: "Rounded Mplus 1c", "ＭＳ Ｐゴシック", "MS PGothic"; width: 100%; height: auto; padding: 0px; margin: 0px; background-color: transparent; font-size: 100%; text-size-adjust: 100%; }
html { overflow: auto; background-image: url(""); background-attachment: fixed; background-repeat: no-repeat; background-position: center top; background-color: rgb(255, 237, 242); text-align: left; border-top: 5px solid rgb(254, 126, 157); }
body { width: 99.95%; max-width: 1920px; font-size: 16px; height: auto; position: relative; text-align: center; letter-spacing: 0px; margin: 0px auto; color: rgb(255, 120, 164); }
img { border: 0px; vertical-align: middle; }
p { margin-bottom: 1em; }
#acc { position: absolute; top: -8000px; }
#overlay { width: 100%; height: 100%; position: fixed; background-color: rgb(255, 255, 255); z-index: 100000000; left: 0px; top: 0px; }
#loading { width: 100%; height: 100%; position: fixed; z-index: 10000; display: block; background-color: rgb(255, 255, 255); text-align: center; line-height: 100%; top: 0px; left: 0px; }
#loading > img { max-width: 650px; }
#loading > div { position: relative; max-width: 160px; margin: 0px auto; border: 2px solid rgb(254, 126, 157); background-color: rgb(255, 255, 255); padding: 5px 20px; border-radius: 20px; }
#mainFrame { display: none; transform: rotate(0.028deg); }
h1, h2, h3 { display: inline; }
#mainFrame img { width: 100%; height: auto; }
.br_sp { display: block; }
input[type="checkbox"] { display: none; }
label { cursor: pointer; }
#menuchange + label { display: none; }
#pageTitle { display: block; position: relative; width: 100%; height: 50px; margin: 30px auto 0px; max-width: 1200px; border: 2px solid rgb(254, 126, 157); line-height: 50px; font-size: 30px; text-shadow: rgb(255, 255, 255) 0px 2px 0px, rgb(255, 255, 255) 2px 0px 0px, rgb(255, 255, 255) 0px -2px 0px, rgb(255, 255, 255) -2px 0px 0px, rgb(255, 255, 255) -2px -2px 0px, rgb(255, 255, 255) 2px -2px 0px, rgb(255, 255, 255) -2px 2px 0px, rgb(255, 255, 255) 2px 2px 0px; color: rgb(254, 126, 157); font-weight: bold; border-radius: 30px; background-color: rgba(255, 255, 255, 0.7); }
#pageTitle::before { content: "●"; position: absolute; left: 10px; }
#pageTitle::after { content: "●"; position: absolute; right: 10px; }
#pdl { width: 90%; max-width: 1250px; margin: 0.5em auto; cursor: pointer; }
html { background-color: rgb(255, 255, 255); }
img { width: 100%; height: auto; }
#mainImage { width: 100%; height: auto; position: relative; margin: 0px auto; }
#pcmain { display: block; }
#spmain { display: none; }
#spmain2 { display: none; }
#spMenu { display: none; }
#mainLogo { width: 28%; left: 36%; bottom: 0px; position: absolute; }
#mainLogo img { max-width: 540px; }
#mainLogo a { display: block; position: relative; bottom: -20px; }
#mainLogo b { display: block; width: 95%; background-color: rgba(255, 255, 255, 0.95); font-size: 1.5vw; padding: 8px; margin: 0px auto; border-radius: 50px; box-shadow: rgba(255, 159, 171, 0.4) 0px 0px 6px 3px; color: rgb(255, 120, 155); }
.cch1 { padding: 2% 5%; width: 90%; margin: 0px auto; font-size: 24px; line-height: 140%; font-weight: bold; color: rgb(255, 255, 255); text-shadow: rgb(255, 120, 164) 0px 2px 15px, rgb(255, 120, 164) 2px 0px 15px, rgb(255, 120, 164) 0px -2px 15px, rgb(255, 120, 164) -2px 0px 15px, rgb(255, 120, 164) -2px -2px 15px, rgb(255, 120, 164) 2px -2px 15px, rgb(255, 120, 164) -2px 2px 15px, rgb(255, 120, 164) 2px 2px 15px; }
@media screen and (max-width: 750px) {
  .cch1 { width: 100%; font-size: 3vw; padding: 2em; text-shadow: rgb(255, 120, 164) 0px 2px 10px, rgb(255, 120, 164) 2px 0px 10px, rgb(255, 120, 164) 0px -2px 10px, rgb(255, 120, 164) -2px 0px 10px, rgb(255, 120, 164) -2px -2px 10px, rgb(255, 120, 164) 2px -2px 10px, rgb(255, 120, 164) -2px 2px 10px, rgb(255, 120, 164) 2px 2px 10px; }
}
#att_last { padding: 2% 5%; width: 90%; margin: 0px auto; font-size: 18px; line-height: 180%; font-weight: bold; color: rgb(255, 120, 164); }
hr { margin: 1em; border-top: 3px dotted rgb(255, 120, 164); }
@media screen and (max-width: 750px) {
  #att_last { width: 100%; font-size: 3vw; padding: 2em; }
}
#contentBox { width: 95%; height: auto; margin: 0px auto; position: relative; display: flex; flex-wrap: wrap; justify-content: center; }
#contentBox ul { display: table-cell; width: 30%; height: 100%; margin: 0px 5px 20px; background-image: url("frame/shadow.png"); border-radius: 6px; position: relative; }
#contentBox ul .cblock { border: 3px solid rgb(255, 255, 255); box-shadow: rgba(255, 146, 173, 0.3) 0px 0px 4px 3px; border-radius: 6px; overflow: hidden; transition: all 0.5s ease 0s; margin: 6px; }
#contentBox ul .cblock b { display: block; width: 100%; padding: 2px 0px; background-color: rgb(255, 149, 175); color: rgb(255, 255, 255); font-size: 14px; font-weight: normal; }
#contentBox ul:hover .cblock { border: 3px solid rgb(255, 149, 175); box-shadow: rgba(255, 170, 180, 0.8) 0px 0px 8px 3px; transform: translate(-2px, -2px); }
#infomore { padding: 10px; background-color: rgb(255, 149, 175); color: rgb(255, 255, 255); font-weight: bold; font-size: 18px; width: 180px; margin: 0px auto; border-radius: 10px; }
#footer { margin-top: 20px; border-top: 2px solid rgb(255, 255, 255); box-shadow: rgb(254, 126, 157) 0px -3px 0px 0px; width: 100%; height: auto; background-image: url("frame/footer.png"); position: relative; padding: 10px; display: flex; flex-wrap: wrap; justify-content: center; }
#footer > li { width: 100%; }
#product { display: block; width: 45%; padding: 10px 15px; background-color: rgb(255, 255, 255); font-size: 1vw; margin: 10px auto 0px; border-radius: 10px; text-align: left; color: rgb(169, 49, 80); font-weight: 900; }
#product > li { width: 48%; display: inline-block; margin: 0.2% 0.5%; }
#product b { display: inline-block; width: 6em; padding: 3px 8px; background-color: rgb(255, 149, 175); margin: 2px; color: rgb(255, 255, 255); text-align: center; border-radius: 6px; }
#shop { width: 45%; padding: 10px 15px; background-color: rgb(255, 255, 255); font-size: 14px; margin: 10px auto 0px; border-radius: 10px; text-align: left; display: flex; flex-wrap: wrap; justify-content: center; }
#shop b { display: inline-block; width: 100%; padding: 3px 8px; background-color: rgb(255, 149, 175); color: rgb(255, 255, 255); font-weight: normal; border-radius: 6px; margin-bottom: 3px; }
#shop img { margin: 3px 6px; width: 100%; display: inline-block; max-width: 200px; }
#footer #att { width: 100%; color: rgb(255, 255, 255); margin-top: 20px; font-size: 14px; padding-top: 20px; border-top: 2px dotted rgba(255, 255, 255, 0.3); }
@media screen and (max-width: 750px) {
  .br_sp { display: none; }
  #pcmain { display: none; }
  #spmain, #spmain2 { display: block; }
  #spmain2 { display: block; position: absolute; left: 0px; top: 0px; opacity: 0; transition: all 3s ease 0s; }
  .part2 { opacity: 1 !important; }
  #mainLogo { width: 100%; left: 0px; padding: 0px 15%; text-align: center; top: auto; bottom: 1% !important; }
  #contentBox ul { width: 47%; display: inline-block; }
  #contentBox ul .cblock b { font-size: 1.5vw !important; }
  #footer #product { width: 95%; font-size: 2vw; padding: 5px; }
  #footer #product b { display: block; width: 100%; margin: 10px 0px 0px; }
  #footer #product b:first-child { margin-top: 0px; }
  #footer #shop { font-size: 2vw; padding: 5px; text-align: center; }
  #footer #shop b { text-align: left; }
  #footer #shop img { margin: 3px auto; }
  #footer #att { font-size: 2vw; }
  #footer, #shop { display: block; }
}