@charset "UTF-8";
/* ----------------------------------------
        SP
----------------------------------------- */
/*共通*/
#shirojyun_container {
    color: #164863;
}
#shirojyun_container .section{
    padding: 17.188vw 0 26.042vw;
}
/*動き*/
/*上下浮遊*/
.an-float {
    animation: floating-y 4s ease-in-out infinite alternate-reverse;
}
.an-float-2 {
    animation: floating-y-2 4s ease-in-out 0.5s infinite alternate-reverse;
}
.an-float-3 {
    animation: floating-y 4s ease-in-out 1s infinite alternate-reverse;
}
.an-float-4 {
    animation: floating-y 4s ease-in-out 1.5s infinite alternate-reverse;
}
@keyframes floating-y {
    0% {
        transform: translateY(-5%);
    }
    100% {
        transform: translateY(5%);
    }
    }
    @keyframes floating-y-2 {
    0% {
        transform: translateY(-8%);
    }
    100% {
        transform: translateY(8%);
    }
}
/*フェードイン*/
.js-fadeIn {
    transform: translate3d(0, -6.51vw, 0);
    opacity: 0;
}
.fadeIn-01.animated {
    animation: fadeIn 1.25s ease-in-out 0s forwards;
}
.fadeIn-02.animated {
    animation: fadeIn 1.25s ease-in-out 0.25s forwards;
}
.fadeIn-03.animated {
    animation: fadeIn 1.25s ease-in-out 0.5s forwards;
}
.fadeIn-04.animated {
    animation: fadeIn 1.25s ease-in-out 0.75s forwards;
}
@keyframes fadeIn {
    0% {
        transform: translate3d(0, -6.51vw, 0);
        opacity: 0;
    }
    100% {
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }
}

