@charset "UTF-8";
/* ===============================================
    ! Foundation !
=============================================== */
/* =====================================
    * setting for animation style *
===================================== */
.fadeIn {
    -webkit-transition-duration: 1.5s;
    -o-transition-duration: 1.5s;
    transition-duration: 1.5s;
    opacity: 0;
    -webkit-transform: translate(50px);
    -ms-transform: translate(50px);
    transform: translate(0px);
    -webkit-transition: all 1500ms;
    transition: all 1500ms;
  }
  
  /* jQueryでスクロール量に応じて付与された 'scrollIn' のスタイル */
  .fadeIn.scrollIn {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
/* =================
	all
================= */
img{
    color: inherit;
    text-decoration: none;
    -webkit-transition: .3s;
    transition: .3s;
    width: 100%;
}
.main-area .main-inner{
    width: 100%;
    max-width: none;
    overflow-x: hidden;
}
#candy_1116{
    width: 100%;
    font-feature-settings: "palt";
    box-sizing: border-box;
    font-family: 'Abhaya Libre', serif;
    font-weight: 400;
}
.flexbox{
    display: flex;
}
.price{
    font-size: calc( 24 * (100vw / 750));
    letter-spacing: 0.08em;
}
#candy_1116 .btn_1116 a{
    display: block;
    padding: calc( 46 * (100vw / 750)) 0;
}
.pc_only{
    display: none !important;
}
/* =================
	ttl
================= */
#candy_1116 .ttlbox{
    margin-top: calc( 105 * (100vw / 750));
    margin-bottom: calc( 83 * (100vw / 750));
}
#candy_1116 .ttlbox .ttl{
    width: calc( 600 * (100vw / 750));
    margin: 0 auto;
    margin-bottom: calc( 46 * (100vw / 750));
}
#candy_1116 .ttlbox .j_txt{
    font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
    font-size: calc( 24 * (100vw / 750));
    letter-spacing: 0.08em;
    line-height: 2;
    text-align: center;
}
/* =================
	sec1
================= */
#candy_1116 .sec1{
    margin-bottom: calc( 161 * (100vw / 750));
    position: relative;
}
#candy_1116 .sec1 .bk{
    background-color: #edf0f4;
    width: 100%;
    height: calc( 2264 * (100vw / 750));
    z-index: -1;
    position: absolute;
    top: calc( 200 * (100vw / 750));
    left: 0;
}
#candy_1116 .sec1 .inner{
    width: calc( 657 * (100vw / 750));
    margin-left: calc( 56 * (100vw / 750));
}
#candy_1116 .sec1 .flexbox._01{
    flex-wrap: wrap-reverse;
}
#candy_1116 .sec1 .flexbox._01 .hv .hv_ft{
    width: calc( 450 * (100vw / 750));
    margin-bottom: calc( 60 * (100vw / 750));
}
#candy_1116 .sec1 .flexbox._01 li:nth-child(2){
    width: calc( 638 * (100vw / 750));
    margin-bottom: calc( 60 * (100vw / 750));
}
#candy_1116 .sec1 .flexbox._02{
    flex-wrap: wrap;
}
#candy_1116 .sec1 .flexbox._02 li{
    width: calc( 388 * (100vw / 750));
}
#candy_1116 .sec1 .flexbox._02 li:first-child{
    margin-left: calc( 270 * (100vw / 750));
    margin-bottom: calc( 60 * (100vw / 750));
}
/* =================
	sec2
================= */
#candy_1116 .sec2{
    margin-bottom: calc( 158 * (100vw / 750));
    position: relative;
}
#candy_1116 .sec2 .bk{
    background-color: #f4f2f2;
    width: calc( 700 * (100vw / 750));
    height: calc( 2663 * (100vw / 750));
    z-index: -1;
    position: absolute;
    top: calc( 205 * (100vw / 750));
    left: calc( 50 * (100vw / 750));
}
#candy_1116 .sec2 .flexbox._01 li{
    width: calc( 650 * (100vw / 750));
    margin: 0 auto;
    margin-bottom: calc( 60 * (100vw / 750));
}
#candy_1116 .sec2 .imgbox{
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    margin-bottom: calc( 100 * (100vw / 750));
}
#candy_1116 .sec2 .imgbox li{
    width: calc( 360 * (100vw / 750));
}
#candy_1116 .sec2 .imgbox li:first-child{
    margin-top: calc( 100 * (100vw / 750));
}
#candy_1116 .sec2 .flexbox._02{
    flex-wrap: wrap-reverse;
}
#candy_1116 .sec2 .flexbox._02 li:first-child{
    width: calc( 600 * (100vw / 750));
    margin-left: calc( 113 * (100vw / 750));
}
#candy_1116 .sec2 .flexbox._02 li:nth-child(2){
    width: calc( 450 * (100vw / 750));
    margin-left: calc( 50 * (100vw / 750));
    margin-bottom: calc( 60 * (100vw / 750));
}
/* =================
	sec3
================= */
#candy_1116 .sec3{
    margin-bottom: calc( 204 * (100vw / 750));
    position: relative;
}
#candy_1116 .sec3 .bk{
    background-color: #edf0f4;
    width: calc( 675 * (100vw / 750));
    height: calc( 1709 * (100vw / 750));
    z-index: -1;
    position: absolute;
    top: calc( 100 * (100vw / 750));
    left: 0;
}
#candy_1116 .sec3 .imgbox{
    width: calc( 600 * (100vw / 750));
    margin-bottom: calc( 59 * (100vw / 750));
}
#candy_1116 .sec3 .flexbox{
    flex-wrap: wrap;
}
#candy_1116 .sec3 .flexbox .hv{
    margin-left: auto;
}
#candy_1116 .sec3 .flexbox .hv .hv_ft{
    width: calc( 562 * (100vw / 750));
}
#candy_1116 .sec3 .flexbox li:nth-child(2){
    width: calc( 375 * (100vw / 750));
    margin-top: calc( -100 * (100vw / 750));
    z-index: 10;
}
/* =================
	LINE UP
================= */
#candy_1116 .lineup{
    width: calc( 720 * (100vw / 750));
    margin: 0 auto;
    margin-bottom: calc( 290 * (100vw / 750));
    position: relative;
}
#candy_1116 .lineup .bk{
    background: url(../../imgs/sp_bk.png) no-repeat;
    background-size: 100%;
    width: calc( 720 * (100vw / 750));
    height: calc( 3780 * (100vw / 750));
    z-index: -10;
    position: absolute;
}
/* all */
#candy_1116 .all_hako .flexbox{
    display: flex;
}
#candy_1116 .all_hako .price{
    text-align: center;
}
/* hako_01 */
#candy_1116 .hako_01{
    width: calc( 615 * (100vw / 750));
    padding-top: calc( 64 * (100vw / 750));
    margin-left: calc( 50 * (100vw / 750));
    justify-content: space-between;
}
#candy_1116 .all_hako .hako_01 .hv._01{
    width: calc( 320 * (100vw / 750));
    margin-top: calc( 100 * (100vw / 750));
}
#candy_1116 .all_hako .hako_01 .hv._01 .hv_ft{
    margin-bottom: calc( 10 * (100vw / 750));
}
#candy_1116 .all_hako .hako_01 .hv._02{
    width: calc( 250 * (100vw / 750));
}
#candy_1116 .all_hako .hako_01 .hv._02 .hv_ft{
    margin-bottom: calc( 10 * (100vw / 750));
}
#candy_1116 .all_hako .hako_01 .hv._02 .price{
    width: calc( 275 * (100vw / 750));
    margin: 0 auto;
    margin-left: calc( -13 * (100vw / 750));
}
/* hako_02 */
#candy_1116 .hako_02{
    width: calc( 617 * (100vw / 750));
    margin-left: calc( 65 * (100vw / 750));
    justify-content: space-between;
}
#candy_1116 .all_hako .hako_02 .hv._01{
    width: calc( 260 * (100vw / 750));
    margin-top: calc( 100 * (100vw / 750));
}
#candy_1116 .all_hako .hako_02 .hv._01 .price{
    margin-top: calc( -5 * (100vw / 750));
}
#candy_1116 .all_hako .hako_02 .hv._02{
    width: calc( 290 * (100vw / 750));
    margin-top: calc( -110 * (100vw / 750));
}
#candy_1116 .all_hako .hako_02 .hv._02 .price{
    margin-top: calc( -5 * (100vw / 750));
}
/* hako_03 */
#candy_1116 .hako_03{
    width: calc( 667 * (100vw / 750));
    margin-top: calc( -69 * (100vw / 750));
    margin-left: calc( 25 * (100vw / 750));
    justify-content: space-between;
}
#candy_1116 .all_hako .hako_03 .hv._01{
    width: calc( 330 * (100vw / 750));
    margin-top: calc( 230 * (100vw / 750));
}
#candy_1116 .all_hako .hako_03 .hv._01 .price{
    margin-top: calc( 12 * (100vw / 750));
}
#candy_1116 .all_hako .hako_03 .hv._02{
    width: calc( 320 * (100vw / 750));
}
#candy_1116 .all_hako .hako_03 .hv._02 .price{
    margin-top: calc( -6 * (100vw / 750));
}
/* hako_04 */
#candy_1116 .hako_04{
    width: calc( 595 * (100vw / 750));
    margin-top: calc( -103 * (100vw / 750));
    margin-left: calc( 40 * (100vw / 750));
    justify-content: space-between;
}
#candy_1116 .all_hako .hako_04 .hv._01{
    width: calc( 320 * (100vw / 750));
    margin-top: calc( 304 * (100vw / 750));
    z-index: 15;
}
#candy_1116 .all_hako .hako_04 .hv._01 .price{
    margin-top: calc( -2 * (100vw / 750));
}
#candy_1116 .all_hako .hako_04 .hv._02{
    width: calc( 240 * (100vw / 750));
}
#candy_1116 .all_hako .hako_04 .hv._02 .price{
    width: calc( 261 * (100vw / 750));
    margin-left: calc( -12 * (100vw / 750));
    margin-top: calc( 17 * (100vw / 750));
}
/* hako_05 */
#candy_1116 .hako_05{
    width: calc( 650 * (100vw / 750));
    margin-top: calc( -230 * (100vw / 750));
    margin-left: calc( 65 * (100vw / 750));
}
#candy_1116 .all_hako .hako_05 .hv._01{
    width: calc( 300 * (100vw / 750));
    margin-top: calc( 365 * (100vw / 750));
}
#candy_1116 .all_hako .hako_05 .hv._01 .price{
    margin-top: calc( -4 * (100vw / 750));
}
#candy_1116 .all_hako .hako_05 .hv._02{
    width: calc( 355 * (100vw / 750));
    margin-left: calc( -9 * (100vw / 750));
    z-index: 1;
}
#candy_1116 .all_hako .hako_05 .hv._02 .price{
        margin-left: calc( -17 * (100vw / 750));
        margin-top: calc( 13 * (100vw / 750));
}
/* hako_06 */
#candy_1116 .hako_06{
    width: calc( 669 * (100vw / 750));
    margin-top: calc( -82 * (100vw / 750));
    margin-left: calc( 18 * (100vw / 750));
    justify-content: space-between;
}
#candy_1116 .all_hako .hako_06 .hv._01{
    width: calc( 330 * (100vw / 750));
    margin-top: calc( 243 * (100vw / 750));
}
#candy_1116 .all_hako .hako_06 .hv._01 .price{
    margin-top: calc( 15 * (100vw / 750));
}
#candy_1116 .all_hako .hako_06 .hv._02{
    width: calc( 320 * (100vw / 750));
}
#candy_1116 .all_hako .hako_06 .hv._02 .price{
    margin-top: calc( -5 * (100vw / 750));
}
/* =================
	bnt
================= */
#candy_1116 .btn_1116{
    width: calc( 676 * (100vw / 750));
    height: calc( 180 * (100vw / 750));
    box-sizing: border-box;
    margin: 0 auto;
    margin-bottom: calc( 203 * (100vw / 750));
    text-align: center;
    line-height: 1;
    letter-spacing: 0.08em;
    font-size: calc( 44 * (100vw / 750));
    border: 1px solid #000000;
}