@charset "utf-8";
/* CSS Document */
/* TOP */
@font-face {
font-family: 'NewTegomin-Regular';
src: url(common/font/NewTegomin-Regular.ttf);
}
@font-face {
font-family: 'ShipporiMincho-ExtraBold';
src: url(common/font/ShipporiMincho-ExtraBold.ttf);
}

.cookie-consent {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: fixed;
    bottom: 0;
    width: 100%;
    font-size: 12px;
    color: #fff;
    background: rgba(0,0,0,.7);
    padding: 1.2em;
    box-sizing: border-box;
    visibility: hidden;
	z-index: 1;
  }
  .cookie-consent.is-show {
    visibility: visible;
  }
  .cookie-consent a {
    color: #fff !important;
  }
  .cookie-agree {
    color: #fff;
    background: dodgerblue;
    padding: .5em 1.5em;
  }
  .cookie-agree:hover {
    cursor: pointer;
  }
  /* パッと消える */
  .cc-hide1 {
    display: none;
  }
  /* ゆっくり消える */
  .cc-hide2 {
    animation: hide 1s linear 0s;
    animation-fill-mode: forwards;
  }
  @keyframes hide {
    from {
      opacity: 1;
    }
    to {
      opacity: 0;
      visibility: hidden;
    }
  }
a:link {
color: #fff;
}
  /* メディアクエリ */
  @media screen and (max-width: 600px) {
    .cookie-consent {
      flex-direction: column;
    }
    .cookie-text {
      margin-bottom: 1em;
    }
  }

/**/
.popup {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  opacity: 0;
  visibility: hidden;
  transition: .3s;
}
.popup.is-show {
  opacity: 1;
  visibility: visible;
}
.popup-inner {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  width: 100%;
  max-width: 1000px;
  background-color: #000;
  z-index: 2;
  border-radius: 3px;
  text-align: center;
  font-size: 80%;
  color: #999;
}
.popup-inner iframe {
  width: 100%;
  border-radius: 3px 3px 0 0;
}
div#modalCloseCloss:hover {
    opacity: 0.7;
}
.modalCloseButton {
    position: absolute;
    left: 92%;
    top: -48px;
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    cursor: pointer;
}
.lineClose {
    display: inline-block;
    vertical-align: middle;
    color: #FFF;
    line-height: 1;
    width: 2rem;
    height: 0.2rem;
    background: currentColor;
    border-radius: 0.1rem;
    position: relative;
    transform: rotate(45deg);
}
.lineClose::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: inherit;
  border-radius: inherit;
  transform: rotate(90deg);
}
.black-background {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,.8);
  z-index: 1;
  cursor: pointer;
}
.modalBottom {
    padding: 22px 30px;
}
.modalBottom p {
    margin: 0;
}
/**/

 @media screen and (min-width : 901px) {/* large */

#headerbox{
background: url("img/header.png") no-repeat;
background-size: contain;
width: 100%;
height: 80px;
}

#btnlang00{
max-width: 1280px;
height: 80px;
padding: 1.7% 0 0 7.9%;
text-align: left
}

#btnlang00 img{
width: 12.5%;
}

#btnlang01{
max-width: 1280px;
height: 80px;
padding: 1.7% 0 0 7.9%;
text-align: left
}

#btnlang01 img{
width: 12.5%;
}

#footter {
background-color: #000;
padding: 2em 0 1em 0;
}

#footerbox{
text-align: center;
background-color: #000;
}

#footerbtn {
margin: 0 auto 0 auto;
}

#footeracq {
max-width: 100%;
height:auto;
padding: 0 0 0 0;
}

#footeranx {
max-width: 100%;
height:auto;
padding: 0 0 1.5% 1.5%;
}

#footeritem002 {
max-width: 100%;
height:auto;
padding: 0 1% 2% 0;
}
#footeritem003 {
max-width: 100%;
height:auto;
padding: 0 0 2% 0;
}
#footeritem004 {
max-width: 100%;
height:auto;
padding: 0 0 1% 0;
}