/*テキスト系*/
#shirojyun_container p{
    font-size: 3.646vw;
    line-height: 1.5;
}
#shirojyun_container .medium{
    font-size: 80%;
}
#shirojyun_container .small{
    font-size: 60%;
}
#shirojyun_container .x-small{
    font-size: 50%;
}
#shirojyun_container .ttl-02{
    font-size: 4.688vw;
    font-weight: bold;
}
/*タイトル*/
#shirojyun_container .ttl-cnt{
    text-align: center;
    margin-bottom: 10.286vw;
}
#shirojyun_container .ttl-cnt .main-ttl{
    font-size: 8.333vw;
    font-feature-settings: "palt";
}
#shirojyun_container .ttl-cnt .sub-ttl{
    font-size: 2.604vw;
    line-height: 1;
    letter-spacing: -0.117vw;
}
#shirojyun_container .ttl-cnt .sub-ttl::before{
    content: "- ";
}
#shirojyun_container .ttl-cnt .sub-ttl::after{
    content: " -";
}
/*カート*/
.section_cart_01_bg {
    background: linear-gradient(270deg, rgb(197,193,255) 0%, rgb(44,216,213) 16%, rgb(46,202,228) 60%, rgb(48,187,242) 100%);
}
.section_cart_01 .btn_cart_01 a{
    color: #2daadc;
    border-radius: 6.51vw;  
}
.section_cart_01 .btn_cart_01 a span {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xml:space='preserve' style='enable-background:new 0 0 512 512' viewBox='0 0 512 512'%3E%3Cpath fill='%232daadc' d='M148 379.3c-22.4-1.1-21.9-32.6 0-33.7 62.2.2 226.1.1 290.3.1 17.5 0 32.6-11.9 36.5-29L511.2 159c2.1-9 0-18.4-5.8-25.6s-14.4-11.5-23.6-11.5c-25.8 0-244.8-1-357-1.4l-17.8-66c-4.3-15.8-18.7-26.8-35-26.8H15c-8.3 0-15 6.7-15 15s6.7 15 15 15h57c2.8 0 5.3 1.9 6 4.6l68.3 253.4c-12 .4-23.2 5.3-31.7 13.9-8.9 9-13.7 21-13.5 33.7.4 25.4 21.5 46 46.9 46h21.9c-3.3 6.8-5.1 14.5-5.1 22.5 0 29 23.6 52.5 52.5 52.5s52.5-23.6 52.5-52.5c0-8.1-1.8-15.7-5.1-22.5h94.8c-3.2 6.8-5.1 14.5-5.1 22.5 0 29 23.6 52.5 52.5 52.5 29 0 52.5-23.6 52.5-52.5 0-8.4-2-16.3-5.5-23.3 5.9-2 10.2-7.6 10.2-14.2 0-8.3-6.7-15-15-15H148zm91.9 52.5c0 12.4-10.1 22.5-22.5 22.5s-22.5-10.1-22.5-22.5 10.1-22.5 22.5-22.5 22.5 10.1 22.5 22.5zM407 454.4c-12.4 0-22.5-10.1-22.5-22.5 0-12.3 9.9-22.3 22.1-22.5h.7c12.2.2 22.1 10.2 22.1 22.5.1 12.4-10 22.5-22.4 22.5zM481.9 152c.1.1.1.2.1.3l-15.3 66.5h-52l8.8-67.1 58.2.2c.1-.1.1-.1.2.1zM327.2 315.7v-67h53.2l-8.8 67h-44.4zm-74.4 0-8.9-67h53.3v67h-44.4zm-69.1 0c-3.7 0-6.9-2.5-7.9-6l-16.5-61h54.2l8.9 67h-38.7zm56.2-97-9-67.8 66.3.3v67.6l-57.3-.1zm87.3 0v-67.4l66.1.3-8.9 67.2h-57.2zm-126.7-68 9 68h-58.3l-18.4-68.2 67.7.2zm237.8 165h-36.4l8.8-67h49l-14.1 61.2c-.8 3.4-3.8 5.8-7.3 5.8z'%3E%3C/path%3E%3C/svg%3E") no-repeat left center/contain;
}
.section_cart_01 .btn_cart_01 a {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 38 38'%3E%3Cpath fill='%232daadc' d='M16.5 35.5v-14h-14a2.5 2.5 0 0 1 0-5h14v-14a2.5 2.5 0 0 1 5 0v14h14a2.5 2.5 0 1 1 0 5h-14v14a2.5 2.5 0 1 1-5 0Z'/%3E%3C/svg%3E") no-repeat right 5.208vw center/3.906vw,#fff;
}
/*ページ内リンク*/
.section-page-nav{
    padding: 0;
}
.section-page-nav .nav-list-wrap{
    flex-wrap: wrap;
    position: relative;
}
.section-page-nav .nav-list-wrap::before{
    content: "";
    display:block;
    position:absolute;
    width:1px;
    height: 100%;
    background-image:linear-gradient( 180deg, rgb(48,187,242) 0%, rgb(46,202,228) 40%, rgb(44,216,213) 58%, rgb(197,193,255) 80%, rgb(255,186,195) 100%);
    top: 0;
    left: 50%;
    transform: translateX(-50%);
}
.section-page-nav .nav-list-wrap::after{
    content: "";
    display:block;
    position:absolute;
    height:1px;
    width: 100%;
    background-image:linear-gradient( 90deg, rgb(48,187,242) 0%, rgb(46,202,228) 40%, rgb(44,216,213) 58%, rgb(197,193,255) 80%, rgb(255,186,195) 100%);
    left: 0;
    /* top: 45%;
    transform: translateY(-50%); */
    top: 13.2vw;
}
.section-page-nav .nav-list-item{
    width: calc(100%/2);
    border: none;
    align-items: inherit;
}
.section-page-nav .nav-item{
    padding: 3.906vw;
    position:relative;
    display: flex;
    flex-direction: column;
}
.section-page-nav .nav-item::after{
    content: "";
    display:block;
    position: absolute;
    background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/arrow.svg)no-repeat center/contain;
    width: 2.604vw;
    height: 1.432vw;
    top: 9.815vw;
    left: 50%;
    transform: translateX(-50%);
}
/* .section-page-nav .nav-list-item:nth-of-type(3) .nav-item .small{
    margin-top: -1vw;
}
.section-page-nav .nav-list-item:nth-of-type(3) .nav-item::after{
    display: none;
} */
/*ポップアップ*/
.section-popup{
    background-color: #2daadc;
}
/*ボタン*/
#shirojyun_container .btn-cnt{
    padding: 0 6.51vw;
}
#shirojyun_container .btn-cnt .btn-01 a,
#shirojyun_container .btn-cnt .btn_cart_01 a{
    background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/arrow_02.svg)no-repeat center right 5.99vw/9.375vw;
    border: 2px solid #fff;
    border-radius: 7.161vw;
    box-shadow: 0px 0px 50px 0px rgba(255, 255, 255, 0.5);
    padding: 3.75vw 18.8333vw;
}
#shirojyun_container .btn-cnt .btn-01 a{
    background-color: #2cd8d5;
}
#shirojyun_container .btn-cnt .btn_cart_01 {
    margin-top: 5.208vw;
}
#shirojyun_container .btn-cnt .btn_cart_01 a{
    background-color: #ef80af;
}
/*mv-cnt
------------------------------------------*/
.mv-cnt h1{
    text-align: center;
}
/*sec-01
------------------------------------------*/
.bg-cnt-01{
    background:url(/-/Media/com/hadalabo/promo/shirojyun/2402/bg_series_2.jpg)no-repeat top center/cover;
}
#shirojyun_container .sec_01{
    padding-bottom: 9.522vw;
}
.sec_01 .ttl-cnt {
    color: #17a1e5;
    margin-bottom: 7.286vw;
}
.sec_01 .ttl-cnt .main-ttl{
    line-height: 1;
    margin-bottom: 2.604vw;
}
.sec_01 .items-cnt{
    display:flex;
    flex-wrap:wrap;
    justify-content: space-between;
    padding: 0 2.604vw;
    margin-bottom: 11.328vw;
}
.sec_01 .item-cnt{
    width: calc(100%/4);
}
.sec_01 .item-cnt a{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.sec_01 .item-cnt .img-cnt{
    display: flex;
    align-items: flex-end;
}
.sec_01 .item-cnt:nth-of-type(1) .img-cnt{
    width: 15.104vw;
}
.sec_01 .item-cnt:nth-of-type(2) .img-cnt{
    width: 19.401vw;
}
.sec_01 .item-cnt:nth-of-type(3) .img-cnt{
    width: 14.844vw;
}
.sec_01 .item-cnt:nth-of-type(4) .img-cnt{
    width: 22.266vw;
}
.sec_01 .item-cnt .img-cnt p{
    filter: drop-shadow(5.859vw 5.859vw 6.51vw rgba(49, 187, 242, 0.4));
}
.sec_01 .item-cnt h3{
    color: #164863;
    font-size: 3.125vw;
    line-height: 1.2;
    padding: 1.953vw 1vw;
    background-color: #fff;
    border-radius: 2.604vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    width: 19.531vw;
    margin: 4.3vw 0 auto;
}
.sec_01 .item-cnt h3::before{
    content: "";
    display: block;
    position: absolute;
    border-radius: 2.604vw;
    border: 2px solid transparent;
    background:linear-gradient( 90deg, rgb(48,187,242) 0%, rgb(46,202,228) 40%, rgb(44,216,213) 58%, rgb(197,193,255) 80%, rgb(255,186,195) 100%) border-box border-box;
    -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0) border-box;
    -webkit-mask-composite: destination-out;
    mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0) border-box;
    mask-composite: exclude;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
}
.sec_01 .item-cnt h3::after{
    content: "";
    display: block;
    position: absolute;
    background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/arrow.svg)no-repeat center/contain;
    width: 3.255vw;
    height: 1.823vw;
    top: 9.615vw;
    left: 50%;
    transform: translateX(-50%);
}
/*sec-02
------------------------------------------*/
#shirojyun_container .sec_02{
    padding: 0;
}
.sec_02 .ttl-wrap{
    margin-bottom: 21.438vw;
    text-align: center;
}
.sec_02 h2{
    font-size: 8.333vw;
    font-weight: bold;
    font-style: italic;
    line-height: 1.2;
    /* text-shadow: 0px 0px 15.625vw rgba(255, 255, 255, 0.8);
    background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/txt_layer.png) no-repeat center center/cover,#17a1e5;
    background-clip: text;
    -webkit-background-clip: text; */
    color: transparent;
    display: inline-block;
    position: relative;
    /* z-index: 3; */
}  
.sec_02 h2 .big{
    font-size: 175%;
    position: relative;
    /* z-index: 2; */
    /* background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/txt_layer.png) no-repeat center bottom -40vw/134% auto,#17a1e5;
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent; */
    text-shadow: 0px 0px 13.625vw rgb(255 255 255 / 80%), 0px 0px 13.625vw rgb(255 255 255 / 80%), 0px 0px 13.625vw rgb(255 255 255 / 80%), 0px 0px 13.625vw rgb(255 255 255 / 80%);
}
.sec_02 h2 .big-02{
    font-size: 110%;
    letter-spacing: -0.1em;
    position: relative;
    /* z-index: 2;
    background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/txt_layer.png) no-repeat center bottom -40vw/134% auto,#17a1e5;
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent; */
    text-shadow: 0px 0px 13.625vw rgb(255 255 255 / 80%), 0px 0px 13.625vw rgb(255 255 255 / 80%), 0px 0px 13.625vw rgb(255 255 255 / 80%), 0px 0px 13.625vw rgb(255 255 255 / 80%);
}
.sec_02 h2 .big::before{
    content: "顔も体も、";
    position: absolute;
    background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/txt_layer.png) no-repeat center bottom -40vw/134% auto,#17a1e5;
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    left: 0;
    text-shadow: none;
}
.sec_02 h2 .big-02::before{
    content: "うるおってちゅるもち！";
    position: absolute;
    background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/txt_layer.png) no-repeat center bottom -40vw/134% auto,#17a1e5;
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    left: 0;
    text-shadow: none;
}
/*図説*/
.sec_02 .cnt-01-wrap{
    padding-top: 17.021vw;
    /* width: 100%; */
    height: 100%;
    background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/bg_wave.jpg) no-repeat center top/cover;
    width: calc(100% + 5vw);
    margin: 0 -2.5vw 0 -2.5vw;
}
.sec_02 .cnt-01{
    /* margin-bottom: 27.344vw; */
}
.sec_02 .cnt-01 .items-cnt{
    display: flex;
    justify-content: space-between;
    padding: 20.182vw 4.818vw 8.333vw 4.818vw;
    background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/bg_bal.png)no-repeat center/100% 100%;
    filter: drop-shadow(0px 0px 6.51vw rgba(49, 187, 242, 0.5));
    width: 89.583vw;
    margin: 0 auto;
    position: relative;
}
.sec_02 .cnt-01 .item-cnt{
    width: 37.76vw;
}
.sec_02 .cnt-01 .img-cnt{
    margin-bottom: 4.688vw;
}
/*角質*/
#shirojyun_container .sec_02 .cnt-01 .txt{
    color: #62a1b2;
    font-size: 2.604vw;
    writing-mode: vertical-rl;
    position:absolute;
    top: 31.901vw;
    left: 50%;
    transform: translateX(-50%);
}
/*バブル*/
.sec_02 .cnt-02 {
    padding-top: 27.344vw;
}
.sec_02 .cnt-02 .items-cnt{
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 5.208vw;
}
.sec_02 .cnt-02 .item-cnt h3{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 50.521vw;
    height: 52.344vw;
    background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/bubble_01.png)no-repeat center/cover;
    filter: drop-shadow(2.51vw 10.51vw 3.51vw rgba(49, 187, 242, 0.25));
    position: relative;
}
.sec_02 .cnt-02 .item-cnt:nth-of-type(n+3) h3{
    background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/bubble_02.png)no-repeat center/cover;
}
.sec_02 .cnt-02 .item-cnt:nth-of-type(2){
    margin-left: -7vw;
    margin-top: 22.135vw;
}
.sec_02 .cnt-02 .item-cnt:nth-of-type(3){
    margin-top: -13.151vw;
    z-index: 1;
}
.sec_02 .cnt-02 .item-cnt:nth-of-type(4){
    margin-left: -9vw;
    margin-top: 6vw;
}
.sec_02 .cnt-02 .item-cnt .ttl-02{
    text-align: center;
    margin-bottom: 3.208vw;
}
.sec_02 .cnt-02 .item-cnt .ttl-02 sup{
    font-size: 50%;
    font-weight: normal;
}
.sec_02 .cnt-02 .item-cnt span{
    font-size:3.125vw;
}
.sec_02 .cnt-02 .item-cnt span sup{
  font-size: 60%;
}
.sec_02 .cnt-02 .item-cnt .bub{
    line-height: 1.25;
    text-align: center;
    background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/bubble_03.png)no-repeat center/contain;
    padding-top: 5.208vw;
    width: 19.531vw;
    height: 21.094vw;
    right: -1.5vw;
    top: -1vw;
    position: absolute;
}
.sec_02 .txt-list-cnt{
    color: #62a1b2;
    font-size: 3.125vw;
    line-height: 1.45;
}
/* .txt-list-cnt .txt-list-item::before {
    content: "※";
    position: absolute;
    top: 0;
    left: 0;
} */
.sec_02 .cnt-03{
    padding: 24.542vw 0 27.048vw;
}
#shirojyun_container .sec_02 .cnt-03 p{
    font-size: 6.771vw;
    text-align: center;
}

