@charset "UTF-8";
/* CSS Document */


     /*リセットCSS*/
     .container, .container section, .container figure, .container div, .container img, .container table, .container ul, .container ol, .container a, .container p, .container h2, .container h3, .container h4 {
        width: 100%;
        margin: 0;
       padding: 0;
         transition: 1.5s ;
         font-weight: normal;
     }
      ul, ol {
         list-style-type: none;
         padding: 0;
     }
  figcaption {
        width: 100%;
        margin: 0;
       padding: 0;
    }
    table {
    border-collapse: collapse;
    border-spacing: 0;
    padding: 0;
    margin: 0;
}
     /*ここまでリセットCSS*/
     
     
     
    /* 項目下の空白（全）*/
     .container section {
         margin-bottom: 1%;
     }
    /* 項目下の空白ここまで*/
    
    /*タイトル*/
    .container header h1.title {
         font-size: 0;
    }

    
   /* 導入*/
   .container  .intro h2 {
                font-size: 2.5em;
        font-weight: bold;
       padding-bottom: 3%;
    }
       .container .about {
                  font-size: 1.25em;
           line-height: 1.8em;
    }
    .container .about2 {
                  font-size: 1.5em;
        width: 98%;
       text-align: right;
            letter-spacing: .18em;
    }
    .container .about3 {
                  font-size: 2.2em;
        margin-left: 1em;
                    letter-spacing: .1em;
            line-height: 1.1em;
    }
    .container  .intro h2, .container .about {
        width: 90%;
        margin: 0 auto;
    }
   .container  .intro {
        background: linear-gradient(rgba(255,238,185,0.4) 90%, rgba(255,255,255,0.4));
       padding: 5% 0 ;
    }
    .container .pict {
        margin: 0 auto;
        width: 98%;
        text-align: center;
    }
    .container  .intro .select {
        margin: 5% auto 1%;
        width: 88%;
        background-color: #fff;
        border-radius: 10px;
        padding: 2% 0;
    }

   .container .lineup .item-detail h3 span {
       padding-bottom: 1%;
        border-bottom: 3px dotted #262626;
       font-size: .7em;
       display: block;
    }
    .container .lineup .set50 .lv5-1,  .container .lineup .set50 .lv4-1,  .container .lineup .set50 .lv3-1,  .container .lineup .set50 .lv2-1,  .container .lineup .set50 .lv1-1 {
        font-size: 2.2em;
    }
    .container .lineup .set50 .lv5-1 span  {
        width: 73%;
            padding-bottom: 1%;
      background: linear-gradient( -70deg, rgba(225, 225, 225, 0%) 4%, #CB7DB0 4%, #CB7DB0 12%, rgba(225, 225, 225, 0%) 12%,  rgba(225, 225, 225, 0%) 14%, #CB7DB0 14%, #CB7DB0 22%, rgba(225, 225, 225, 0%) 22%,  rgba(225, 225, 225, 0%) 24%,  #CB7DB0  24%, #CB7DB0 28%,  #CB7DB0 28%, #91308C 85%,  #91308C 100%);
       font-size: .6em;
        font-weight: bold;
       display: block;
       color: #fff;
        text-shadow:  4px 4px 4px rgb(0 0 0 / 55%);
        text-indent: 1.6em;
    }
    .container .lineup .set50 .lv4-1 span {
         width: 73%;
            padding-bottom: 1%;
         background: linear-gradient( -70deg, rgba(225, 225, 225, 0%) 4%, #C20D38 4%, #C20D38 12%, rgba(225, 225, 225, 0%) 12%,  rgba(225, 225, 225, 0%) 14%, #C20D38 14%, #C20D38 22%, rgba(225, 225, 225, 0%) 22%,  rgba(225, 225, 225, 0%) 24%,  #C41236  24%, #C41236 85%,  #E95513 100%);
            font-size: .6em;
        font-weight: bold;
       display: block;
       color: #fff;
        text-shadow:  4px 4px 4px rgb(0 0 0 / 55%);
        text-indent: 1.6em;
    }
    .container .lineup .set50 .lv3-1 span {
         width: 73%;
            padding-bottom: 1%;
         background: linear-gradient( -70deg, rgba(225, 225, 225, 0%) 4%, #F08800 4%, #F08800 12%, rgba(225, 225, 225, 0%) 12%,  rgba(225, 225, 225, 0%) 14%, #F08800 14%, #F08800 22%, rgba(225, 225, 225, 0%) 22%,  rgba(225, 225, 225, 0%) 24%,  #F08800  24%, #F08800 85%,  #F7C200 100%);
            font-size: .6em;
        font-weight: bold;
       display: block;
       color: #fff;
        text-shadow:  4px 4px 4px rgb(0 0 0 / 55%);
        text-indent: 1.6em;
    }
        .container .lineup .set50 .lv2-1 span {
         width: 73%;
            padding-bottom: 1%;
         background: linear-gradient( -70deg, rgba(225, 225, 225, 0%) 4%, #FFF362 4%, #FFF362 12%, rgba(225, 225, 225, 0%) 12%,  rgba(225, 225, 225, 0%) 14%, #FFF362 14%, #FFF362 22%, rgba(225, 225, 225, 0%) 22%,  rgba(225, 225, 225, 0%) 24%,  #FFF362  24%, #FFF362 85%,  #FCD13E 100%);
            font-size: .6em;
        font-weight: bold;
       display: block;
       color: #fff;
        text-shadow:  4px 4px 4px rgb(0 0 0 / 55%);
        text-indent: 1.6em;
    }
    .container .lineup .set50 .lv1-1 span {
         width: 73%;
            padding-bottom: 1%;
         background: linear-gradient( -70deg, rgba(225, 225, 225, 0%) 4%, #EEEEEF 4%, #EEEEEF 12%, rgba(225, 225, 225, 0%) 12%,  rgba(225, 225, 225, 0%) 14%, #EEEEEF 14%, #EEEEEF 22%, rgba(225, 225, 225, 0%) 22%,  rgba(225, 225, 225, 0%) 24%,  #EEEEEF  24%, #B4B4B5 85%,  #B4B4B5 100%);
            font-size: .6em;
        font-weight: bold;
       display: block;
       color: #fff;
        text-shadow:  4px 4px 4px rgb(0 0 0 / 55%);
        text-indent: 1.6em;
    }
    
    
  .container .lineup .item-detail h3 em, .container .lineup .set50 .lv5-1 em, .container .lineup .set50 .lv4-1 em, .container .lineup .set50 .lv3-1 em, .container .lineup .set50 .lv2-1 em, .container .lineup .set50 .lv1-1 em {
       font-style: normal;
        font-size: 1em;
        font-weight: bold;
      color: #000;
    }
    
    .lv5-1bk {
        background: url("https://peaceup.itembox.design/item/common/img/level5/level5-1.jpg") no-repeat;
        background-size: 100%;
        height:425px;
         color: #000;
    } 
    .lv5-1bk2 {
        background: url("https://peaceup.itembox.design/item/common/img/level5/level5-1n.jpg") no-repeat;
        background-size: 100%;
        height:425px;
           color: #000;
    }
        .lv4-1bk {
        background: url("https://peaceup.itembox.design/item/common/img/level4/level4-1.jpg") no-repeat;
        background-size: 100%;
        height:425px;
         color: #000;
    } 
    .lv4-1bk2 {
        background: url("https://peaceup.itembox.design/item/common/img/level4/level4-1n.jpg") no-repeat;
        background-size: 100%;
        height:425px;
           color: #000;
    }
    .lv3-1bk {
        background: url("https://peaceup.itembox.design/item/common/img/level1-3/level3-1.jpg") no-repeat;
        background-size: 100%;
        height:425px;
         color: #000;
    } 
    .lv3-1bk2 {
        background: url("https://peaceup.itembox.design/item/common/img/level1-3/level3-1n.jpg") no-repeat;
        background-size: 100%;
        height:425px;
           color: #000;
    }
        .lv2-1bk {
        background: url("https://peaceup.itembox.design/item/common/img/level1-3/level2-1.jpg") no-repeat;
        background-size: 100%;
        height:425px;
         color: #000;
    } 
    .lv2-1bk2 {
        background: url("https://peaceup.itembox.design/item/common/img/level1-3/level2-1n.jpg") no-repeat;
        background-size: 100%;
        height:425px;
           color: #000;
    }
     .lv1-1bk {
        background: url("https://peaceup.itembox.design/item/common/img/level1-3/level1-1.jpg") no-repeat;
        background-size: 100%;
        height:425px;
         color: #000;
    } 
    .lv1-1bk2 {
        background: url("https://peaceup.itembox.design/item/common/img/level1-3/level1-1n.jpg") no-repeat;
        background-size: 100%;
        height:425px;
           color: #000;
    }
 .lv5-1bk:hover,  .lv5-1bk2:hover,  .lv4-1bk:hover,  .lv4-1bk2:hover,  .lv3-1bk:hover,  .lv3-1bk2:hover,  .lv2-1bk:hover,  .lv2-1bk2:hover,  .lv1-1bk:hover,  .lv1-1bk2:hover {
       background-size: 103%;
        background-position: top center;
    }
    .lv5-2 h3, .lv4-2 h3, .lv3-2 h3, .lv2-2 h3, .lv1-2 h3, .lv4-3 h3, .lv3-3 h3, .lv2-3 h3, .lv1-3 h3 {
        margin:  0 auto;
        font-weight: bold;
        background: #eee;
    }
    .item .lv5-2, .item .lv4-2, .item .lv4-3, .item .lv3-2, .item .lv3-3, .item .lv2-2, .item .lv2-3, .item .lv1-2, .item .lv1-3 {
     margin-bottom: 10%;
        font-size: 1.5em;
    }
.item .lv5-2 a, .item .lv4-2 a, .item .lv4-3 a, .item .lv3-2 a, .item .lv3-3 a, .item .lv2-2 a, .item .lv2-3 a, .item .lv1-2 a, .item .lv1-3 a {
     text-decoration: underline;
    }
.item .lv5-2 a:hover, .item .lv4-2 a:hover, .item .lv4-3 a:hover, .item .lv3-2 a:hover, .item .lv3-3 a:hover .item .lv2-2 a:hover, .item .lv2-3 a:hover .item .lv1-2 a:hover, .item .lv1-3 a:hover {
   color:#EA2F2F;
    }
    
    
    .set50 .detail-txt {
                font-size: 2em;
    }
    
    .container .lineup .item-detail h3 {
               margin: 0 auto 5%;
       text-align: center;
    }

    .detail  {
        display: inline-block;
        background-color: #E50000;
        color: #fff;
        width: 87px;
        text-align: center;
        margin: 0 1% 5%;
        font-weight: bold;
    }
    
    .item .detail {
                font-size: 1.7em;
          width: 33%;
        padding: 2% 0;
        border-radius: 5px;
    }
  .item .detail span  {
        font-size: .6em;
           line-height: 1em;
           text-align: left;
           display: inline-block;
           vertical-align: middle;
    }
    
    .item-detail .detail-grp ul {
        text-align: justify;
    }
    
   .item-detail .detail-grp {
        width:73%;
    }
        .container .ruck .item-imgR .img {
         width: 40%;
        position: absolute;
        bottom: 0;
        right: -4%;
}
    


    .container .ruck .item-detail {
        width: 85%;
        display: inline-block;
        color: #262626;
        padding: 3% 5%;
        font-size: 1.5em;
    }
     .container .ruck .item-detail p {
        font-size: 1.9rem;
         line-height: 1.8em;
         margin-bottom: 13%;
    }
    
 .container .ruck  {
        position: relative;
        margin: 10% auto;
        border: 3px solid #D6D6D6;
        width: 62%;
        display: inline-block;
    }
     .container .ruck:last-child  {
        width: 34%;
         vertical-align: bottom;
         margin-left: 1.5%;
    }
     .container .ruck:last-child  .item-detail p {
         margin-bottom: 8%;
        font-size: 1.5rem;
    }
 
    /* ここまで導入*/
    
    /*導入・アイテム共通*/




    

    
       .container .set-item .item-detail2 h4 .mfr {
        display: block;
    }
    .container .set-item .item-detail2 h4 {
        padding-bottom: 5%;
        border-bottom: 1px solid #fff;
    }
    
    .container .set-item .item-detail2 {
        width: 410px;
        display: block;
        position: absolute;
        top:10%;
        left: 4%;
        color: #fff;
        background: #4795B9;
        border-radius: 3px;
        padding: 3% 5%;
        font-size: 1.8em;
        line-height: 2em;
        filter: drop-shadow(8px 8px 5px rgba(0, 0, 0, .2));
    }
        .container .set-item .set-lineup th {
        text-align: right;
        text-decoration: underline;
        text-underline-offset: 20%;
    }
       .container .set-item .set-lineup {
        width: 510px;
        display: block;
        position: absolute;
        top: 42%;
        right: 4%;
        color: #fff;
        background: #6D95B9;
        border-radius: 3px;
        padding: 3% 5%;
        font-size: 1.8em;
        line-height: 1.2em;
        filter: drop-shadow(8px 8px 5px rgba(0, 0, 0, .2));
        z-index: -1;
    }
      .container .set-item  {
        position: relative;
        margin: 10% auto;
            height: 90vh;
    }

    /*ここまで導入・アイテム共通*/
    /*ラインアップ*/
       .container .lineup h2 {
            font-size: 4.5em;
           text-align: left;
    }
         .container .lineup h2:before {
            content: '';
             display: inline-block;
             width: 20px;
             height: 1.8em;
             vertical-align: middle;
             background-color: #FFAD08;
    }
    .container .lineup .item-imgC {
        width: 70%;
        margin: 0 auto 10%;
    }
   .container .lineup .item-grp h3  {
        font-size: 3.736em;
       font-weight: bold;
    }
    
  .container .item .level em {
       font-style: normal;
        font-size: 1.1em;
        font-weight: bold;
      display: block;
    text-align: justify;
      padding-top: 1%;
  border-top: 7px solid #c21500;
  border-image: linear-gradient(to left, #c21500 0%, #ffc500 100%);
  border-image-slice: 1;
    }
    
    .container .item .level span {
        font-size: .7em;
        margin-left: 1em;
    }
      .container .item .level {
        font-size:2.7em;
        text-indent: 1em;
          margin-top: 5%;
    }
    
    .colorbox .color01 {
        background-color: #1368DB;
    }
   .colorbox .color02 {
        background-color:  #FE8600;
    }
    .colorbox div {
        width:33px;
        height: 33px;
        display: inline-block;
    }
    .colorbox {
        width: 100%;
        text-align: right;
    }
    
    .setimg, .set-detail {
        display: inline-block;
        vertical-align: top;
    }
    .setimg {
        width: 38%;
        font-size: 0;
        margin:  0 auto;
        padding: 0;
    }
     .set-detail h5 {
font-size: 1.3em;
margin: 5% 0;
text-decoration: underline 1px;
    text-underline-offset: 40%;

    }
    
  .set-detail p {
font-size: 1.25em;
    text-align: justify;
    }
        .set-detail {
        width: 60%;
        margin:  0 auto;
        padding: 0;
        letter-spacing: .025em;
    }

    
    
    .levelset h4 {
        font-size: 2em;
        text-align: center;
        background-color: #BC0000;
        color: #fff;
        margin-bottom: 5%;
    }
  
   /* 価格・ボタン*/
    
         .container a {
        text-decoration: none;
         color: #4D4D4D;
    }
    
       .container  .red-button {
            background-color: #EA2F2F;
            border-radius: 10px;
            margin: 10px auto;
            box-shadow: 8px 8px 8px rgb(0 0 0 / 25%);
            line-height: 1.5em;
            display: block;
             font-size: 1em;
            width: 80%;
		}
      
       .red-button a:before { /* ボタン丸矢印PC、sp、tabは調整必要*/
        content: '▼';
       font-size: .4em;
       color: #EA2F2F;
       background-color: #fff;
       border-radius: 100px;
       padding: .3vw .3vw 0;
       margin-right: .5vw;
       vertical-align: top;
    }
    
		.red-button a {
			display: block;
			padding: 3vh 0;
			font-size: 2em;
			color:#fff;
			font-weight: bold;
			text-decoration: none;
			text-align: center;
		}
		.red-button a:visited {
			color:#fff;
		}
   .red-button:hover {
        opacity: .7;
    }
    .container .lineup   .item-grp {
             padding-bottom: 20%;
      border-bottom: 3px dashed #dcdcdc;
    }
    .container .caption2 {
		font-size: 2em;
        line-height: 1.3em;
        vertical-align: top;
         text-align: center;
        margin: 5% auto 0;
    }
   .price {
        font-size: 2.2em;
        display: block;
      text-align: center;
    text-decoration: underline;
    text-underline-offset: 20%;
    
    }
	.container .price-grp {
        width:90%;
        display: block;
        margin: 0 auto;
		}
    /*並び用CSS（PC）*/
      .container .set50 {
           width: 49%;
           display: inline-block;
           margin: 0 auto 7%;
           vertical-align: top;
           padding: 0;
        }
    /*ここまで２個並び用CSS*/
    /* ここまで価格・ボタン*/
/*  table*/
    .table {
        width: 80%;
        border-radius: 30px;
        border-collapse: separate;
        padding: 3vw 0;
        margin: 2vw auto;
    }
   .table th {
        width: 100%;
        font-weight: bold;
        text-align: left;
    }
    .table tr td:first-child {
                 padding-left: 1.5vw;
    }
    .table tr td {
         padding-top: .5vw;
        font-size: .8em;
    }
    
     .table .w85 {
        width: 92%;
    }
    .table .w15 {
        width: 8%;
    }    
/* ここまでtable*/
    
     /*ここまでラインアップ*/
    
    
    
   /*Tab*/
    @media screen and (max-width:919px) and (min-width:541px)  {
        
        
    } /*Tabここまで*/
    
   /*sp*/ 
@media screen and (max-width:540px) {   
    
    .container .set50 {
        width: 100%;
        display: block;
    }
    .lv5-1bk, .lv5-1bk2,.lv4-1bk, .lv4-1bk2,.lv3-1bk, .lv3-1bk2,.lv2-1bk, .lv2-1bk2, .lv1-1bk, .lv1-1bk2 {
    height: 103vw;
}
       .lv5-1bk:hover, .lv5-1bk2:hover {
    
}
    .container .ruck, .container .ruck:last-child {
        width: 95%;
        margin: 1% auto 5%;
        display: block;
    }
   .container .ruck .detail-grp .detail-txt, .container .ruck:last-child  .detail-grp .detail-txt {
        font-size: .8em;
    }
    .container .item .level {
                font-size: 1.5em;
        text-indent: 0;
    }

    
    
       .lv5-1bk h3 em, .lv5-1bk2 h3 em, .set50 .detail-txt {
            text-shadow:  0 0 0.5em #fff, 0 0 0.5em #fff;
color: #000;
           font-size: 1.8em;
           margin: 0 auto;
           text-align: center;
    }

    
.container .intro h2, .container .lineup h2 {
            font-size: 1.5em;    
    }
    
 .container .lineup .levelset h4 {
        font-size: 1.76em;
    }
    
      .container .lineup .item-detail h3 em, .container .lineup .set50 .lv5-1 em, .container .lineup .set50 .lv4-1 em, .container .lineup .set50 .lv3-1 em, .container .lineup .set50 .lv2-1 em, .container .lineup .set50 .lv1-1 em {
       font-style: normal;
        font-size: .799em;
        font-weight: bold;
      color: #000;
    }
    .item .lv5-2, .item .lv4-2, .item .lv4-3, .item .lv3-2, .item .lv3-3, .item .lv2-2, .item .lv2-3, .item .lv1-2, .item .lv1-3{
        font-size: 1.14em;
    }
    
.container .about2 {
            font-size: 1.1em;
    letter-spacing: 0;
    text-align: left;
    }
    
    .container .about3 {
            font-size: 1.2em;
    margin: 0 auto;
    letter-spacing: 0em;
    }
    
    .detail { 
        width: 30%;
    }
    .item-detail .detail-grp {
    width: 100%;
}
    
.item .detail {
    font-size: 2.2em;
    width: 45%;
    display: block;
    margin: 1%;
}
    
    .container .ruck .item-imgR .img{
        position: relative;
        bottom: 0;
        left: 25%;
    }
    
    .container .lineup .set50 .lv4-1 span{
        text-indent:.25em;
    }
    

} /* ここまでsp */  
    
    
    /*全体*/
       .container {
        color: #4D4D4D;
        font-family: 'HG丸ｺﾞｼｯｸM-PRO','HGMaruGothicMPRO','ヒラギノ丸ゴ Pro W4','ヒラギノ丸ゴ Pro','ヒラギノ丸ゴ Pro',sans-serif;
        width: 100%;
        max-width: 860px;
        margin: 0 auto;
    }