#copy {
color: #fff;
text-align: center;
margin: 1% 0 3% 0;
}

#copy p {
margin: 0;
font-size: 90%;
}

#pvbox {
max-width: 900px;
margin: 0 auto 6% auto;
}

#pv {
max-width: 890px;
margin: 0 auto 0 auto;
}


#movie {
position: relative;
width: 100%;
padding-top: 56.25%;
margin: 7% auto 2% auto;
border: 7px solid #3d0000;
background: #3d0000; 
}

#movie iframe {
position: absolute;
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
-webkit- transform: translateY(-50%) translateX(-50%);
width: 100%;
height: 100%;
margin: auto;
}

#pvbox02 {
max-width: 900px;
margin: 0 auto 3% auto;
}

#pv02 {
max-width: 890px;
margin: 0 auto 0 auto;
}

#pv02 p {
color: #ccc;
font-size: 90%;
text-align: center;
margin: 0 0 0 0;
}


#movie02 {
position: relative;
width: 100%;
padding-top: 56.25%;
margin: 7% auto 0 auto;
border: 7px solid #3d0000;
background: #3d0000; 
}

#movie02 iframe {
position: absolute;
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
-webkit- transform: translateY(-50%) translateX(-50%);
width: 100%;
height: 100%;
margin: auto;
}

/*---↓↓↓ txt01  ↓↓↓---*/
#txt01 {
margin: 0 auto 1% auto;
width: auto;
text-align: center;
}
#txt01 img {
max-width: 80%;
}

#txt01_box {
background: rgba(40,21,21,0.8);
padding: 4%;
color: #fff;
text-align: center;
max-width: 80%;
margin: 0 auto 0 auto;
font-size: 150%;
border: 2px solid #625147;
line-height: 170%;
font-family: 'NewTegomin-Regular';
}

#comicbox {
padding: 4%;
color: #fff;
text-align: center;
max-width: 80%;
margin: 0 auto 0 auto;
font-size: 150%;
line-height: 170%;
font-family: 'NewTegomin-Regular';
}

#comicttl {
font-size: 170%;
margin: 0 0 3% 0;
color: #f0f0f0;
letter-spacing : 2px;
text-shadow: 4px  4px 5px #c14025,-4px  4px 5px #c14025,4px -4px 5px #c14025,-4px -4px 5px #c14025,4px  0px 5px #c14025,0px  4px 5px #c14025,-4px  0px 5px #c14025,0px -4px 5px #c14025;
}

#comictxt{
margin: 0 0 3% 0;
}

comicbox

.sumst {
width: 100%;
margin:  0 auto 0 auto;
text-align: center;
}

.sumst img {
}

.sumst li {
display: inline-block;
margin: 0 2% 2% 2%;
}

#txt02 {
margin: 3% auto 3% auto;
width: auto;
text-align: center;
}
#txt02 img {
max-width: 60%;
}




/*---↑↑↑ txt01 ↑↑↑ ---*/

/*---↓↓↓ story  ↓↓↓---*/
@font-face {
font-family: 'NewTegomin-Regular';
src: url(common/font/NewTegomin-Regular.ttf);
}


#story {
background: #000;
text-align: center;
font-family: 'NewTegomin-Regular';
color: #fff;
font-size: 200%;
padding: 2em 0 2em 0;
}

#story001_00 {
width: 100%;
max-width: 80%;
margin: 0 auto 5% auto;
padding: 5% 0 0 0;
}

.test001 {
opacity: 0;
}

#story001 {
width: 100%;
font-size: 2vw;
margin: 0 auto 0 auto;
padding: 0 0 0 0;
line-height: 200%;
}

#storybk003 {
max-width: 1200px;
margin: 0 auto 0 auto;
}

#story003_00 {
width: 100%;
max-width: 80%;
margin: 0 auto 0 auto;
}




/*---↑↑↑ story ↑↑↑ ---*/
/*---↓↓↓ system  ↓↓↓---*/

#system {
text-align: center;
margin: 0 0 5% 0; 
}