/*sec-04
------------------------------------------*/
.bg-cnt-02{
    background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/bg_free_big.png)no-repeat bottom center/100% auto;
    position: relative;
}
.bg-cnt-02::before{
    content: "";
    position: absolute;
    width: 67.708vw;
    height: 104.167vw;
    top: -27.531vw;
    right: 0;
    background:url(/-/Media/com/hadalabo/promo/shirojyun/2402/bg_free_small.png)no-repeat center right/auto 100%;
}
#shirojyun_container .sec_04{
    padding-bottom: 12.042vw;
    position: relative;
}
.sec_04 .ttl-cnt{
    color: #17a1e5;
}
.sec_04 .items-cnt{
    position: relative;
    height: 95.443vw;
    margin-bottom: 4.557vw;
}
.sec_04 .item-cnt{
    text-align: center;
    width: 29.948vw;
    height: 29.948vw;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/circle.png)no-repeat center/contain;
    position: absolute;
}
.sec_04 .item-cnt:nth-of-type(1){
    top: 0;
    left: 16.276vw;
}
.sec_04 .item-cnt:nth-of-type(2){
    top: 0;
    right: 16.276vw;
}
.sec_04 .item-cnt:nth-of-type(3){
    top: 32.682vw;
}
.sec_04 .item-cnt:nth-of-type(4){
    top: 32.682vw;
    left: 50%;
    transform: translateX(-50%);
}
.sec_04 .item-cnt:nth-of-type(5){
    top: 32.682vw;
    right: 0;
}
.sec_04 .item-cnt:nth-of-type(6){
    bottom: 0;
    left: 16.276vw;
}
.sec_04 .item-cnt:nth-of-type(7){
    bottom: 0;
    right: 16.276vw;
}
.sec_04 .item-cnt h3{
    line-height: 1.167;
    letter-spacing: -0.01em;
}
.sec_04 .item-cnt sup {
    font-size: 50%;
}
.sec_04 .item-cnt .medium{
    font-size: 70%;
}
#shirojyun_container .sec_04 .atnt{
    color: #62a1b2;
    font-size: 3.125vw;
    line-height: 1.458;
    padding-left: 3.104vw;
    position: relative;
}
.sec_04 .atnt::before {
    content: "＊";
    position: absolute;
    top: 0;
    left: 0;
}


/*sec-05
------------------------------------------*/
#shirojyun_container .sec_05{
    padding-bottom: 15.042vw;
}
.sec_05 .ttl-cnt{
    color: #17a1e5;
}
.sec_05 .cnt-01{
    position: relative;
}
.sec_05 .cnt-01 > .img-cnt{
    width: 46.615vw;
    position: relative;
    z-index: 1;
}
.sec_05 .cnt-01 .item-cnt{
    border: 2px solid #2cd8d5;
    border-radius: 2.604vw;
    padding: 4.208vw 1.208vw;
    padding-left: 23.177vw;
    display: flex;
    align-items: center;
    gap: 0 3.646vw;
    width: 74.87vw;
    position: absolute;
    background-color: #fff;
}
.sec_05 .cnt-01 .item-cnt:nth-of-type(1){
    top: 8.854vw;
    right: 0;
}
.sec_05 .cnt-01 .item-cnt:nth-of-type(2){
    top: 51.646vw;
    right: 0;
}
.sec_05 .cnt-01 .item-cnt .img-cnt{
    width: 16.016vw;
}
.sec_05 .cnt-01 .item-cnt:nth-of-type(1) .img-cnt{
    padding: 0 1.563vw;
}
.sec_05 .cnt-01 .item-cnt .txt-cnt{
    flex: 1;
}
#shirojyun_container .sec_05 .cnt-01 .txt-cnt p:first-of-type{
    color: #2cd8d5;
    font-size: 4.688vw;
    font-weight: bold;
    width: 26.693vw;
    margin-bottom: 1.604vw;
}
.sec_05 .cnt-01 .txt-cnt p:last-of-type{
    letter-spacing: -0.1em;
}