#shokudou_box {
justify-content: space-around;
display: flex;
max-width: 900px;
flex-wrap : wrap; 
margin: 0 auto 0 auto;
}

#shokudou_box img {
max-width: 300px;
}

.system_txt {
font-family: 'NewTegomin-Regular';
color: #fff;
font-size: 150%;
text-align: center;
width: 1000px;
text-shadow: 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1);
margin: 0 auto 3% auto;
}

/*---↑↑↑ system ↑↑↑ ---*/

/*---↓↓↓ sakyu  ↓↓↓---*/

#sakyu001{
margin: 0 0 5% 0; 
}

#sakyu001 img {
display: inline-block;
width: 100%;
max-width: 550px;
vertical-align: -850%;
}

#sakyu001 p {
display: inline-block;
font-family: 'NewTegomin-Regular';
font-weight: bold;
color: #000;
font-size: 170%;
text-align: center;
text-shadow: 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1);
line-height: 200%;
}


#sakyu002{
}
#sakyu002 p {
display: inline-block;
font-family: 'NewTegomin-Regular';
font-weight: bold;
color: #000;
font-size: 170%;
text-align: center;
text-shadow: 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1);
line-height: 200%;
display: inline-block;

}

#sakyu002 img {
width: 100%;
max-width: 550px;
vertical-align: -850%;
}

#sakyu003{
}

#sakyu003 img {
display: inline-block;
width: 100%;
max-width: 550px;
vertical-align: -850%;
}

#sakyu003 p {
display: inline-block;
font-family: 'NewTegomin-Regular';
font-weight: bold;
color: #000;
font-size: 170%;
text-align: center;
text-shadow: 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1);
line-height: 200%;
}

.sp {
display: none;
}

.pc {
}

/*---↑↑↑ sakyu ↑↑↑ ---*/



#za000 {
max-width: 100%;
margin: 1% 0 1% 0;
}

#za001 {
max-width: 100%;
margin: 1% 0 3% 0;
}

#za002 {
max-width: 100%;
margin: 1% 0 3% 0;
}

#za003 {
max-width: 100%;
margin: 0 0 3% 0;
}

#za004 {
max-width: 30%;
margin: 0% 1% 0 1%;
width: 100%;
}

#za005 {
max-width: 30%;
margin: 1% 0 0 0;
width: 100%;
}

#dl01 {
max-width: 40%;
margin: 19% 2% 0 2%;
width: 100%;
}

#dl02 {
max-width: 40%;
margin: 19% 2% 0 2%;
width: 100%;
}

#dl03 {
max-width: 40%;
margin: 2% 2% 0 2%;
width: 100%;
}

#za006 {
max-width: 100%;
margin: 3% 0 3% 0;
}

#za007 {
max-width: 100%;
}

#za008 {
max-width: 100%;
margin: 0 2% 0 2%;
}

#za009 {
max-width: 100%;
margin: 0 2% 0 2%;
}

#za010 {
max-width: 100%;
margin: 3% 0 3% 0;
}

/*---↓↓↓ topmain  ↓↓↓---*/

#topmain {
padding: 0.5em 0 0 1.7em;
font-size: 2vw;
background-image: url("img/maintop.jpg");
font-family: 'ShipporiMincho-ExtraBold';
font-weight: 700;
color: #fff;
text-shadow: 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1);
background-size:contain;
background-repeat: no-repeat;
height: 100%;
text-align: left;
}

#topmain img {
margin: 0 0 28% 0;
width: 25%;
}

/*---↓↓↓ product  ↓↓↓---*/

#productbox {
padding: 1.5em 0 0 0;
font-size: 2vw;
/*background*/
font-family: 'ShipporiMincho-ExtraBold';
font-weight: 700;
color: #fff;
text-shadow: 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1);
background-size:contain;
background-repeat: no-repeat;
text-align: center;

}

#productbox table {
margin: 0 auto 5% auto;
width: 50%;

}
#productbox td {
padding: 1%;
text-align: left;
white-space: nowrap;
vertical-align: top;
}