/*sec-06
------------------------------------------*/
#shirojyun_container .sec_06{
    background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/bg_voice.jpg) top center/cover;
    /* padding: 17.188vw 0 37.109vw; */
    padding: 17.188vw 0 26.109vw;
}
#shirojyun_container .sec_06 .ttl-cnt .sub-ttl{
    margin-bottom: 10.286vw;
}
#shirojyun_container .sec_06 .voice-clm{
    margin: 0 2.604vw;
    position: relative;
}
#shirojyun_container .sec_06 .voice-clm + .voice-clm{
    margin-top: 9.328vw;
}
#shirojyun_container .sec_06 .voice-img{
    width: 78.125vw;
}
#shirojyun_container .sec_06 .voice-clm:nth-child(2n+1) .voice-img {
    margin-left: 11.458vw;
}
#shirojyun_container .sec_06 .voice-bubble{
    display: inline-block;
    border-radius: 2.604vw;
    box-shadow: 1.836vw 1.836vw 6.51vw 0 rgba(49, 187, 242, 0.2);
    background-color: #fff;
    padding: 5.534vw 6.12vw;
    font-size: 3.646vw;
    font-weight: normal;
    font-feature-settings: "palt";
    /* margin-top: -10.938vw; */
    /* position: absolute; */
    position: static;
    width: 90%;
    display: block;
    font-size: 4.688vw;
    text-align: center;
    line-height: 1.75;
    letter-spacing: 0.05em;
    margin: 0 auto;
}
#shirojyun_container .sec_06 .voice-clm:nth-child(2n) .voice-bubble {
    right: 0;
}

/*sec-07
------------------------------------------*/
#shirojyun_container .sec_07{
    padding-bottom: 24.609vw;
}
#shirojyun_container .sec_07 .ttl-cnt {
    color: #17a1e5;
    margin-bottom: 8.594vw;
}
#shirojyun_container .sec_07 .ttl-02{
    font-feature-settings: "palt";
}
#shirojyun_container .sec_07 .prodname{
    font-size: 2.604vw;
    font-weight: normal;
    color: #62a1b2;
    font-feature-settings: "palt";
    margin-bottom: 0.911vw;
}
#shirojyun_container .sec_07 .prodname > .category{
    border: 0.13vw solid #62a1b2;
    padding: 0 1.172vw;
    margin-left: 1.302vw;
}
#shirojyun_container .sec_07 .howto01{
    background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/bg_howto01.png)no-repeat top center/cover;
    height: 95.313vw;
    margin: 0 1.172vw 2.474vw;
}
#shirojyun_container .sec_07 .howto01 .howto-clm{
    padding-top: 14.453vw;
    padding-left: 4.036vw;
}
#shirojyun_container .sec_07 .howto01 .ttl-02{
    border-bottom: 0.26vw solid #2cd8d5;
    display: inline-block;
    padding-bottom: 4.036vw;
    margin-bottom: 5.339vw;
}
#shirojyun_container .sec_07 .howto01 .item-01{
    margin-left: 4.948vw;
    margin-bottom: 1.042vw;
    width: 30.599vw;
}
#shirojyun_container .sec_07 .howto02{
    background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/bg_howto02.png)no-repeat top center/cover;
    height: 105.729vw;
    margin: 0 1.172vw 2.344vw;
}
#shirojyun_container .sec_07 .howto02 .howto-clm{
    padding-top: 14.583vw;
    padding-left: 4.036vw;
}
#shirojyun_container .sec_07 .howto02 .ttl-02 {
    border-bottom: 0.26vw solid #c5c1ff;
    text-align: center;
    padding-bottom: 3.906vw;
    margin: 0 4.036vw 0 0;
}
#shirojyun_container .sec_07 .howto02 .pkg-wrap{
    color: #17a1e5;
    font-weight: normal;
    position: relative;
    padding-top: 15.755vw;
    margin-bottom: 1.042vw;
}
#shirojyun_container .sec_07 .howto02 .pkg-wrap .item-01{
    margin-left: 3.125vw;
    width: 46.094vw;
}
#shirojyun_container .sec_07 .howto02 .pkg-wrap .item-02 {
    position: absolute;
    top: 4.688vw;
    left: 2.714vw;
    line-height: 1.25;
    text-align: center;
    font-feature-settings: "palt";
}
#shirojyun_container .sec_07 .howto02 .pkg-wrap .item-03 {
    position: absolute;
    top: 13.932vw;
    left: 25.714vw;
    line-height: 1.25;
    text-align: center;
    font-feature-settings: "palt";
}
#shirojyun_container .sec_07 .howto03{
    background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/bg_howto03.png)no-repeat top center/cover;
    height: 108.333vw;
    margin: 0 1.172vw;
}
#shirojyun_container .sec_07 .howto03 .howto-clm {
    padding-top: 14.583vw;
    padding-left: 4.036vw;
}
#shirojyun_container .sec_07 .howto03 .ttl-wrap{
    border-bottom: 0.26vw solid #ffbac3;
    display: inline-block;
    font-feature-settings: "palt";
    font-weight: normal;
    padding: 0 2.474vw 4.167vw;
}
#shirojyun_container .sec_07 .howto03 .ttl-02 {
    display: inline-block;
    margin-bottom: 1.042vw;
}
#shirojyun_container .sec_07 .howto03 .pkg-wrap{
    position: relative;
    margin-bottom: 0.26vw;
}
#shirojyun_container .sec_07 .howto03 .pkg-wrap .item-01{
    padding-top: 11.198vw;
    padding-left: 2.604vw;
    width: 39.844vw;
}
#shirojyun_container .sec_07 .howto03 .pkg-wrap .item-02{
    font-weight: normal;
    color: #17a1e5;
    font-feature-settings: "palt";
    position: absolute;
    top: 4.297vw;
    left: 12.37vw;
}

/*sec-08
------------------------------------------*/
#shirojyun_container .sec_08 {
    background: #edf6fa;
}
#shirojyun_container .sec_08 #cat1,
#shirojyun_container .sec_08 #cat2 {
    margin-bottom: 26.042vw;
}
#shirojyun_container .sec_08 .ttl-cnt {
    margin-bottom: 13.802vw;
}
#shirojyun_container .sec_08 .category-ttl {
    position: relative;
    text-align: center;
    margin-bottom: 7.943vw;
}
#shirojyun_container .sec_08 .category-ttl:before {
    position: absolute;
    top: calc(50% - 0.13vw);
    left: 0;
    width: 100%;
    height: 0.26vw;
    content: '';
    background: #17a1e5;
}
#shirojyun_container .sec_08 .category-ttl span {
    font-size: 4.688vw;
    color: #17a1e5;
    border-radius: 4.753vw;
    border: solid 0.26vw #17a1e5;
    background-color: #fff;
    text-align: center;
    display: inline-block;
    position: relative;
    padding: 1.042vw 4.818vw;
}
#shirojyun_container .sec_08 .prod-clm {
    background-color: #ffffff80;
    border-radius: 2.604vw;
    padding: 7.422vw 5.208vw 5.208vw;
    margin-bottom: 8.073vw;
}
#shirojyun_container .sec_08 .prod-clm .ttl-02 {
    font-feature-settings: "palt";
    line-height: 1.17;
    text-align: center;
}
#shirojyun_container .sec_08 .pkg-wrap {
    position: relative;
    margin-bottom: 2.995vw;
}
#shirojyun_container .sec_08 .pkg-wrap .item-01 {
    position: absolute;
    left: 33.464vw;
    top: 4.688vw;
}
#shirojyun_container .sec_08 .pkg-wrap .item-02 {
    position: absolute;
    left: 51.172vw;
    top: 41.406vw;
}
#shirojyun_container .sec_08 .pkg-wrap .item-03 {}
#shirojyun_container .sec_08 .pkg-wrap .category {
    font-size: 2.604vw;
    font-weight: normal;
    color: #62a1b2;
    border: 0.13vw solid #62a1b2;
    writing-mode: vertical-rl;
    padding: 1.042vw 0.521vw 1.042vw 0.26vw;
    line-height: 1;
}
#shirojyun_container .sec_08 .pkg-wrap .copy {
    font-weight: bold;
    position: relative;
    padding-top: 63.542vw;
    text-align: center;
    color: #17a1e5;
}
#shirojyun_container .sec_08 .prod-txt-list {
    font-size: 2.604vw;
    font-weight: normal;
    line-height: 2;
    margin-bottom: 6.25vw;
    color: #62a1b2;
}
#shirojyun_container .sec_08 .prod-txt-list dt {
    float: left;
}
#shirojyun_container .sec_08 .prod-txt-list dd {}
#shirojyun_container .sec_08 .slide-wrap {
    background: #fff;
    border-radius: 2.604vw;
    margin: 0 1.172vw;
    padding: 5.208vw 5.208vw 4.167vw;
}
#shirojyun_container .sec_08 .slide-wrap .item-01 {
    margin-bottom: 4.167vw;
}
#shirojyun_container .sec_08 .slide-wrap .item-02 {
    text-align: center;
    font-feature-settings: "palt";
}
#shirojyun_container .sec_08 .products+.products {
    margin-top: 15.625vw;
}
#shirojyun_container .sec_08 .prod-01 .pkg-wrap .item-01 {
    width: 17.318vw;
}
#shirojyun_container .sec_08 .prod-02 .pkg-wrap .item-01 {
    width: 16.797vw;
    left: 33.854vw;
    top: 4.818vw;
}
#shirojyun_container .sec_08 .prod-03 .pkg-wrap .item-01 {
    width: 22.656vw;
    left: 30.599vw;
    top: 4.557vw;
}
#shirojyun_container .sec_08 .prod-04 .pkg-wrap .item-01 {
    width: 22.656vw;
    left: 30.729vw;
    top: 4.818vw;
}
#shirojyun_container .sec_08 .prod-05 .pkg-wrap .item-01 {
    width: 17.969vw;
    left: 33.203vw;
    top: 5.859vw;
}
#shirojyun_container .sec_08 .prod-06 .pkg-wrap .item-01 {
    width: 30.859vw;
    left: 26.693vw;
    top: 4.557vw;
}
#shirojyun_container .sec_08 .prod-01 .pkg-wrap .item-02 {}
#shirojyun_container .sec_08 .prod-02 .pkg-wrap .item-02 {}
#shirojyun_container .sec_08 .prod-03 .pkg-wrap .item-02 {
    left: 53.646vw;
    top: 41.146vw;
}
#shirojyun_container .sec_08 .prod-04 .pkg-wrap .item-02 {
    left: 53.646vw;
}
#shirojyun_container .sec_08 .prod-05 .pkg-wrap .item-02 {
    top: 41.016vw;
}
#shirojyun_container .sec_08 .prod-06 .pkg-wrap .item-02 {
    left: 57.422vw;
    top: 36.589vw;
}
#shirojyun_container .sec_08 .prod-01 .pkg-wrap .item-03 {}
#shirojyun_container .sec_08 .prod-02 .pkg-wrap .item-03 {}
#shirojyun_container .sec_08 .prod-03 .pkg-wrap .item-03 {}
#shirojyun_container .sec_08 .prod-04 .pkg-wrap .item-03 {}
#shirojyun_container .sec_08 .prod-05 .pkg-wrap .item-03 {
    padding-top: 63.151vw;
}
#shirojyun_container .sec_08 .prod-06 .pkg-wrap .item-03 {
    padding-top: 58.854vw;
}
#shirojyun_container .sec_08 .prod-03 .prod-txt-list,
#shirojyun_container .sec_08 .prod-04 .prod-txt-list,
#shirojyun_container .sec_08 .prod-05 .prod-txt-list,
#shirojyun_container .sec_08 .prod-06 .prod-txt-list {
    margin-bottom: 0;
}
#shirojyun_container .sec_08 .prod-03 .prod-clm,
#shirojyun_container .sec_08 .prod-04 .prod-clm,
#shirojyun_container .sec_08 .prod-05 .prod-clm,
#shirojyun_container .sec_08 .prod-06 .prod-clm {
    padding-bottom: 3.646vw;
}


/* ----------------------------------------
        PC
----------------------------------------- */
@media screen and (min-width: 769px) {
    /*共通*/
    #shirojyun_container .section {
        padding: 109px 0 150px;
    }
    /*動き*/
    /*フェードイン*/
    .js-fadeIn {
        transform: translate3d(0, -50px, 0);
        opacity: 0;
    }
    @keyframes fadeIn {
        0% {
            transform: translate3d(0, -50px, 0);
            opacity: 0;
        }
        100% {
            transform: translate3d(0, 0, 0);
            opacity: 1;
        }
    }
    /*テキスト系*/
    #shirojyun_container p {
        font-size: 1.1786em;
    }
    #shirojyun_container .medium {
        /* font-size: 80%; */
    }
    #shirojyun_container .small {
        /* font-size: 60%; */
    }
    #shirojyun_container .x-small {
        /* font-size: 50%; */
    }
    #shirojyun_container .ttl-02 {
        font-size: 1.7143em;
    }
    /*タイトル*/
    #shirojyun_container .ttl-cnt {
        margin-bottom: 60px;
    }
    #shirojyun_container .ttl-cnt .main-ttl {
        font-size: 3.0357em;
        margin-bottom: 6px;
    }
    #shirojyun_container .ttl-cnt .sub-ttl {
        font-size: 0.8214em;
        letter-spacing: initial;
    }

    /*ボタン*/
    #shirojyun_container .btn-cnt {
        padding: 0;
        flex-direction: row;
        display: flex;
        justify-content: center;
        gap: 0 20px;
    }
    #shirojyun_container .btn-cnt .btn-01 a,
    #shirojyun_container .btn-cnt .btn_cart_01 a {
        background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/arrow_02.svg)no-repeat center right 28px/36px;
        border: 1px solid #fff;
        border-radius: 35px;
        box-shadow: 0px 0px 50px 0px rgba(255, 255, 255, 0.5);
        padding: 20px 57px;
    }
    #shirojyun_container .btn-cnt .btn-01 a {
        background-color: #2cd8d5;
    }
    #shirojyun_container .btn-cnt .btn_cart_01{
        margin-top: 0;
    }
    #shirojyun_container .btn-cnt .btn_cart_01 a {
        background-color: #ef80af;
    }
    /*ページ内リンク*/
    .section-page-nav{
        padding: 25px 0;
    }
    .section-page-nav .nav-list-wrap{
        max-width: 1080px;
        margin: 0 auto;
        justify-content: space-between;
        flex-wrap: inherit;
    }
    .section-page-nav .nav-list-wrap::before,
    .section-page-nav .nav-list-wrap::after{
        display: none;
    }
    .section-page-nav .nav-list-item{
        width: calc(100%/4);
        border-left: 1px solid;
        border-image: linear-gradient( to bottom, rgb(48,187,242) 0%, rgb(46,202,228) 40%, rgb(44,216,213) 58%, rgb(197,193,255) 80%, rgb(255,186,195) 100%) 1;
    }
    .section-page-nav .nav-item{
        color: #164863;
        padding: 8px 0 25px;
    }
    .section-page-nav .nav-list-item:nth-of-type(3) .nav-item{
        padding-bottom: 10px;
    }
    .section-page-nav .nav-list-item:nth-of-type(3) .nav-item .small{
        margin-top: -2px;
    }
    .section-page-nav .nav-item::after{
        width: 16px;
        height: 8px;
        top: 36px;
    }
    /*追従購入リンク*/
    #shirojyun_container #float-purchase #float-purchase-cnt .purchase-list {
        margin-top: 44px;
        margin-left: 30px;
    }
    #shirojyun_container #float-purchase #float-purchase-cnt .purchase-list li a {
        padding-top: 6%;
        padding-bottom: 5%;
    }