#productttl {
text-align: center;
margin: 0 auto 0 auto;
}

#productttl img {
width: 100%;
max-width: 20%;
}

#product_txt_box {
width: 100%;
background:rgba(39,12,6, 0.7);
padding: 1em 0 1em 0;
}

#product_txt_box table {
max-width: 80%;
}

#product_txt_box table td {
padding: 0 0 0.5em 1em;
}

#product_btnbox img{
max-width: 20%;
}


#gomanual {
margin: 3% 0 0 0;
}

#gomanual img {
width: 100%;
max-width: 25%;
}

#guideline {
background: rgba(40,21,21,0.8);
padding: 0.5em 2em 0.5em 2em;
color: #fff;
text-align: left;
max-width: 65%;
margin: 3% auto 0 auto;
font-size: 90%;
border: 2px solid #625147;
}

#guideline h4 {
margin: 0 0 -0.5em 0;
}

#guideline h3 {
font-size: 150%;
text-align:  center;
}

#guideline img {
text-align: center;
max-width: 25%;
}

.guideline_btnbox {
margin: 1em auto 0 auto;
text-align: center;
}

#guideline a:link {
color: #960E10;
}

#guideline ul {
padding: 0 0 0 1em;
}

#guideline li {
list-style-position: outside;
  padding-top:0.5em;
  padding-bottom:0.5em;
}

details {
margin: 0.5em 0 0.5em 0;
}

#support_btn {
  cursor: pointer;
  font-size: 80%;
  text-align: center;
  margin: 2em auto 2em auto;
  list-style: none;
  max-width: 15%;
  color: #fff;
  border: 1px solid #555;
  padding: 0.5em 1em 0.5em 1em; ;
  background: #000;
}

summary {
  cursor: pointer;
  font-size: 80%;
  text-align: center;
  margin: 0 auto 0.5em auto;
  list-style: none;
  max-width: 10%;
  color: #fff;
  border: 1px solid #555;
  padding: 0.5em;
}
summary::-webkit-details-marker { display: none }

.supportbox{
max-width: 50%;
width: 100%;
margin: 0 auto 0 auto;
text-align: center;
padding: 1em 1em 1em 1em;
background: rgba(255, 255, 255, 0.7);
border: double #bbb;
color: #333;
font-size: 80%;
}

.support01 {
width: 40%;
border: 1px solid #000;
padding: 0.5em;
font-size: 120%;
margin: 1em 0.5em 1em 0.5em;
cursor:pointer;
}

#dlcinner {
vertical-align: top;
width: 100%;
margin: 0 0 2% 0;
}

#dlcbtn01 {
width: 100%;
max-width: 30%;
margin: 0 0 0 0;
}

#dlcbtn02 {
width: 100%;
max-width: 30%;
margin: 0 2% 0 2%;
}

#dlcbtn03 {
width: 100%;
max-width: 30%;
margin: 0 0 0 0;
}
#dlcttl{
width: 100%;
max-width: 40%;
}

.note {
color: #888;
font-size: 80%;
}
/*---↑↑↑ product ↑↑↑ ---*/
}
 @media screen and (max-width : 900px) {/* small *//* small *//* small *//* small *//* small *//* small *//* small *//* small *//* small *//* small *//* small *//* small *//* small *//* small *//* small *//* small *//* small *//* small *//* small *//* small */

#headerbox{
background: url("img/sp_header.png") no-repeat;
background-size: contain;
}

#btnlang01{
min-width: 100%;
height: 90%;

text-align: left;
}

#btnlang01 img{
max-width: 23%;
padding: 1% 0 2% 12%;
}

/*---↓↓↓ topmain  ↓↓↓---*/

#topmain {
padding: 0 0 0 0.5em;
font-size: 2vw;
background-image: url("img/maintop.jpg");
font-family: 'ShipporiMincho-ExtraBold';
font-weight: 700;
color: #fff;
text-shadow: 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1);
background-size:contain;
background-repeat: no-repeat;
text-align: left;
height: 100%;
}