/*mv-cnt
------------------------------------------*/

/*sec-01
------------------------------------------*/
    .bg-cnt-01 {
        background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/bg_series_pc_2.jpg)no-repeat top 30% center/cover;
    }
    #shirojyun_container .sec_01{
        padding-bottom: 50px;
    }
    .sec_01 .inner{
        max-width: 940px;
    }
    .sec_01 .item-cnt .img-cnt{
        justify-content: space-evenly;
    }
    .sec_01 .items-cnt{
        max-width: 908px;
        margin: 0 auto 80px;
        padding: 0;
    }
    .sec_01 .item-cnt:nth-of-type(1) .img-cnt{
        width: 173px;
    }
    .sec_01 .item-cnt:nth-of-type(2) .img-cnt{
        width: 215px;
    }
    .sec_01 .item-cnt:nth-of-type(3) .img-cnt{
        width: 74px;
    }
    .sec_01 .item-cnt:nth-of-type(4) .img-cnt{
        width: 114px;
    }
    .sec_01 .item-cnt .img-cnt p{
        filter: drop-shadow(30px 30px 50px rgba(49, 187, 242, 0.35));
    }
    .sec_01 .item-cnt h3{
        font-size: 1.143em;
        line-height: 1;
        padding: 9px 5px;
        border-radius: 17px;
        flex-direction: row;
        align-items: flex-end;
        margin-top: 20px;
        width: 170px;
    }
    .sec_01 .item-cnt h3::before{
        border-radius: 17px;
    }
    .sec_01 .item-cnt h3::after{
        width: 16px;
        height: 8px;
        bottom: 0;
        top: 31px;
    }
    .sec_01 .btn-01,
    .sec_01 .btn_cart_01{
        margin: inherit;
    }
/*sec-02
------------------------------------------*/
    #shirojyun_container .sec_02{
        padding-top: 50px;
    }
    .sec_02 .cnt-01-wrap{
        width: 100%;
        height: 100%;
        background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/bg_wave_pc.jpg) no-repeat center top/cover;
        max-width: 1120px;
        margin: 0 auto;
        padding-top: 100px;
    }
    .sec_02 .ttl-wrap{
        margin-bottom: 115px;
    }
    .sec_02 .inner{
        max-width: 1120px;
    }
    .sec_02 h2{
        font-size: 3em;
        /* text-shadow: 0px 0px 80px rgba(255, 255, 255, 0.9); */
    }
    .sec_02 h2 .big{
        text-shadow: 0px 0px 100px rgb(255 255 255 / 100%),0px 0px 100px rgb(255 255 255 / 100%),0px 0px 100px rgb(255 255 255 / 100%);
    }
    .sec_02 h2 .big-02{
        font-size: 125%;
        text-shadow: 0px 0px 100px rgb(255 255 255 / 100%),0px 0px 100px rgb(255 255 255 / 100%),0px 0px 100px rgb(255 255 255 / 100%);
    }
    .sec_02 h2 .big::before{
        background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/txt_layer.png) no-repeat center top 45%/150% auto,#17a1e5;
        background-clip: text;
        -webkit-background-clip: text;
    }
    .sec_02 h2 .big-02::before{
        background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/txt_layer.png) no-repeat center bottom 40%/150% auto,#17a1e5;
        background-clip: text;
        -webkit-background-clip: text;
    }
    /*図説*/
    .sec_02 .cnt-01{
        margin-bottom: 0px;
    }
    .sec_02 .cnt-01 .items-cnt{
        padding:119px 80px 40px;
        background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/bg_bal_pc.png)no-repeat center/100% 100%;
        filter: drop-shadow(0px 0px 100px rgba(49, 187, 242, 0.5));
        width: 750px;;
    }
    .sec_02 .cnt-01 .item-cnt{
        width: 250px;
    }
    .sec_02 .cnt-01 .img-cnt{
        text-align: center;
        margin-bottom: 40px;
    }
    /*バブル*/
    .sec_02 .cnt-02{
        padding-top: 120px;
    }
    .sec_02 .cnt-02 .items-cnt{
        max-width: 940px;
        margin: 0 auto;
        flex-direction: row;
        position: relative;
        height: 415px;
    }
    .sec_02 .cnt-02 .item-cnt{
        width: 267px;
        height: 277px;
        position: absolute;
    }
    .sec_02 .cnt-02 .item-cnt h3{
        width: inherit;
        height: inherit;
        filter: drop-shadow(70px 70px 50px rgba(49, 187, 242, 0.25));
    }
    .sec_02 .cnt-02 .item-cnt:nth-of-type(2),
    .sec_02 .cnt-02 .item-cnt:nth-of-type(3),
    .sec_02 .cnt-02 .item-cnt:nth-of-type(4){
        margin: 0;
    }
    .sec_02 .cnt-02 .item-cnt:nth-of-type(1){
        left: 36px;
    }
    .sec_02 .cnt-02 .item-cnt:nth-of-type(2){
        left: 225px;
        top: 161px;
        width: 218px;
        height: 226px;
        z-index: 2;
    }
    .sec_02 .cnt-02 .item-cnt:nth-of-type(3){
        left: inherit;
        right: 207px;
        top: -20px;
        width: 245px;
        height: 239px;
        z-index: 1;
    }
    .sec_02 .cnt-02 .item-cnt:nth-of-type(4){
        top: 135px;
        right: 40px;
        width: 263px;
        height: 256px;
    }
    .sec_02 .cnt-02 .item-cnt .ttl-02{
        margin-bottom: 10px;
    }
    .sec_02 .cnt-02 .item-cnt span{
        font-size: 1.143em;
    }
    .sec_02 .cnt-02 .item-cnt .bub{
        line-height: 1.5;
        padding-top: 20px;
        width: 101px;
        height: 109px;
        right: -12px;
        top: -7px;    
    }
    .sec_02 .cnt-02 .item-cnt:nth-of-type(2) .bub{
        top: -18px;
        right: -18px;
    }
    .sec_02 .txt-list-cnt{
        font-size: 0.714em;
        line-height: 1.5;
    }
    .sec_02 .txt-list-cnt{
        margin-top: -90px;
    }
    .sec_02 .cnt-03{
        padding: 130px 0 20px;
    }
    #shirojyun_container .sec_02 .cnt-03 p{
        font-size: 2.571em;
    }

/*sec-04
------------------------------------------*/
    .bg-cnt-02{
        background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/bg_free_big_pc.png)no-repeat bottom 100px center/auto;
    }
    .bg-cnt-02::before{
        width: 517px;
        height: 402px;
        top: -140px;
        background:url(/-/Media/com/hadalabo/promo/shirojyun/2402/bg_free_small_pc.png)no-repeat center right/auto 100%;
    }
    #shirojyun_container .sec_04{
        padding-top: 170px;
        padding-bottom: 60px;
    }
    .sec_04{
        padding-top: 165px;
    }
    .sec_04 .items-cnt{
        height: 360px;
        max-width: 940px;
        margin: 0 auto 20px;
    }
    .sec_04 .item-cnt{
        width: 170px;
        height: 170px;
    }
    .sec_04 .item-cnt:nth-of-type(1){
        left: 197px;
        top: 0;
    }
    .sec_04 .item-cnt:nth-of-type(2){
        right: 50%;
        transform: translateX(50%);
    }
    .sec_04 .item-cnt:nth-of-type(3){
        top: 0;
        right: 197px;
    }
    .sec_04 .item-cnt:nth-of-type(4){
        top: inherit;
        bottom: 0;
        left: 101px;
        transform: none;
    }
    .sec_04 .item-cnt:nth-of-type(5){
        top: inherit;
        left: 291px;
        right: inherit;
        bottom: 0;
    }
    .sec_04 .item-cnt:nth-of-type(6){
        right: 291px;
        bottom: 0;
        left: inherit;
    }
    .sec_04 .item-cnt:nth-of-type(7){
        right: 101px;
        bottom: 0;
    }
    #shirojyun_container .sec_04 .ttl-02 sup {
        font-size: 50%;
      }
    #shirojyun_container .sec_04 .atnt{
        font-size: 0.714em;
        padding-left: 1em;
    }
/*sec-05
------------------------------------------*/
    #shirojyun_container .sec_05{
        padding-bottom: 120px;
    }
    .sec_05 .cnt-01{
        max-width: 940px;
        margin: 0 auto;
    }
    .sec_05 .cnt-01 > .img-cnt{
        width: 305px;
        margin: 0 auto;
    }
    .sec_05 .cnt-01 .item-cnt{
        border: 1px solid #2cd8d5;
        border-radius: 10px;
        padding: 20px 40px;
        gap: 40px;
        width: 468px;    
    }
    .sec_05 .cnt-01 .item-cnt:nth-of-type(1){
        top: 57px;
        right: calc(50% - 25%);
        transform: translateX(50%);
        padding-left: 120px;
    }
    .sec_05 .cnt-01 .item-cnt:nth-of-type(2){
        left: 25px;
        right: inherit;
        bottom: inherit;
        top: 250px;
        gap: 20px;
    }    
    .sec_05 .cnt-01 .item-cnt .img-cnt{
        width: 80px;
    }
    .sec_05 .cnt-01 .item-cnt:nth-of-type(1) .img-cnt {
        padding: 0 8px;
    }
    #shirojyun_container .sec_05 .cnt-01 .txt-cnt p:first-of-type{
        font-size: 1.714em;
        margin-bottom: 10px;
        width: inherit;
    }

/*sec-06
------------------------------------------*/
#shirojyun_container .sec_06 {
    background: #edf6fa;
}
#shirojyun_container .sec_06 .ttl-cnt .sub-ttl {
    margin-bottom: 0;
}
#shirojyun_container .sec_06 .voice-wrap {
    display: flex;
    justify-content: space-between;
    margin: 0 1.786%;
}
#shirojyun_container .sec_06 .voice-clm {
    margin: 0;
    /* width: 27.778%; */
    width: 31.778%;
    display: flex;
    flex-direction: column;
    align-items: center;
}
#shirojyun_container .sec_06 .voice-clm+.voice-clm {
    margin-top: 0;
}
#shirojyun_container .sec_06 .voice-img {
    width: auto;
}
#shirojyun_container .sec_06 .voice-clm:nth-child(2n+1) .voice-img {
    margin-left: 0;
}
#shirojyun_container .sec_06 .voice-bubble {
    border-radius: 10px;
    box-shadow: 0px 10px 30px 0 rgba(49, 187, 242, 0.2);
    padding: 25px;
    /* margin-top: -50px; */
    position: static;
    /* font-size: 1.1429em; */
    font-size: 1.3em;
    line-height: 2em;
    letter-spacing: 0.05em;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    justify-content: center;
}
#shirojyun_container .sec_06 .voice-clm:nth-child(2n) .voice-bubble {
    right: initial;
}

/*sec-07
------------------------------------------*/
#shirojyun_container .sec_07 {
    padding-top: 138px;
    padding-bottom: 175px;
}
#shirojyun_container .sec_07 .ttl-cnt {
    margin-bottom: 53px;
}
#shirojyun_container .sec_07 .ttl-02 {}
#shirojyun_container .sec_07 .prodname {
    font-size: 0.8214em;
    margin-bottom: 7px;
    margin-left: 23px;
}
#shirojyun_container .sec_07 .prodname>.category {
    border-width: 1px;
    padding: 1px 6px;
    margin-left: 8px;
}
#shirojyun_container .sec_07 .howto-wrap {
    display: flex;
    justify-content: space-between;
}
#shirojyun_container .sec_07 .howto01 {
    background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/bg_howto01_pc.png)no-repeat top center/100% 100%;
    height: 489px;
    width: 32.143%;
    margin: 0;
}
#shirojyun_container .sec_07 .howto01 .howto-clm {
    padding-top: 68px;
    padding-left: 0;
}
#shirojyun_container .sec_07 .howto01 .ttl-02 {
    border-width: 1px;
    text-shadow: 0 0 15px #fff;
    text-align: center;
    padding-bottom: 12px;
    margin-left: 15px;
    margin-bottom: 34px;
    width: 86.111%;
}
#shirojyun_container .sec_07 .howto01 .item-01 {
    margin-left: 26px;
    margin-bottom: 22px;
    width: 170px;
}
#shirojyun_container .sec_07 .howto02 {
    background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/bg_howto02_pc.png)no-repeat top center/100% 100%;
    height: 489px;
    width: 32.143%;
    margin: 0;
}
#shirojyun_container .sec_07 .howto02 .howto-clm {
    padding-top: 71px;
    padding-left: 0;
}
#shirojyun_container .sec_07 .howto02 .ttl-02 {
    border-width: 1px;
    line-height: 1.25;
    padding-bottom: 16px;
    margin: 0 0 0 10px;
    width: 88.611%;
}
#shirojyun_container .sec_07 .howto02 .pkg-wrap {
    padding-top: 64px;
    margin-bottom: 11px;
}
#shirojyun_container .sec_07 .howto02 .pkg-wrap .item-01 {
    margin-left: 26px;
    width: 193px;
}
#shirojyun_container .sec_07 .howto02 .pkg-wrap .item-02 {
    top: 17px;
    left: 24px;
    line-height: 1.21;
}
#shirojyun_container .sec_07 .howto02 .pkg-wrap .item-03 {
    top: 60px;
    left: 114px;
    line-height: 1.21;
}
#shirojyun_container .sec_07 .howto03 {
    background: url(/-/Media/com/hadalabo/promo/shirojyun/2402/bg_howto03_pc.png)no-repeat top center/100% 100%;
    height: 489px;
    width: 32.143%;
    margin: 0;
}
#shirojyun_container .sec_07 .howto03 .howto-clm {
    padding-top: 67px;
    padding-left: 24px;
}
#shirojyun_container .sec_07 .howto03 .ttl-wrap {
    border-bottom: none;
    padding: 0;
}
#shirojyun_container .sec_07 .howto03 .ttl-wrap::after {
    content: "";
    display: block;
    width: 225px;
    height: 1px;
    background-color: #ffbac3;
    margin-top: 14px;
    margin-left: -9px;
}
#shirojyun_container .sec_07 .howto03 .ttl-02 {
    margin-bottom: 5px;
}
#shirojyun_container .sec_07 .howto03 .pkg-wrap {
    margin-bottom: 11px;
}
#shirojyun_container .sec_07 .howto03 .pkg-wrap .item-01 {
    padding-top: 45px;
    padding-left: 1px;
    width: auto;
}
#shirojyun_container .sec_07 .howto03 .pkg-wrap .item-02 {
    top: 16px;
    left: 45px;
}
#shirojyun_container .sec_07 .howto03 .prodname {
    margin-left: 0;
}