#topmain img {
margin: 0 0 16% 0;
width: 35%;
}

#footerbox{
text-align: center;
}

#footerbtn {
margin: 0 auto 0 auto;
}

#footeritem001 {
max-width: 15%;
height:auto;
margin: 0 0 0 0;
}
#footeritem002 {
max-width: 15%;
height:auto;
padding: 0 0 3% 0;
}
#footeritem003 {
max-width: 15%;
height:auto;
padding: 0 0 3% 0;
}
#footeritem004 {
max-width: 15%;
height:auto;
padding: 0 0 1% 0;
}

#footeracq {
width: 13%;
height:auto;
padding: 0 0 0 0;
}

#footeranx {
width: 35%;
height:auto;
padding: 0 0 2.5% 1.5%;
}

#copy {
color: #fff;
text-align: center;
margin: 3% 0 7% 0;
}

#copy p {
margin: 0;
font-size: 50%;
}

#footter {
background-color: #000;
padding: 2em 0 1em 0;
}

#pvbox {
max-width: 900px;
padding: 0 5% 0 3%;
}

#pv {
max-width: 800px;
margin: 0 auto 0 auto;
}


#movie {
position: relative;
width: 100%;
padding-top: 56.25%;
margin: 7% auto 3% auto;
border: 4px solid rgba(0,0,0,1.00); background: #000;
}

#movie iframe {
position: absolute;
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
-webkit- transform: translateY(-50%) translateX(-50%);
width: 100%;
height: 100%;
margin: auto;
}

#pvbox02 {
max-width: 900px;
padding: 0 5% 0 3%;
}

#pv02 {
max-width: 800px;
margin: 0 auto 0 auto;
}

#pv02 p {
color: #ccc;
font-size: 90%;
text-align: center;
margin: 0 0 0 0;
}

#movie02 {
position: relative;
width: 100%;
padding-top: 56.25%;
margin: 7% auto 3% auto;
border: 4px solid rgba(0,0,0,1.00); background: #000;
}

#movie02 iframe {
position: absolute;
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
-webkit- transform: translateY(-50%) translateX(-50%);
width: 100%;
height: 100%;
margin: auto;
}

/*---↓↓↓ story  ↓↓↓---*/

#story {
background: #000;
text-align: left;
font-family: 'NewTegomin-Regular';
color: #fff;
font-size: 110%;
padding: 2em 1em 2em 1em;
line-height: 110%;
}


#story001_00 {
width: 100%;
margin: 0 auto 5% auto;
}

#story001 {
width: 100%;
font-size: 4vw;
margin: 0 auto 0 auto;
line-height: 170%;
}
#story002 {
width: 100%;
font-size: 4vw;
margin: 0 auto 0 auto;
padding: 0 0 0 0;
line-height: 170%;
}

#storybk003 {
max-width: 1200px;
margin: 0 auto 0 auto;
}

#story003_00 {
width: 100%;
margin: 0 auto 0 auto;
}


#comicbox {
padding: 2%;
color: #fff;
max-width: 100%;
margin: 0 auto 0 auto;
font-size: 150%;
line-height: 170%;
font-family: 'NewTegomin-Regular';
text-align: center;
}

#comicttl {
font-size: 100%;
margin: 0 0 5% 0;
color: #f0f0f0;
letter-spacing : 2px;
text-shadow: 4px  4px 5px #c14025,-4px  4px 5px #c14025,4px -4px 5px #c14025,-4px -4px 5px #c14025,4px  0px 5px #c14025,0px  4px 5px #c14025,-4px  0px 5px #c14025,0px -4px 5px #c14025;
line-height: 120%;
}

#comictxt{
margin: 0 0 3% 0;
font-size: 60%;
line-height: 150%;
}

.sumst {
margin:  0 auto 0 auto;
text-align: center;
}

.sumst img {
max-width: 100%;
}
.sumst ol {

}
.sumst li {
display: inline-flex;
margin: 0 auto 0 auto;
text-align: center;
}
.stcomic{
width: 100%;
}