/*sec-08
------------------------------------------*/
#shirojyun_container .sec_08 {
    padding-bottom: 200px;
}
#shirojyun_container .sec_08 #cat1,
#shirojyun_container .sec_08 #cat2 {
    margin-bottom: 101px;
}
#shirojyun_container .sec_08 .ttl-cnt {
    margin-bottom: 81px;
}
#shirojyun_container .sec_08 .category-ttl {
    margin-bottom: 40px;
}
#shirojyun_container .sec_08 .category-ttl:before {
    top: calc(50% - 0.5px);
    height: 1px;
}
#shirojyun_container .sec_08 .category-ttl span {
    font-size: 1.4545em;
    border-radius: 21px;
    border-width: 1px;
    padding: 2px 23px;
}
#shirojyun_container .sec_08 .products-wrap {
    display: flex;
    justify-content: space-between;
}
#shirojyun_container .sec_08 .products {
    width: 47.321%;
}
#shirojyun_container .sec_08 .prod-clm {
    border-radius: 20px;
    padding: 37px 0 40px;
    margin-bottom: 40px;
}
#shirojyun_container .sec_08 .prod-clm .ttl-02 {
    line-height: 1.25;
}
#shirojyun_container .sec_08 .pkg-wrap {
    margin-bottom: 12px;
}
#shirojyun_container .sec_08 .pkg-wrap .item-01 {
    left: calc(58.113% - 90px);
    top: 16px;
}
#shirojyun_container .sec_08 .pkg-wrap .item-02 {
    left: 58.113%;
    top: 214px;
}
#shirojyun_container .sec_08 .pkg-wrap .item-03 {}
#shirojyun_container .sec_08 .pkg-wrap .category {
    font-size: 0.8214em;
    border-width: 1px;
    padding: 3px 3px 6px 1px;
}
#shirojyun_container .sec_08 .pkg-wrap .copy {
    padding-top: 316px;
    font-size: 1.2857em;
}
#shirojyun_container .sec_08 .prod-txt-list {
    font-size: 0.8214em;
    margin-bottom: 69px;
    margin-left: 39px;
    clear: both;
}
#shirojyun_container .sec_08 .prod-txt-list dt {}
#shirojyun_container .sec_08 .prod-txt-list dd {
    float: left;
}
#shirojyun_container .sec_08 .prod-txt-list dd+dt {
    margin-left: 23px;
}
#shirojyun_container .sec_08 .slide-wrap {
    border-radius: 20px;
    margin: 0px 40px;
    padding: 20px 20px 15px;
}
#shirojyun_container .sec_08 .slide-wrap .item-01 {
    margin-bottom: 5px;
}
#shirojyun_container .sec_08 .slide-wrap .item-02 {
    font-size: 1.2857em;
}
#shirojyun_container .sec_08 .products+.products {
    margin-top: 0;
}
#shirojyun_container .sec_08 .prod-01 .pkg-wrap .item-01 {
    width: 90px;
}
#shirojyun_container .sec_08 .prod-02 .pkg-wrap .item-01 {
    width: 86px;
    left: 41.887%;
    top: 16px;
}
#shirojyun_container .sec_08 .prod-03 .pkg-wrap .item-01 {
    width: 117px;
    left: 39.057%;
    top: 16px;
}
#shirojyun_container .sec_08 .prod-04 .pkg-wrap .item-01 {
    width: 117px;
    left: 39.057%;
    top: 16px;
}
#shirojyun_container .sec_08 .prod-05 .pkg-wrap .item-01 {
    width: 93px;
    left: 41.321%;
    top: 18px;
}
#shirojyun_container .sec_08 .prod-06 .pkg-wrap .item-01 {
    width: 157px;
    left: 35.283%;
    top: 34px;
}
#shirojyun_container .sec_08 .prod-01 .pkg-wrap .item-02 {}
#shirojyun_container .sec_08 .prod-02 .pkg-wrap .item-02 {
    top: 213px;
    left: calc(41.887% + 85px);
}
#shirojyun_container .sec_08 .prod-03 .pkg-wrap .item-02 {
    left: calc(39.057% + 115px);
    top: 213px;
}
#shirojyun_container .sec_08 .prod-04 .pkg-wrap .item-02 {
    top: 212px;
    left: calc(39.057% + 116px);
}
#shirojyun_container .sec_08 .prod-05 .pkg-wrap .item-02 {
    top: 220px;
    left: calc(41.321% + 92px);
}
#shirojyun_container .sec_08 .prod-06 .pkg-wrap .item-02 {
    left: calc(35.283% + 155px);
    top: 198px;
}
#shirojyun_container .sec_08 .prod-01 .pkg-wrap .item-03 {}
#shirojyun_container .sec_08 .prod-02 .pkg-wrap .item-03 {}
#shirojyun_container .sec_08 .prod-03 .pkg-wrap .item-03 {}
#shirojyun_container .sec_08 .prod-04 .pkg-wrap .item-03 {}
#shirojyun_container .sec_08 .prod-05 .pkg-wrap .item-03 {
    padding-top: 311px;
}
#shirojyun_container .sec_08 .prod-06 .pkg-wrap .item-03 {
    padding-top: 312px;
    /* margin-bottom: 39px; */
}
#shirojyun_container .sec_08 .prod-03 .prod-txt-list,
#shirojyun_container .sec_08 .prod-04 .prod-txt-list,
#shirojyun_container .sec_08 .prod-05 .prod-txt-list,
#shirojyun_container .sec_08 .prod-06 .prod-txt-list {}
#shirojyun_container .sec_08 .prod-03 .prod-clm,
#shirojyun_container .sec_08 .prod-04 .prod-clm,
#shirojyun_container .sec_08 .prod-05 .prod-clm,
#shirojyun_container .sec_08 .prod-06 .prod-clm {
    padding-bottom: 56px;
}
}

/* ----------------------------------------
        タブレット
----------------------------------------- */
@media screen and (min-width: 769px) and (max-width: 980px) {
    .sec_04 .item-cnt:nth-of-type(1){
        left: 15%;
    }
    .sec_04 .item-cnt:nth-of-type(3){
        right: 15%;
    }
    .sec_04 .item-cnt:nth-of-type(4){
        left: 5%;
    }
    .sec_04 .item-cnt:nth-of-type(5){
        left: 28%;
    }
    .sec_04 .item-cnt:nth-of-type(6){
        right: 28%;
    }
    .sec_04 .item-cnt:nth-of-type(7){
        right: 5%;
    }
    .sec_05 .cnt-01 .item-cnt:nth-of-type(1){
        width: 360px;
        gap: 20px;
        padding-left: 90px;
    }
    .sec_05 .cnt-01 .item-cnt:nth-of-type(2){
        width: 400px;
        padding-left: 30px;
    }
    .sec_05 .cnt-01 .txt-cnt p:last-of-type .sp-mode-02{
        display: inline!important;
    }
}