/*---↑↑↑ story ↑↑↑ ---*/
/*---↓↓↓ system  ↓↓↓---*/

#system {
text-align: center;
}

.catch {
width: 100%;
padding: 2em  0 0 0;
}

#shokudou_box {
justify-content: space-around;
display: flex;
max-width: 900px;
flex-wrap : wrap; 
margin: 0 auto 0 auto;
}

#shokudou_box img {
max-width: 180px;
}

.system_txt {
font-family: 'NewTegomin-Regular';
color: #fff;
font-size: 100%;
text-align: left;
text-shadow: 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1);
margin: 0 auto 1em auto;
padding: 0 1em 0 1em;
}

/*---↑↑↑ system ↑↑↑ ---*/

/*---↓↓↓ sakyu  ↓↓↓---*/

#sakyu001{
}

#sakyu001 img {
display: inline-block;
width: 100%;
max-width: 550px;
}

#sakyu001 p {
display: inline-block;
font-family: 'NewTegomin-Regular';
font-weight: bold;
color: #000;
font-size: 110%;
text-align: left;
text-shadow: 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1);
padding: 0 1em 0 1em;
line-height: 170%;
}


#sakyu002{
}
#sakyu002 p {
display: inline-block;
font-family: 'NewTegomin-Regular';
font-weight: bold;
color: #000;
font-size: 110%;
text-align: left;
text-shadow: 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1);
padding: 0 1em 0 1em;
line-height: 170%;
display: inline-block;

}

#sakyu002 img {
width: 100%;
max-width: 550px;
margin: 5% 0 0 0;
}

#sakyu003{
}

#sakyu003 img {
display: inline-block;
width: 100%;
max-width: 550px;
margin: 5% 0 0 0;
}

#sakyu003 p {
display: inline-block;
font-family: 'NewTegomin-Regular';
font-weight: bold;
color: #000;
font-size: 110%;
text-align: left;
text-shadow: 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1), 0px 0px 10px rgba(255, 255, 255, 1);
padding: 0 1em 0 1em;
line-height: 170%;
}

.sp {
}

.pc {
display: none;
}

/*---↑↑↑ sakyu ↑↑↑ ---*/



#za000 {
max-width: 100%;
margin: 1% 0 1% 0;
}

#za001 {
max-width: 90%;
margin: 10% 0 10% 0; 
}

#za002 {
max-width: 90%;
}

#za003 {
max-width: 90%;
margin: 8% 0 5% 0; 
}

#za004 {
max-width: 65%;
margin: 2% 0 0 0;
}

#za005 {
max-width: 65%;
margin: 2% 0 0 0;
}

#dl01 {
max-width: 65%;
margin: 24% 0 2% 0;
width: 100%;
}

#dl02 {
max-width: 65%;
width: 100%;
}

#dl03 {
max-width: 65%;
margin: 2% 0 0 0;
width: 100%;
}


#za006 {
max-width: 100%;
}

#za007 {
max-width: 65%;
}

#za008 {
max-width: 80%;
margin: 0 0 2% 0;
}

#za009 {
max-width: 80%;
margin: 0 0 2% 0;
}

#za010 {
max-width: 100%;
}

/*---↓↓↓ txt01  ↓↓↓---*/
#txt01 {
margin: 2% auto 2% auto;
width: auto;
text-align: center;
}
#txt01 img {
max-width: 85%;
}

#txt02 {
margin: 3% auto 0 auto;
width: auto;
text-align: center;
}
#txt02 img {
max-width: 80%;
}

#txt01_box {
background: rgba(40,21,21,0.8);
padding: 4%;
color: #fff;
text-align: center;
max-width: 80%;
margin: 0 auto 0 auto;
font-size: 100%;
border: 2px solid #625147;
line-height: 170%;
font-family: 'NewTegomin-Regular';
}

/*---↑↑↑ txt01 ↑↑↑ ---*/

/*---↓↓↓ product  ↓↓↓---*/

#productbox {
font-size: 3vw;
/*background*/
font-family: 'ShipporiMincho-ExtraBold';
font-weight: 700;
color: #fff;
text-shadow: 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1);
background-size:contain;
background-repeat: no-repeat;
text-align: center;
}

#productbox table {
margin: 0 auto 0 auto;
width: 90%;
font-size: 100%;
}
#productbox td {
padding: 1% 0 1% 0;
text-align: left;
white-space: nowrap;
vertical-align: top;
}


#productttl {
text-align: center;
margin: 0 auto 0 auto;
}

#productttl img {
max-width: 30%;
}

#product_txt_box {
width: 100%;
background:rgba(39,12,6, 0.7);
padding: 1em 0 1em 0;
font-size: 100%;
}

#product_txt_box table {
max-width: 100%;
}

#product_txt_box table td {
padding: 0 0 1em 0;
display: block;
text-align: center;
}

.dot {
visibility:collapse;
margin: 0 0 -3.5em 0;
}

#product_btnbox{
margin: 1em 0 0 0;

}
#product_btnbox img{
}

.lum-lightbox-inner img.lum-img {
  max-width: 100%;
}

.test001 {
opacity: 0;
}

#gomanual {
margin: 5% 0 0 0;
}

#gomanual img {
width: 100%;
max-width: 50%;
}

#dlcinner {
}

#dlcbtn01 {
width: 100%;
max-width: 45%;
}

#dlcbtn02 {
width: 100%;
max-width: 45%;
}

#dlcbtn03 {
width: 100%;
max-width: 45%;
}


/*---↑↑↑ product ↑↑↑ ---*/
#dlcttl{
max-width: 65%;
}
#guideline {
background: rgba(40,21,21,0.8);
padding: 0.5em 1em 0.5em 1em;
text-align: left;
border: 2px solid #625147;
color: #fff;
font-size: 60%;
width: 100%;
max-width: 85%;
margin: 5% auto 5% auto;
}

#guideline h4 {
margin: 0 0 -0.5em 0;
}

#guideline h3 {
font-size: 120%;
text-align:  center;
}

#guideline img {
text-align: center;
max-width: 25%;
}

.guideline_btnbox {
margin: 1em auto 0 auto;
text-align: center;
}

#guideline a:link {
color: #960E10;
}

#guideline ul {
padding: 0 0 0 1em;
}

#guideline li {
list-style-position: outside;
  padding-top:0.5em;
  padding-bottom:0.5em;
}

details {
margin: 1em 0 0.5em 0;
}

#support_btn {
  cursor: pointer;
  font-size: 75%;
  text-align: center;
  margin: 2em auto 2em auto;
  list-style: none;
  max-width: 35%;
  color: #fff;
  border: 1px solid #555;
  padding: 0.5em 1em 0.5em 1em; ;
  background: #000;
}

summary {
  cursor: pointer;
  font-size: 80%;
  text-align: center;
  margin: 0 auto 0.5em auto;
  list-style: none;
  max-width: 35%;
  color: #fff;
  border: 1px solid #555;
  padding: 0.5em;
}
.supportbox{
max-width: 80%;
width: 100%;
margin: 0 auto 0 auto;
text-align: center;
padding: 1em 1em 1em 1em;
background: rgba(255, 255, 255, 0.7);
border: double #bbb;
color: #333;
font-size: 80%;
}

.support01 {
width: 90%;
border: 1px solid #000;
padding: 0.5em;
font-size: 100%;
margin: 0.5em 0 0.5em 0;
cursor:pointer;
font-size: 140%;
}


summary::-webkit-details-marker { display: none }

.patch1114{
max-width: 85%;
width: 100%;
margin: 0 auto 0 auto;
text-align: left;
background: rgba(255, 255, 255, 0.7);
border: double #bbb;
color: #333;
font-size: 95%;
padding: 1em;
}

.patch1114 ul {
padding-left:0;
list-style-position: inside;
}

.patch1114 li {
list-style: square;
line-height: 150%;
padding-bottom: 0.5em;
padding-left:0;
list-style-position:outside;
}

.note {
color: #888;
font-size: 80%;
}
}