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

/* ========================= [ base ] */

body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
form,
fieldset,
legend,
input,
button,
textarea,
p,
blockquote,
th,
td {
margin: 0 auto;
padding: 0;
overflow-x: hidden;
overflow: visible;
}

ul,
ol,
dl {
list-style: none;
}

img {
vertical-align:top;
	max-inline-size: 100%;
	max-block-size: 100%
}

body {
text-align: center;
font-family: メイリオ, Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Verdana, sans-serif;
-webkit-text-size-adjust:100%;
overflow-x: hidden;
}

a:hover, button:hover {
    filter: brightness(120%);
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;	
}
a,a:hover,a:visited{
    color: inherit;
	cursor: pointer;
	text-decoration: none;
}


a:hover, button:hover {
    filter: brightness(120%);
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;	
}
a:hover img, button:hover img {
    transform: scale(1.05,1.05);
    transition: 0.5s;
}

#sec04 a:hover img, #sec04 button:hover img {
    transform: scale(1.00,1.00);
    transition: 0.5s;
}

button{
    background-color: transparent;
    border: none;
    cursor: pointer;
    outline: none;
    padding: 0;
    appearance: none;
    background: none;
}


*,
::before,
::after {
  background-repeat: no-repeat; /* Set `background-repeat: no-repeat` to all elements and pseudo elements */
  box-sizing: inherit;
}
::before,
::after {
  text-decoration: inherit; /* Inherit text-decoration and vertical align to ::before and ::after pseudo elements */
  vertical-align: inherit;
}

:root {
	--swiper-navigation-size: 44px
}
* {
  padding: 0; /* Reset `padding` and `margin` of all elements */
  margin: 0;
}
body {
    opacity: 0; /* 最初は完全に透明 */
    animation: fadeIn 2s ease-in-out forwards; /* fadeInアニメーションを1秒かけて実行し、終了状態を維持 */
}
@keyframes fadeIn {
    from {
      opacity: 0;
    }
    to {
      opacity: 1;
    }
}


#dmm_ntgnavi {
    /*
    position: relative;
    z-index: 999;
    */
    position: fixed;
    z-index: 500;
    width: 100%;
    background: url(../images/common/bg_navimain.gif) center center repeat-x;
    border-bottom: 1px solid #ccc;
    border-top: 1px solid #ccc;
    font-size: 12px;
    font-family: 'メイリオ', 'Meiryo', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'ＭＳ Ｐゴシック', Verdana, sans-serif;
    display: flex;
    justify-content: space-between;
}

#dmm_ntgnavi ul {
    list-style: none;
    margin: 2px 0;
    padding: 0;
    display: flex;
    width: 50%;
}

#dmm_ntgnavi ul li {
    margin: 0 6px 0 0;
    line-height: 15px;
}

#dmm_ntgnavi .navi_left li > a {
    display: block;
    padding: 0 3px 0 8px;
    text-decoration: none;
    border: 1px solid #eee;
    border-radius: 3px;
}

#dmm_ntgnavi .navi_left li > a:hover {
    background: #eee;
    border: 1px solid #666;
    border-radius: 3px;
}

#dmm_ntgnavi .navi_left li > a span {
    display: block;
    padding: 9px 10px 7px 28px;
    color: #333;
    font-weight: bold;
}

#dmm_ntgnavi .navi_left li.dmm_top img {
    margin: 8px 5px 8px 0
}

#dmm_ntgnavi .navi_left li.ntg_top {
    margin-left: 10px;
}

#dmm_ntgnavi .navi_left li.ntg_top span {
    background: url(../images/common/bg_bt_olgtop.gif) 0 center no-repeat;
    font-size: min(2.9vw,12px);
}

#dmm_ntgnavi .navi_right {
    justify-content: flex-end;
    font-size: 10px;
}

#dmm_ntgnavi .navi_right li {
    margin: 0 10px 0 0;
    padding: 8px 5px;
}

#dmm_ntgnavi .arrow {
    padding-left: 14px;
    background: url(../images/common/arrow_common.gif) no-repeat left center;
}

#dmm_ntgnavi .tx-point {
    font-size: 16px;
    font-weight: bold;
    color: #ff4b4b !important;
}

#dmm_ntgnavi a {
  color: inherit;
  text-decoration: none;
}

#dmm_ntgnavi p {
    margin: 0;
    line-height: 2.6em;
}

#dmm_ntgnavi .clear {
    clear: both;
}


@media (min-width: 1024px) {
    .invisible-pc {
        display: none;
    }
}

/*:: ■■ SP ■■ ::*/
* {
    box-sizing: border-box; /* すべての要素にbox-sizingを適用 */
}
@media (max-width: 1024px) {
    .invisible-sp {
        display: none;
    }
}



  
/* ■ ■ここから■ ■ */

	#content {
        background: url(../images/common/bg.webp) repeat center;
	}




@media (min-width: 1570px) and (max-width: 2619px){
	#pc_dis.pc_dis_left {
		width: calc(100vw - 1016px);
		/*height: 92.5lvh;
		min-height: 737px;*/
        height: calc(100vh - 72px);
		position: fixed;
		right: auto;
		top: 0;
		bottom: 0;
		margin: auto 0;
		transition: left .3s ease-in-out;
		margin: 56px 0 16px 16px;
        background-image: url(../images/fv/kvpc.webp);
        background-image: image-set(url(../images/fv/kvpc.webp) 1x, url(../images/2x/fv/kvpc@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/fv/kvpc.webp) 1x, url(../images/2x/fv/kvpc@2x.webp) 2x);
        background-position: 22% 19%;
        background-repeat: no-repeat;
        background-size: 117%;
        background-size: cover;
	}
	#pc_dis.pc_dis_left .fv {
		position: relative;
		top: 0;
		height: 96lvh;
		max-height: 900px;
	}
	#pc_dis.pc_dis_left .fv_con {
		position: absolute;
		width: 100%;
		/*height: 58.1805555556vw;*/
        height: 100%;  /* 親要素(#pc_dis)の高さに合わせる */
		overflow: hidden
	}
	#pc_dis.pc_dis_left .fv_con .capt {
		display: none;
		pointer-events: none;
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		margin: auto;
		left: auto;
		z-index: 3;
		width: 5.4305555556vw;
		top: 1.2vw;
        right: 1vw;
	}
	#pc_dis.pc_dis_left .fv_con .capt02 {
        display: block;
		pointer-events: none;
		position: absolute;
		left: 0;
		right: 1.3vw;
		top: 1.3vw;
		bottom: 0;
		margin: auto;
		left: auto;
		z-index: 3;
		width: 10%;
    }
	#pc_dis.pc_dis_left .fv_con .capt03 {
        display: block;
		pointer-events: none;
		position: absolute;
		/*
		right: 0;
        padding-top: 60%;
		bottom: 10vw;
        */
		left: 1.2vw;
        top: auto;
        bottom: 1.2vw;
		margin: auto;
		z-index: 3;
		width: 10%;
    }
    
	
	#pc_dis.pc_dis_left .fv_cta {
		position: absolute;
		width: 475px;
        max-width: 475px;
        height: 100%;
        max-height: 192px;
        right: 1.2vw;
        bottom: 20px;
		overflow: hidden;
	}
	#pc_dis.pc_dis_left .fv_cta02 {
		display: none;
	}

	#pc_dis.pc_dis_left .fv_cta ul {
		z-index: 4;
		position: absolute;
		display: flex;
        text-align: center;
		right: 0.6vw;
		bottom: 37px;
		width: 353px;
        height: 30px;
    }
	#pc_dis.pc_dis_left .fv_cta ul li {
        width: 36.5%;
        height: auto;
        margin-left: 10px;
        margin-right: 25px;
    }
	#pc_dis.pc_dis_left .fv_cta ul li:first-child {
        width: 29.5%;
        height: auto;
        margin-left: 0px;
        margin-right: 15px;
    }
	#pc_dis.pc_dis_left .fv_cta ul li img {
        position: inherit;
        width: auto;
        height: 100%;
        max-height: 42px;

	}
    


    #pc_dis.pc_dis_left .fv_cta .ntg-rule-box-area {
      position: absolute;
      width: 350px;
      right: -175px;
      bottom: -14px;
      transform: translateX(-50%);
      margin: 0 auto;
  }

  
    #pc_dis.pc_dis_left .fv_cta .ntg-rule-box {
      position: relative;
      clear: both;
      width: 350px;
      max-width: 350px;
      /*
      background: rgba(0, 0, 0, 0.4);
      padding: 7px 14px 5px 14px;
      */
      box-sizing: border-box;
      display: block;
      margin: 0 auto 10px auto;
      line-height: 1.8 !important;
      color: #fff;
      overflow: hidden;
  }
  
    #pc_dis.pc_dis_left .fv_cta .ntg-rule-info {
      float: left;
      text-align: left;
      font-size: 9px;
      line-height: 2.5;
      padding-right: 5px;
  }
  
  #pc_dis.pc_dis_left .fv_cta .ntg-rule-prof {
      float: left;
      text-align: left;
      font-size: 9px;
      line-height: 2.5;
      padding-right: 5px;
  }
  
  #pc_dis.pc_dis_left .fv_cta .ntg-rule-comname {
      float: left;
      text-align: left;
      font-size: 9px;
      line-height: 2.5;
  }
  
  #pc_dis.pc_dis_left .fv_cta .ntg-rule-box,
  #pc_dis.pc_dis_left .fv_cta .ntg-rule-box a,
  #pc_dis.pc_dis_left .fv_cta .ntg-rule-box a:hover,
  #pc_dis.pc_dis_left .fv_cta .ntg-rule-box label,
  #pc_dis.pc_dis_left .fv_cta .ntg-rule-box strong {
      color: #fff !important;
      text-align: left !important;
      text-decoration: none !important;
      font-size: 9px !important;
      font-weight: 500 !important;
      font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif !important;
      line-height: inherit !important;
  }
  
  #pc_dis.pc_dis_left .fv_cta .ntg-rule-box a {
      text-decoration: underline !important;
      cursor: pointer !important;
  }
  
  #pc_dis.pc_dis_left .fv_cta .ntg-rule-box strong {
      font-weight: bold !important;
      font-size: inherit !important;
  }
  
  #pc_dis.pc_dis_left .fv_cta .ntg-rule-box input {
      display: inline !important;
  }
  
  #pc_dis.pc_dis_left .fv_cta .ntg-rule-info label, #pc_dis.pc_dis_left .fv_cta .ntg-rule-prof label {
    display: flex;          /* 横並びにする */
    align-items: center;    /* 上下中央揃えにする */
    gap: 2px;               /* チェックボックスと文字の間隔 */
    cursor: pointer;        /* クリックできることを分かりやすく */
    }
    #pc_dis.pc_dis_left .fv_cta .skipDetail_notification, #pc_dis.pc_dis_left .fv_cta .skipDetail_myapp {
      width: 9px;  /* 幅 */
      height: 9px; /* 高さ */
      cursor: pointer; /* マウスを乗せた時に指マークにする */
      accent-color: #fcba03; /* チェック時の色も変更可能（任意） */
    }





	#pc_dis02.pc_dis_right {
		width: 353px;
		/*height: 93lvh;*/
        height: calc(100vh - 72px);
		right: 0;
		left: auto;
		background-color: #fffcf1;
		margin: 56px 16px 16px 0
	}
	
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li {
		position: relative;
		margin-bottom: 10px;
		cursor: pointer;
		transition: all .6s cubic-bezier(0.22, 1, 0.36, 1);
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li::before {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		margin: auto;
		top: auto;
		bottom: 0;
		display: block;
		width: 100%;
		height: 1px;
		pointer-events: none;
		background-color: #f3c200;
		z-index: 0;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li_a {
		display: inline-block;
		margin-bottom: 0px;
        padding-top: 1.5vw;
        padding-bottom: 1.5vw;
        padding-left: 30px;
		overflow: visible;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li_a .rmenu span {
		display: block;
		margin-right: 20px;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li_a .rmenu span img {
		width: 20px;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_logo {
		width: 320px;
		margin: 0 auto 40px;
        padding-left: 30px;
	}
    
	#pc_dis02.pc_dis_right .frame01 {
		position: absolute;
        top: 10px;
	}
	#pc_dis02.pc_dis_right .frame01 img {
		width: 95%;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_logo {
		width: 275px;
		margin: 0 auto 15px;
        padding-left: 30px;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul {
		text-align: left;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li_a {
		display: inline-block;
		margin-bottom: 0px;
        padding-top: 0.8vw;
        padding-bottom: 0.8vw;
        padding-left: 20px;
		overflow: visible;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li_a .rmenu p {
		font-family: 'M PLUS 2p', sans-serif;
		color: #846a5c;
        font-weight: 800;
		font-size: 1.1em;
		letter-spacing: 0.44em;
		line-height: 1.2em;
	}

    
    
    .fv_homerare  {
        display: none;
		position: fixed;
        z-index: 400;
		width: 353px;
        height: 270px;
        right: 0vw;
        bottom: 0;
	}
	.fv_homerare .frame02 {
		position: absolute;
        z-index: 400;
        width: 205px;
        right: 155px;
        bottom: 130px;
	}
	.fv_homerare .frame03 {
		position: absolute;
        z-index: 400;
		width: 543px;
        right: 0vw;
        bottom: -75px;
	}
	.fv_homerare .btn_homerare {
		position: absolute;
        z-index: 400;
        width: 300px;
        right: 53px;
        bottom: 25px;
	}
	.fv_homerare .txt_homerare {
		position: absolute;
        z-index: 400;
        width: 340px;
        right: 12px;
        bottom: 15px;
	}
    

    
	#wrapper {
		position: relative;
        z-index: 499;
		background-color: #f3efe5;
		overflow: hidden;
		max-width: 635px;
		margin: 0 auto;
        right: 368px;
	}

	#maincontents .fv {
		display: none;
	}
	#maincontents #sec01 {
		display: block;
		position: relative;
        z-index: 499;
        background: url(../images/sec01/pcbg.webp) no-repeat top center;
        background-image: url(../images/sec01/pcbg.webp);
        background-image: image-set(url(../images/sec01/pcbg.webp) 1x, url(../images/2x/sec01/pcbg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec01/pcbg.webp) 1x, url(../images/2x/sec01/pcbg@2x.webp) 2x);
        background-size: 100%;
		overflow: hidden;
		max-width: 635px;
        height: 850px;
		margin: 0vw auto 0 auto;
	}
	#maincontents #sec01 .pcfv_capt{
        padding-top: 25%;
    }
	#maincontents #sec01 .pcfv_capt img {
        width: 90%;
    }
	#maincontents #sec01 .icons {
        display: none;
    }
	#maincontents #sec01 .boy {
        display: none;
    }
	#maincontents #sec01 .sec01rb01 {
        display: none;
		position: absolute;
        z-index: 800;
        top: 32.2vw;
        left: -4.0vw;
        width: 11vw;
    }
	#maincontents #sec01 .sec01rb01 img {
        width: 98%;
    }
	#maincontents #sec01 .sec01rb02 {
        display: none;
		position: absolute;
        z-index: 800;
        top: 36.2vw;
        right: -4.0vw;
        width: 10vw;
    }
	#maincontents #sec01 .sec01rb02 img {
        width: 98%;
    }



	#maincontents #sec01 .md {
        padding-top: 71.5%;
        padding-bottom: 5%;
        /*
        */
    }
	#maincontents #sec01 .md img {
        width: 90%;
    }
	#maincontents #sec01 .cta_btn__ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-image: url(../images/cta/btnframe_Pre.webp);
        background-image: image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-repeat: no-repeat;
        background-position: top center;
        background-size: 100%;
        padding-top: 85%;
		width: 100%;
        height: auto;
	}
	#maincontents #sec01 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 12.5%;
        margin: 0 auto;
		width: 100%;
        height: auto;
	}
	#maincontents #sec01 ul li {
        margin-left: 5px;
        margin-right: 5px;
        margin-bottom: 10px;
        width: 49%;
        padding: 5px;
    }
	#maincontents #sec01 ul li:first-child {
        width: 41.5%;
    }
	#maincontents #sec01 ul li:nth-of-type(3) {
        width: 55%;
    }
	#maincontents #sec01 ul img {
        width: 100%;
        height: auto;
        max-height: 106px;
        /*
        */
	}

    

    #maincontents .ntg-rule-box-area {
      position: relative;
      width: 350px;
      right: 0;
      top: -205px;
      transform: translateX(-0%);
      margin: 0 auto;
  }

  
  #maincontents .ntg-rule-box {
      position: relative;
      clear: both;
      width: 350px;
      max-width: 350px;
      /*
      background: rgba(0, 0, 0, 0.4);
      padding: 7px 14px 5px 14px;
      */
      box-sizing: border-box;
      display: block;
      margin: 0 auto 10px auto;
      line-height: 1.8 !important;
      color: #fff;
      overflow: hidden;
  }
  
  #maincontents .ntg-rule-info {
      float: left;
      text-align: left;
      font-size: 14px;
      line-height: 2.2;
      padding-right: 10px;
  }
  
  #maincontents .ntg-rule-prof {
      float: left;
      text-align: left;
      font-size: 14px;
      line-height: 2.2;
      padding-right: 5px;
  }
  
  #maincontents .ntg-rule-comname {
      float:inherit;
      text-align: center;
      font-size: 14px;
      line-height: 2.2;
  }
  
  #maincontents .ntg-rule-box,
  #maincontents .ntg-rule-box a,
  #maincontents .ntg-rule-box a:hover,
  #maincontents .ntg-rule-box label,
  #maincontents .ntg-rule-box strong {
      color: #5f473a !important;
      text-align: left !important;
      text-decoration: none !important;
      font-size: 14px !important;
      font-weight: 600 !important;
      font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif !important;
      line-height: inherit !important;
  }
  
  #maincontents .ntg-rule-box a {
      text-decoration: underline !important;
      cursor: pointer !important;
  }
  
  #maincontents .ntg-rule-box strong {
      font-weight: bold !important;
      font-size: inherit !important;
  }
  
  #maincontents .ntg-rule-box input {
      display: inline !important;
  }
  
  #maincontents .ntg-rule-info label, #maincontents .ntg-rule-prof label {
    display: flex;          /* 横並びにする */
    align-items: center;    /* 上下中央揃えにする */
    gap: 6px;               /* チェックボックスと文字の間隔 */
    cursor: pointer;        /* クリックできることを分かりやすく */
    }
    #maincontents .skipDetail_notification, #maincontents .skipDetail_myapp {
      width: 14px;  /* 幅 */
      height: 14px; /* 高さ */
      cursor: pointer; /* マウスを乗せた時に指マークにする */
      accent-color: #fcba03; /* チェック時の色も変更可能（任意） */
    }



	#maincontents #sec01 .btn_homerare {
		position: absolute;
		z-index: 5;
        top: 81.5%;
        margin: 0 auto;
		width: 98%;
        padding-top: 0.1%;
    }
	#maincontents #sec01 .btn_homerare img {
        width: 85%;
    }


    

    

	#maincontents #sec07 {
		display: block;
		position: relative;
        z-index: 599;
        top: -140px;
        background: url(../images/sec07/mdbg.webp) no-repeat top center;
        background-image: url(../images/sec07/mdbg.webp);
        background-image: image-set(url(../images/sec07/mdbg.webp) 1x, url(../images/2x/sec07/mdbg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec07/mdbg.webp) 1x, url(../images/2x/sec07/mdbg@2x.webp) 2x);
        background-size: 100%;
        /*
        background: none;
        */
		overflow: hidden;
		max-width: 836px;
        height: 150vw;
        height: 2950px;
	}

	#maincontents #sec07 #cam {
		display: block;
		position: relative;
        z-index: 499;
        top: 2.6%;
        height: 110vw;
        height: 1620px;
        /*
        */
    }
	#maincontents #sec07 #cam .md {
		position: relative;
        z-index: 499;
        padding-top: 1vw;
        /*
        */
    }
	#maincontents #sec07 #cam .md img {
        width: 90%;
    }

	#maincontents #sec07 #cam .sec07rb71 {
		position: absolute;
        z-index: 800;
        top: -100px;
        left: -6.3vw;
        width: 11.6vw;
    }
	#maincontents #sec07 #cam .sec07rb71 img {
        width: 60%;
    }
	#maincontents #sec07 #cam .sec07rb72 {
		position: absolute;
        z-index: 800;
        top: -50px;
        right: -6.5vw;
        width: 11vw;
    }
	#maincontents #sec07 #cam .sec07rb72 img {
        width: 64%;
    }

    
	#maincontents #sec07 #cam .txt {
		position: relative;
        z-index: 499;
		width: 550px;
        height: auto;
        padding-top: 3vw;
        /*
        */
    }
	#maincontents #sec07 #cam .txt img {
        width: 100%;
    }



	#maincontents #sec07 #cam .lef01 {
		position: relative;
		z-index: 5;
        top: -4.0vw;
        left: 2.0%;
        margin: 0 auto;
		width: 35%;
        padding-top: 0.1%;
    }
	#maincontents #sec07 #cam .lef01 img {
        width: 75%;
    }
    #maincontents #sec07 #cam .lef01 {
        transform-origin: center bottom;
        animation: yurayura 2s linear infinite;
    }

    @keyframes yurayura {
        0% , 100%{
            transform: rotate(10deg);
        }
        50%{
            transform: rotate(-10deg);
        }
    }

	#maincontents #sec07 #cam .campaign__ul {
		z-index: 4;
		position: absolute;
        text-align: center;
        top: 770px;
        background-image: url(../images/sec07/bg02.webp);
        background-image: image-set(url(../images/sec07/bg02.webp) 1x, url(../images/2x/sec07/bg02@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec07/bg02.webp) 1x, url(../images/2x/sec07/bg02@2x.webp) 2x);
        background-repeat: no-repeat;
        background-position: top center;
        background-size: 100% 100%;
		width: 100%;
        height: 1251px;
	}
	#maincontents #sec07 #cam .campaign__ul ul {
		z-index: 4;
		position: absolute;
        text-align: center;
        background-size: cover;
        top: -1.5vw;
        margin: 0 auto;
		width: 100%;
        height: auto;
	}
	#maincontents #sec07 #cam .campaign__ul ul li {
        margin-left: 5px;
        margin-right: 5px;
        margin-bottom: 2.1vw;
        margin: 0 auto 0.3vw auto;
        width: 100%;
        height: auto;
        max-height: 522px;
        padding: 5px 0 0.1vw 0;
    }
	#maincontents #sec07 #cam .campaign__ul ul img {
        width: auto;
        height: 100%;
        max-height: 522px;
        /*
        */
	}
	#maincontents #sec07 #cam .campaign__ul ul li.cam01 {
        margin: 5vw auto 0.3vw auto;
        width: 100%;
        height: auto;
    }
	#maincontents #sec07 #cam .lef02 {
        display: none;
		position: absolute;
		z-index: 5;
        top: 35.0vw;
        right: 1.0vw;
        margin: 0 auto;
		width: 25%;
        padding-top: 1.1%;
    }
	#maincontents #sec07 #cam .lef02 img {
        width: 75%;
    }
    #maincontents #sec07 #cam .lef02 {
        transform-origin: center bottom;
        animation: yurayura 2s linear infinite;
    }

    @keyframes yurayura {
        0% , 100%{
            transform: rotate(10deg);
        }
        50%{
            transform: rotate(-10deg);
        }
    }

	#maincontents #sec07 #cam .attention {
		position: relative;
		z-index: 5;
        top: 980px;
        margin: 2vw auto;
		width: 94%;
        padding-top: 0%;
        text-align: left;
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        font-weight: 800;
		font-size: 0.9em;
		letter-spacing: 0.64px;
		line-height: 1.8em;
    }
	#maincontents #sec07 #cam .attention img {
        width: 100%;
    }
	#maincontents #sec07 .ctamd {
        position: relative;
        top: 520px;
        width: 90%;
    }
	#maincontents #sec07 .ctamd img {
        width: 100%;
    }


	#maincontents #sec07 .registmd {
		position: relative;
        top: 1.2%;
        /*
        */
    }
	#maincontents #sec07 .registmd img {
        width: 90%;
    }
	#maincontents #sec07 .cta_btn__ul {
		z-index: 4;
		position: relative;
        top: 550px;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-image: url(../images/cta/btnframe_Pre.webp);
        background-image: image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-repeat: no-repeat;
        background-position: top center;
        background-size: 100%;
        padding-top: 86%;
		width: 100%;
        height: auto;
	}
	#maincontents #sec07 .cta_btn__ul ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 11.8%;
        margin: 0 auto;
		width: 100%;
        height: auto;
	}
	#maincontents #sec07 .cta_btn__ul ul li {
        margin-left: 6px;
        margin-right: 6px;
        margin-bottom: 12px;
        width: 49%;
        padding: 5px;
    } 
    #maincontents #sec07 .cta_btn__ul ul li:first-child {
        width: 41.5%;
    }
    #maincontents #sec07 .cta_btn__ul ul li:nth-of-type(3) {
        width: 55%;
    }
	#maincontents #sec07 .cta_btn__ul ul img {
        width: 100%;
        height: auto;
        max-height: 106px;
        /*
        */
	}

	#maincontents #sec07 .cta_btn__ul .btn_homerare {
		position: absolute;
		z-index: 5;
        top: 81.0%;
        margin: 0 auto;
		width: 98%;
        padding-top: 0.1%;
    }
	#maincontents #sec07 .cta_btn__ul .btn_homerare img {
        width: 85%;
        height: auto;
    }
    






    
	#maincontents .sec02rb01 {
		position: absolute;
        z-index: 800;
        top: 3580px;
        right: -1.5vw;
        width: 80px;
    }
	#maincontents .sec02rb01 img {
        width: 98%;
    }
    [data-aos=HorizontalOpen]{ clip-path:inset(0 1000px); }
    [data-aos=HorizontalOpen].aos-animate{ clip-path:inset(0 0); }
    [data-aos=HorizontalOpenT]{ clip-path:inset(1000px 0); }
    [data-aos=HorizontalOpenT].aos-animate{ clip-path:inset(0 0); }




	#maincontents #sec02 {
		display: block;
		position: relative;
        top: -30px;
        z-index: 499;
		overflow: hidden;
		max-width: 836px;
        /*height: 325vw;*/
        height: 5250px;
		margin: 0vw auto 0.0vw auto;
	}


	#maincontents #sec02 .md {
		position: relative;
        top: 0vw;
        padding-bottom: 2vw;
    }
	#maincontents #sec02 .md img {
        width: 88%;
    }

    
	#maincontents #sec02 .point01 {
		position: relative;
        height: 1200px;
		/*
        height: 100%;
        max-height: 75vw;
        */
    }

	#maincontents .sec02rb02 {
		position: absolute;
        z-index: 800;
        top: 250px;
        left: -70px;
        width: 120px;
    }
	#maincontents .sec02rb02 img {
        width: 98%;
    }

	#maincontents #sec02 .point01 .bg {
		position: absolute;
        width: 100%;
        top: 5.5%;
        left: -7.7%;
    }
	#maincontents #sec02 .point01 .pointbase {
		position: absolute;
        width: 100px;
        top: 25px;
        left: 50px;
        animation: rotateAnimation 6s linear infinite;
    }
    @keyframes rotateAnimation {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }
	#maincontents #sec02 .point01 .pt {
		position: absolute;
        width: 50px;
        top: 54px;
        left: 76px;
    }
	#maincontents #sec02 .point01 .txt {
		position: absolute;
        top: 3.5%;
        right: 1vw;
        /*width: 8.5vw;*/
    }
	#maincontents #sec02 .point01 .txt img {
        width: 154px;
    }
	#maincontents #sec02 .point01 .support_ul {
		z-index: 4;
		position: absolute;
        top: 0;
		bottom: 0;
		width: 100%;
	}
	#maincontents #sec02 .point01 ul {
		z-index: 4;
		position: relative;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        top: 520px;
		width: 100%;
        height: 100%;
	}
	#maincontents #sec02 .point01 ul li {
        margin-left: 5px;
        margin-right: 5px;
        width: 47%;
        padding: 5px;
    }
	#maincontents #sec02 .point01 ul img {
        height: auto;
	}
	#maincontents #sec02 .point01 .ss01 {
		position: absolute;
		left: 3.5%;
        top: 0;
		bottom: 0;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point01 .ss01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec02 .point01 .ss02 {
		position: absolute;
		right: 3.5%;
        top: 0.2%;
		bottom: 0;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point01 .ss02.aos-animate {
        filter: blur(0px);
    }
    

	#maincontents #sec02 .point02 {
		position: relative;
        height: 1250px;
        /*
        height: 100%;
		max-height: 77vw;
        */
    }
	#maincontents #sec02 .point02 .bg {
		position: absolute;
        width: 100%;
        top: 6%;
        right: -6.2%;
    }
	#maincontents #sec02 .point02 .pointbase {
		position: absolute;
        width: 100px;
        top: 25px;
        right: 40px;
        animation: rotateAnimation 6s linear infinite;
    }
    @keyframes rotateAnimation {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }
	#maincontents #sec02 .point02 .pt {
		position: absolute;
        width: 50px;
        top: 54px;
        right: 64px;
    }
	#maincontents #sec02 .point02 .txt {
		position: absolute;
        top: 3.8vw;
        left: 1.5vw;
        /*width: 8.5vw;*/
    }
	#maincontents #sec02 .point02 .txt img {
        width: 144px;
    }
	
	#maincontents #sec02 .point02 .support_ul {
		z-index: 4;
		position: absolute;
        top: 0;
		bottom: 0;
		width: 100%;
	}
	#maincontents #sec02 .point02 ul {
		z-index: 4;
		position: relative;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        top: 520px;
		width: 100%;
        height: 100%;
	}
	#maincontents #sec02 .point02 ul li {
        margin-left: 5px;
        margin-right: 5px;
        width: 47%;
        padding: 5px;
    }
	#maincontents #sec02 .point02 ul img {
        height: auto;
	}
	#maincontents #sec02 .point02 .ss01 {
		position: absolute;
		left: 3.5%;
        top: 0;
		bottom: 0;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point02 .ss01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec02 .point02 .ss02 {
		position: absolute;
		right: 3.5%;
        top: 0;
		bottom: 0;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point02 .ss02.aos-animate {
        filter: blur(0px);
    }



	#maincontents .sec02rb03 {
		position: absolute;
        z-index: 800;
        top: 1900px;
        left: -3.2vw;
        width: 6vw;
    }
	#maincontents .sec02rb03 img {
        width: 78%;
    }


	#maincontents #sec02 .point03 {
		position: relative;
        height: 1280px;
        /*
        height: 100%;
		max-height: 79vw;
        */
    }
    
	#maincontents #sec02 .point03 .bg {
		position: absolute;
        width: 100%;
        top: 6%;
        left: -7.7%;
    }
	#maincontents #sec02 .point03 .pointbase {
		position: absolute;
        width: 100px;
        top: 25px;
        left: 50px;
        animation: rotateAnimation 6s linear infinite;
    }
    @keyframes rotateAnimation {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }
	#maincontents #sec02 .point03 .pt {
		position: absolute;
        width: 50px;
        top: 54px;
        left: 76px;
    }
	#maincontents #sec02 .point03 .txt {
		position: absolute;
        top: 4.5%;
        right: 1.5vw;
        /*width: 7.5vw;*/
    }
	#maincontents #sec02 .point03 .txt img {
        width: 134px;
    }
	#maincontents #sec02 .point03 .support_ul {
		z-index: 4;
		position: absolute;
        top: 0;
		bottom: 0;
		width: 100%;
	}
	#maincontents #sec02 .point03 ul {
		z-index: 4;
		position: relative;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        top: 540px;
		width: 100%;
        height: 100%;
	}
	#maincontents #sec02 .point03 ul li {
        margin-left: 5px;
        margin-right: 5px;
        width: 47%;
        padding: 5px;
    }
	#maincontents #sec02 .point03 ul img {
        height: auto;
	}
	#maincontents #sec02 .point03 .ss01 {
		position: absolute;
		left: 3.5%;
        top: 0;
		bottom: 0;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point03 .ss01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec02 .point03 .ss02 {
		position: absolute;
		right: 3.5%;
        top: 0;
		bottom: 0;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point03 .ss02.aos-animate {
        filter: blur(0px);
    }



	#maincontents .sec02rb04 {
		position: absolute;
        z-index: 800;
        top: 3200px;
        right: -30px;
        width: 90px;
    }
	#maincontents .sec02rb04 img {
        width: 88%;
    }



	#maincontents #sec02 .point04 {
		position: relative;
        height: 1230px;
        /*
        height: 100%;
		max-height: 75vw;
        */
    }
	#maincontents #sec02 .point04 .bg {
		position: absolute;
        width: 100%;
        top: 6%;
        right: -6.2%;
    }
	#maincontents #sec02 .point04 .pointbase {
		position: absolute;
        width: 100px;
        top: 25px;
        right: 40px;
        animation: rotateAnimation 6s linear infinite;
    }
    @keyframes rotateAnimation {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }
	#maincontents #sec02 .point04 .pt {
		position: absolute;
        width: 50px;
        top: 54px;
        right: 63px;
    }
	#maincontents #sec02 .point04 .txt {
		position: absolute;
        top: 3.8vw;
        left: 1.8vw;
        /*width: 6.5vw;*/
    }
	#maincontents #sec02 .point04 .txt img {
        width: 124px;
    }
	
	#maincontents #sec02 .point04 .support_ul {
		z-index: 4;
		position: absolute;
        top: 0;
		bottom: 0;
		width: 100%;
	}
	#maincontents #sec02 .point04 ul {
		z-index: 4;
		position: relative;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        top: 520px;
		width: 100%;
        height: 100%;
	}
	#maincontents #sec02 .point04 ul li {
        margin-left: 5px;
        margin-right: 5px;
        width: 47%;
        padding: 5px;
    }
	#maincontents #sec02 .point04 ul img {
        height: auto;
	}
	#maincontents #sec02 .point04 .ss01 {
		position: absolute;
		left: 3.5%;
        top: 0;
		bottom: 0;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point04 .ss01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec02 .point04 .ss02 {
		position: absolute;
		right: 3.5%;
        top: 0;
		bottom: 0;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point04 .ss02.aos-animate {
        filter: blur(0px);
    }


	#maincontents .sec02rb05 {
		position: absolute;
        z-index: 800;
        top: 4400px;
        left: -2.0vw;
        width: 90px;
    }
	#maincontents .sec02rb05 img {
        width: 80%;
    }



	#maincontents #sec03 {
		display: block;
		position: relative;
        z-index: 499;
        background: url(../images/sec03/bg.webp) no-repeat top center;
        background-image: url(../images/sec03/bg.webp);
        background-image: image-set(url(../images/sec03/bg.webp) 1x, url(../images/2x/sec03/bg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec03/bg.webp) 1x, url(../images/2x/sec03/bg@2x.webp) 2x);
        background-size: 100%;
		overflow: hidden;
		max-width: 836px;
        height: 1750px;
	}
	#maincontents #sec03 .sec03_capt {
		position: relative;
        top: -90px;
    }
	#maincontents #sec03 .sec03_capt img {
        width: 90%;
    }
	#maincontents #sec03 .voice_sample {
		position: relative;
        top: 2vw;
        width: 100%;
        height: 200px;
        background: url(../images/sec03/btnbg.webp) repeat-y top center;
        background-image: url(../images/sec03/btnbg.webp);
        background-image: image-set(url(../images/sec03/btnbg.webp) 1x, url(../images/2x/sec03/btnbg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec03/btnbg.webp) 1x, url(../images/2x/sec03/btnbg@2x.webp) 2x);
    }
	#maincontents #sec03 .voice_sample .catch {
		position: relative;
        top: 1.5vw;
        width: 570px;
    }
	#maincontents #sec03 .voice_sample .btn {
		position: relative;
        top: 2.4vw;
        width: 444px;
    }
	#maincontents #sec03 .voice_sample .starl {
		position: relative;
        top: -20px;
        left: -265px;
        width: 63px;
    }
	#maincontents #sec03 .voice_sample .starr {
		position: relative;
        top: -90px;
        right: -265px;
        width: 63px;
    }
	#maincontents #sec03 .voice_slider {
		position: relative;
        top: 4vw;
		width: 100%;
        /*
        */
    }
	#maincontents #sec03 .voice_slider img {
        width: 90%;
    }
    /* スライド内の画像を中央寄せにする */
    .voice_slider .slick-slide img {
        display: block;
        margin: 0 auto;
    }


    /* --- スライドショーの矢印カスタマイズ --- */

    /* 矢印画像の共通設定 */
    #maincontents #sec03 .voice_slider .slide-arrow {
        position: absolute;
        top: 50%;             /* 垂直方向の中央 */
        transform: translateY(-50%); /* 中央位置の補正 */
        cursor: pointer;      /* カーソルを指の形に */
        z-index: 10;          /* 画像より手前に表示 */
        width: 60px;          /* ★矢印の大きさ（お好みで調整してください） */
        height: auto;
    }
    
    /* 左矢印の位置 */
    #maincontents #sec03 .voice_slider .prev-arrow {
        left: 10px;           /* 左端から少し内側へ */
    }
    
    /* 右矢印の位置 */
    #maincontents #sec03 .voice_slider .next-arrow {
        right: 10px;          /* 右端から少し内側へ */
    }
    #maincontents #sec03 .voice_slider .slick-dots {
        bottom: -35px;
    }
    #maincontents #sec03 .voice_slider .slick-dots li button:before {
        width: 30px;
        height: 30px;
        font-size: 10px;
    }



	#maincontents #sec03 .md {
		position: relative;
        top: 5.5vw;
        /*
        */
    }
	#maincontents #sec03 .md img {
        width: 90%;
    }
	#maincontents #sec03 .cta_btn__ul {
		z-index: 4;
		position: relative;
        top: 6.5vw;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-image: url(../images/cta/btnframe_Pre.webp);
        background-image: image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-repeat: no-repeat;
        background-position: top center;
        background-size: 100%;
        padding-top: 85%;
		width: 100%;
        height: auto;
	}
	#maincontents #sec03 .cta_btn__ul ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 12.8%;
        margin: 0 auto;
		width: 100%;
        height: auto;
	}
	#maincontents #sec03 .cta_btn__ul ul li {
        margin-left: 6px;
        margin-right: 6px;
        margin-bottom: 12px;
        width: 49%;
        padding: 5px;
    } 
    #maincontents #sec03 .cta_btn__ul ul li:first-child {
        width: 41.5%;
    }
    #maincontents #sec03 .cta_btn__ul ul li:nth-of-type(3) {
        width: 55%;
    }
	#maincontents #sec03 .cta_btn__ul ul img {
        width: 100%;
        height: auto;
        max-height: 106px;
        /*
        */
	}

	#maincontents #sec03 .cta_btn__ul .btn_homerare {
		position: absolute;
		z-index: 5;
        top: 81.0%;
        margin: 0 auto;
		width: 98%;
        padding-top: 0.1%;
    }
	#maincontents #sec03 .cta_btn__ul .btn_homerare img {
        width: 85%;
        height: auto;
    }



	#maincontents #sec04 {
		display: block;
		position: relative;
        z-index: 899;
        background-size: 105%;
		overflow: hidden;
		max-width: 836px;
        height: 1500px;
	}
	#maincontents #sec04 .md {
        padding-top: 5.5%;
        padding-bottom: 4%;
        /*
        */
    }
	#maincontents #sec04 .md img {
        width: 90%;
    }
	

    #sec04 .container {
        margin: 5% auto 10% auto;
        flex-direction: column;
        align-items: center;
    }
    #sec04 .box {
        width: 100%;
        height: auto;
        opacity: 1;
        transition: opacity 0.5s ease-in-out;	
    }
    #sec04 .background-image {
        width: 100%;
        height: auto;
        opacity: 1;
        transition: opacity 0.5s ease-in-out;
    }	
    #sec04 .background-image.hidden {
        opacity: 0;
    }
    #sec04 .audio-buttons {
        display: none;
        position: relative;
        top: -582px;
        left: -145px;
        width: 210px;
    }
    #sec04 .audio-btn {
        margin: 0% 2px 0% 2px;
        padding: 0 5px;
        border: none;
        cursor: pointer;
        width: 58px;
    }
    
    #sec04 .zoom-btn {
        display: block;
        position: relative;
        top: -582px;
        left: -145px;
        width: 210px;
    }


    #sec04 .voice_capt	{
        top: 20%;
        left: 71%;
        width: 26%;
        height: auto;
        position: absolute;
        display: flex;
        animation: float 3s ease-in-out infinite;
    }
    @keyframes float {
        0%, 100% {
            transform: translateY(0); /* 初期位置 */
        }
        50% {
            transform: translateY(-5px); /* 上に移動 */
        }
    }	
    #sec04 .thumbnails {
        position: relative;
        top: -8vw;
        flex-wrap: wrap;
        justify-content: center;
    }
    #sec04 .thumbnail {
        width: 20%;
        height: auto;
        margin: 5px 7px;
    }
    .thumbnail.active {
        filter: brightness(0.5);
    }  	
	#sec04 .left-arrow, .right-arrow {
        font-size: 1.5em;
        position: absolute;
    z-index:10;
    }
    #sec04 .left-arrow {
        display:none;
        margin: 50% 0% 0% 0%;
        width: 8%;}
    #sec04 .right-arrow {
        display: none;
        margin: -68% 0% 0% 0%;
        right: 0%;
        width:8%;
    }	
    #sec04 .thumbnail.active {
        filter: brightness(1.2);
    }	

    /* 親要素（キャラ表示エリア） */
.character_display_area {
    position: relative;
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
}

/* ボイスユニット全体の位置 */
.voice_unit {
    display: none;
    position: absolute;
    /* 位置調整：立ち絵の左側、いい感じの高さに配置 */
    top: 32%; 
    left: 4%; 
    width: 40%; /* 立ち絵に対する幅の比率。スマホで小さすぎないよう調整 */
    z-index: 10;
}

/* ベース画像（黄色や青の画像） */
.voice_base_img {
    width: 100%;
    height: auto;
    display: block;
}

/* 透明ボタンを配置するエリア */
.voice_hit_zones {
    position: absolute;
    /* 画像の下部（カプセル部分）に合わせるための調整 */
    /* "VOICE"の文字が画像に含まれている場合、少し下げる必要があります */
    bottom: 10%; 
    left: 24%; /* 左側のアイコン部分（約1/4）を避ける */
    width: 74%; /* 残りの右側部分 */
    height: 42%; /* 高さ調整："VOICE"の文字を除いたカプセルの高さに合わせる */
    display: flex; /* 横並びにする */
}

/* 個別の透明ボタン */
.v-zone {
    flex: 1; /* 3つのボタンを均等な幅にする */
    background-color: transparent; /* 透明 */
    border: none;
    cursor: pointer;
    /* タップしたかわかるように少しだけハイライト（お好みで削除可） */
    transition: background-color 0.2s;
    border-radius: 5px;
}

/* ホバー時やタップ時に薄く白く光らせる（操作感のため） */
.v-zone:hover, .v-zone:active {
    background-color: rgba(255, 255, 255, 0.3);
}

/* スマホ用の微調整 */
@media screen and (max-width: 768px) {
    .voice_unit {
        width: 35%; /* スマホでは少し大きめに表示 */
        top: 38%;
        left: 2%;
    }
}
/* --- ZOOMボタンの配置 --- */
.zoom_btn_container {
    display: none;
    position: absolute;
    /* デザイン画像の位置に合わせて調整 */
    top: 54%; 
    right: 1.5%; 
    width: 13%; /* ボタンの大きさ */
    z-index: 20;
    cursor: pointer;
    transition: transform 0.2s;
}
.zoom_btn_container:hover {
    transform: scale(1.1); /* ホバー時に少し大きくなる */
}
.zoom_btn_container img {
    width: 100%;
    display: block;
    /* ドロップシャドウをつけると浮いて見えて押しやすくなります（お好みで） */
    filter: drop-shadow(0px 2px 3px rgba(0,0,0,0.2));
}

/* --- スマホ時のZOOMボタン調整 --- */
@media screen and (max-width: 768px) {
    .zoom_btn_container {
        width: 16%; /* スマホでは指で押しやすいように少し大きく */
        top: 52%;
        right: 2%;
    }
}

/* --- ポップアップ（モーダル）全体のスタイル --- */
.popup_overlay {
    display: none; /* 初期状態は非表示 */
    position: fixed;
    z-index: 9999; /* 最前面 */
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.85); /* 背景を暗く */
    opacity: 0;
    transition: opacity 0.3s ease;
    justify-content: center;
    align-items: center;
    padding: 20px; /* 画面端の余白 */
    box-sizing: border-box;
}

/* 表示時のクラス */
.popup_overlay.show {
    display: flex;
    opacity: 1;
}

/* ポップアップの中身 */
.popup_content {
    position: relative;
    top: 20px;
    max-width: 80%;
    max-height: 80%;
    text-align: center;
    background: #fff;
}

/* 拡大画像の設定 */
.popup_content img {
    width: 80%;
    height: 80%;
    /* 画面の高さいっぱいに表示しつつ、横幅も画面に収める */
    max-height: 90vh; 
    max-width: 100%; 
    border-radius: 8px;
    box-shadow: 0 0 20px rgba(255, 255, 255, 0.2);
}

/* 閉じるボタン（×） */
.popup_close {
    position: absolute;
    top: -45px;
    right: -10px;
    color: #fff;
    font-size: 40px;
    font-weight: bold;
    cursor: pointer;
    line-height: 1;
    text-shadow: 0 0 5px rgba(0,0,0,0.5);
}

/* スマホの場合、閉じるボタンを少し内側に */
@media screen and (max-width: 768px) {
    .popup_close {
        top: -45px;
        right: 0;
    }
}






	#maincontents #sec05 .sec05rb51 {
		position: absolute;
        z-index: 800;
        top: 0px;
        right: -3.8%;
        width: 100px;
    }
	#maincontents #sec05 .sec05rb51 img {
        width: 58%;
    }
	#maincontents #sec05 .sec05rb52 {
		position: absolute;
        z-index: 800;
        top: -30px;
        left: -7.5%;
        width: 120px;
    }
	#maincontents #sec05 .sec05rb52 img {
        width: 68%;
    }

	#maincontents #sec05 {
		display: block;
		position: relative;
        z-index: 499;
        background: url(../images/sec05/bg.webp) no-repeat top center;
        background-image: url(../images/sec05/bg.webp);
        background-image: image-set(url(../images/sec05/bg.webp) 1x, url(../images/2x/sec05/bg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec05/bg.webp) 1x, url(../images/2x/sec05/bg@2x.webp) 2x);
        background-size: 105%;
		overflow: hidden;
		max-width: 836px;
        height: 1350px;
	}
	#maincontents #sec05 .md {
        padding-top: 2.5%;
        padding-bottom: 4%;
        margin-top: 10%;
        /*
        */
    }
	#maincontents #sec05 .md img {
        width: 90%;
    }
	#maincontents #sec05 .story01 {
		position: relative;
		position: relative;
        margin-top: 10%;
        /*
        */
    }
	#maincontents #sec05 .story01 .you {
		position: absolute;
        z-index: 10;
        left: 0%;
        width: 37%;
    }
	#maincontents #sec05 .story01 .capt01 {
		position: absolute;
        z-index: 11;
        right: 3%;
        width: 60%;
    }
	#maincontents #sec05 .story01 .txt01 {
		position: absolute;
        z-index: 11;
        right: 3%;
        width: 56%;
        padding-top: 9%;
        filter: blur(5px); /* ぼかしの強さを指定 */
        transition: filter 2s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec05 .story01 .txt01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec05 .story02 {
		position: relative;
        margin-top: 65%;
        /*
        */
    }
	#maincontents #sec05 .story02 .capt02 {
		position: absolute;
        z-index: 11;
        left: 3%;
        width: 55%;
    }
	#maincontents #sec05 .story02 .txt02 {
		position: absolute;
        z-index: 11;
        left: 3%;
        width: 56%;
        padding-top: 19%;
        filter: blur(5px); /* ぼかしの強さを指定 */
        transition: filter 2s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec05 .story02 .txt02.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec05 .story02 .apartment {
		position: absolute;
        z-index: 10;
        right: -2.0vw;
        width: 260px;
    }
	#maincontents #sec05 .story03 {
		position: relative;
        margin-top: 58%;
        /*
        */
    }
	#maincontents #sec05 .story03 .txt03 {
		position: relative;
        z-index: 11;
        width: 86%;
        padding-top: 60%;
    }


	#maincontents .sec06rb61 {
		position: absolute;
        z-index: 800;
        top: 13500px;
        left: -85px;
        width: 160px;
    }
	#maincontents .sec06rb61 img {
        width: 68%;
    }
	#maincontents .sec06rb62 {
		position: absolute;
        z-index: 800;
        top: 13600px;
        right: -40px;
        width: 120px;
    }
	#maincontents .sec06rb62 img {
        width: 58%;
    }

	#maincontents #sec06 {
		display: block;
		position: relative;
        z-index: 499;
        background-size: 100%;
		overflow: hidden;
		max-width: 836px;
        height: 950px;
	}
	#maincontents #sec06 .ai {
		position: relative;
        margin-top: 0%;
        /*
        */
    }
	#maincontents #sec06 .ai img {
        width: 45%;
    }
	#maincontents #sec06 .md {
        padding-top: 1.5%;
        margin-top: 0%;
        /*
        */
    }
	#maincontents #sec06 .md img {
        width: 55%;
    }
	#maincontents #sec06 .lef {
		position: relative;
        z-index: 20;
        margin-top: 7%;
        right: -280px;
        transform-origin: right bottom;
    }
    [data-aos=lef]{ transform:rotate(60deg) }
    [data-aos=lef].aos-animate{ transform:rotate(-7deg) }

	#maincontents #sec06 .lef img {
        width: 45%;
        height: auto;
    }
	#maincontents #sec06 .framebox {
		position: absolute;
        z-index: 20;
        background: #ffffff;
        top: 380px;
        left: 3%;
        width: 440px;
        height: 520px;
        border: 2px solid #222222;
        border-radius: 15px;
        overflow-y: scroll;
        -ms-overflow-style: none; /*IE(Internet Explorer)・Microsoft Edgeへの対応*/
        scrollbar-width: none; /*Firefoxへの対応*/
    }
     /*Google Chrome、Safariへの対応*/
    #maincontents #sec06 .framebox::-webkit-scrollbar {
		display: none;
    }
	#maincontents #sec06 .framebox p {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        font-weight: 800;
		font-size: 46px;
		letter-spacing: 0.64px;
		line-height: 2.0em;
    }
	#maincontents #sec06 .framebox img {
        width: 100%;
        height: auto;
    }

	#maincontents #sec06 .framebox .exbox {
		position: absolute;
        z-index: 20;
        background: #ffffff;
        width: 100%;
        height: 450px;
        padding: 2.5%;
    }
	#maincontents #sec06 .framebox .ex01 {
		position: relative;
        z-index: 20;
        background: url(../images/sec06/ex01bg.webp) no-repeat top center;
        background-size: cover;
        border: 1px solid #ffffff;
        border-radius: 15px;
        width: 99%;
        height: auto;
        padding: 0%;
        margin-bottom: 1.5vw
    }
    #maincontents #sec06 .framebox .ex01 .title {
        padding: 4% 4% 2% 2%;
        width: 95%;
    }
    #maincontents #sec06 .framebox .ex01 .txt {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        padding: 4% 4% 5% 7%;
        text-align: left;
        font-weight: 800;
		font-size: 1em;
		letter-spacing: 1.64px;
		line-height: 1.7em;
    }
	#maincontents #sec06 .framebox .ex02 {
		position: relative;
        z-index: 20;
        background: url(../images/sec06/ex02bg.webp) no-repeat top center;
        background-size: cover;
        border: 1px solid #ffffff;
        border-radius: 15px;
        width: 99%;
        height: auto;
        padding: 0%;
        margin-bottom: 1.5vw
    }
    #maincontents #sec06 .framebox .ex02 .title {
        padding: 4% 4% 2% 2%;
        width: 95%;
    }
    #maincontents #sec06 .framebox .ex02 .txt {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        padding: 4% 4% 5% 7%;
        text-align: left;
        font-weight: 800;
		font-size: 1em;
		letter-spacing: 1.64px;
		line-height: 1.7em;
    }
	#maincontents #sec06 .framebox .ex03 {
		position: relative;
        z-index: 20;
        background: url(../images/sec06/ex03bg.webp) no-repeat top center;
        background-size: cover;
        border: 1px solid #ffffff;
        border-radius: 15px;
        width: 99%;
        height: auto;
        padding: 0%;
        margin-bottom: 1.5vw
    }
    #maincontents #sec06 .framebox .ex03 .title {
        padding: 4% 4% 2% 2%;
        width: 95%;
    }
    #maincontents #sec06 .framebox .ex03 .txt {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        padding: 4% 4% 5% 7%;
        text-align: left;
        font-weight: 800;
		font-size: 1em;
		letter-spacing: 1.64px;
		line-height: 1.7em;
    }
	#maincontents #sec06 .framebox .ex04 {
		position: relative;
        z-index: 20;
        background: url(../images/sec06/ex04bg.webp) no-repeat top center;
        background-size: cover;
        border: 1px solid #ffffff;
        border-radius: 15px;
        width: 99%;
        height: auto;
        padding: 0%;
        margin-bottom: 1.5vw
    }
    #maincontents #sec06 .framebox .ex04 .title {
        padding: 4% 4% 2% 0%;
        width: 95%;
    }
    #maincontents #sec06 .framebox .ex04 .txt {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        padding: 4% 4% 6% 7%;
        text-align: left;
        font-weight: 800;
		font-size: 1em;
		letter-spacing: 1.64px;
		line-height: 1.7em;
    }





	#maincontents #foot {
		display: block;
		position: relative;
        z-index: 499;
        background-color: #ebc84a;
        background-size: 100%;
		overflow: hidden;
		max-width: 836px;
        height: 92vw;
        height: 100%;
        padding-bottom: 0.0vw;
    }
	#maincontents #foot .icon {
		position: relative;
		z-index: 5;
        top: 5.0%;
        margin: 0 auto;
		width: 35%;
        padding-top: 7.1%;
    }
	#maincontents #foot .icon img {
        width: 100%;
    }
    #maincontents #foot .foot__spec {
		position: relative;
		z-index: 4;
        text-align: center;
        padding-top: 3%;
        padding-bottom: 3%;
        margin-top: 7%;
		width: 97%;
        height: 13.6805555556vw;
        height: auto;
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        top: 0.1vw;
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        font-weight: 800;
		font-size: 0.8em;
		letter-spacing: 0.64px;
		line-height: 1.8em;
    }
    #maincontents #foot .foot__spec dl {
	    float: left;
	    padding-right: 2px;
	    text-align: center;
    }

    #maincontents #foot .foot__spec dt {
	    float: left;
	    clear: left;
	    width: 29%;
	    height: 1em;
        height: auto;
        margin-right: 2%;
        padding-top: 1%;
        padding-bottom: 1%;
	    font-weight: bold;
        text-align: right;
    }

    #maincontents #foot .foot__spec dd {
	    margin-left: 0px;
	    width: 65%;
	    height: 1em;
        height: auto;
        margin-right: 2%;
        padding-top: 1%;
        padding-bottom: 1%;
	    font-weight: 600;
        text-align: left;
    }
    #maincontents #foot .foot__spec dd span {
		font-size: 0.7em;
    }
    
	#maincontents #foot .foot__btn {
		z-index: 4;
		position: relative;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        top: 1%;
        padding-bottom: 1%;
		width: 77%;
        height: 11.0805555556vw;
        /*
        max-height: 95px;
        */
        margin: 0 auto;
	}
	#maincontents #foot .foot__btn ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 5.0%;
        margin: 0vw auto;
		width: 100%;
        height: 11.5805555556vw;
        /*
        max-height: 95px;
        */
	}
	#maincontents #foot .foot__btn ul li {
        margin-left: 5px;
        margin-right: 5px;
        margin-bottom: 5px;
        width: 44%;
        height: 4.2805555556vw;
        padding: 0px;
    }
	#maincontents #foot .foot__btn ul img {
        width: auto;
        height: 3.8805555556vw;
        max-height: 95px;
        /*
        */
	}
	#maincontents #foot .foot__links {
		z-index: 4;
		position: relative;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-color: #5f473a;
        top: 23%;
        bottom: 0;
		width: 100%;
        height: 14.1805555556vw;
        min-height: 75px;
        max-height: 170px;
        margin: 1vw auto 0 auto;
		font-family: 'M PLUS 1p', sans-serif;
		color: #ffffff;
	}
	#maincontents #foot .foot__links a:hover {
        text-decoration: underline;
    }
	#maincontents #foot .foot__links ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 0.0%;
        margin: 0 auto;
		width: 90%;
        height: auto;
	}
	#maincontents #foot .foot__links ul li {
        margin-left: 5px;
        margin-right: 5px;
        margin-bottom: 10px;
        padding: 15px 5px;
        width: 47%;
        height: 100%;
        letter-spacing: 1.0px;
		font-size: 1.2em;
        padding-bottom: 2vw;
    }
    #maincontents #foot .foot__links .foot__atten {
        padding-top: 70px;
        width: 95vw;
    }
	#maincontents #foot .foot__links .txt {
		position: relative;
        padding-top: 5px;
		width: 95%;
		font-size: 0.8em;
        line-height: 1.8em;
    }

	#maincontents #foot .foot__copy {
		z-index: 4;
		position: relative;
        text-align: center;
        background-color: #000;
        top: 15%;
        bottom: 0;
		width: 100%;
        height: auto;
        margin: 0vw auto 0 auto;
		font-family: 'M PLUS 1p', sans-serif;
		color: #ffffff;
        letter-spacing: 1.0px;
		font-size: 0.6em;
	}
	#maincontents #foot .foot__copy .copy {
		position: relative;
        padding-top: 1.2vw;
        padding-bottom: 1.2vw;
		width: 70%;
    }
}




@media screen and (min-width: 1131px) and (max-width: 1570px){
	#pc_dis.pc_dis_left {
		width: calc(100vw - 780px);
		height: 93lvh;
		min-height: 739px;
		position: fixed;
		right: auto;
		top: 0;
		bottom: 0;
		margin: auto 0;
		transition: left .3s ease-in-out;
		margin: 56px 0 16px 16px;
        background: url(../images/fv/kvpc.webp) no-repeat center 20%;
        background-image: url(../images/fv/kvpc.webp);
        background-image: image-set(url(../images/fv/kvpc.webp) 1x, url(../images/2x/fv/kvpc@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/fv/kvpc.webp) 1x, url(../images/2x/fv/kvpc@2x.webp) 2x);
        background-size: cover;
	}
	#pc_dis.pc_dis_left .fv_con {
		position: absolute;
		width: 100%;
		/*height: 58.1805555556vw;*/
        height: 100%;
		overflow: hidden
	}
	#pc_dis.pc_dis_left .fv_con .capt {
		display: none;
		pointer-events: none;
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		margin: auto;
		left: auto;
		z-index: 3;
		width: 5.4305555556vw;
		top: 1.2vw;
        right: 1vw;
	}
	#pc_dis.pc_dis_left .fv_con .capt02 {
        display: block;
		pointer-events: none;
		position: absolute;
		left: 0;
		right: 2.5vw;
		top: 2vw;
		bottom: 0;
		margin: auto;
		left: auto;
		z-index: 3;
		width: 10%;
    }
	#pc_dis.pc_dis_left .fv_con .capt03 {
        display: block;
		pointer-events: none;
		position: absolute;
		/*
		right: 0;
        padding-top: 60%;
		bottom: 10vw;
        */
		left: 1.2vw;
        top: auto;
        bottom: 1.2vw;
		margin: auto;
		z-index: 3;
		width: 10%;
    }
    
	
	#pc_dis.pc_dis_left .fv_cta {
		display: none;
		position: absolute;
		width: 29vw;
        max-width: 393px;
        height: 100%;
        max-height: 262px;
        /*
        max-height: 325px;
        */
        right: 1.8vw;
        bottom: 20px;
		overflow: hidden;
	}
	#pc_dis.pc_dis_left .fv_cta02 {
        display: block;
		position: absolute;
		width: 393px;
        max-width: 393px;
        height: 100%;
        max-height: 275px;
        /*
        max-height: 325px;
        */
        right: 1.8%;
        bottom: 15px;
		overflow: hidden;
	}


	#pc_dis.pc_dis_left .fv_cta02 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        text-align: center;
		right: 0.6vw;
		bottom: 37px;
		width: 353px;
        height: 30px;
        max-height: 30px;
    }
	#pc_dis.pc_dis_left .fv_cta02 ul li {
        width: 36.5%;
        height: auto;
        margin-left: 10px;
        margin-right: 25px;
    }
	#pc_dis.pc_dis_left .fv_cta02 ul li:first-child {
        width: 29.5%;
        height: auto;
        margin-left: 0px;
        margin-right: 15px;
    }
	#pc_dis.pc_dis_left .fv_cta02 ul li img {
        position: inherit;
        width: auto;
        height: 100%;
        max-height: 42px;
	}
    

    #pc_dis.pc_dis_left .fv_cta02 .ntg-rule-box-area {
      position: absolute;
      width: 350px;
      right: -172px;
      bottom: -11px;
      transform: translateX(-50%);
      margin: 0 auto;
  }

  
  #pc_dis.pc_dis_left .fv_cta02 .ntg-rule-box {
      position: relative;
      clear: both;
      width: 350px;
      max-width: 350px;
      /*
      background: rgba(0, 0, 0, 0.4);
      padding: 7px 14px 5px 14px;
      */
      box-sizing: border-box;
      display: block;
      margin: 0 auto 10px auto;
      line-height: 1.8 !important;
      color: #fff;
      overflow: hidden;
  }
  
  #pc_dis.pc_dis_left .fv_cta02 .ntg-rule-info {
      float: left;
      text-align: left;
      font-size: 9px;
      line-height: 2.5;
      padding-right: 5px;
  }
  
  #pc_dis.pc_dis_left .fv_cta02 .ntg-rule-prof {
      float: left;
      text-align: left;
      font-size: 9px;
      line-height: 2.5;
      padding-right: 5px;
  }
  
  #pc_dis.pc_dis_left .fv_cta02 .ntg-rule-comname {
      float: left;
      text-align: left;
      font-size: 9px;
      line-height: 2.5;
  }
  
  #pc_dis.pc_dis_left .fv_cta02 .ntg-rule-box,
  #pc_dis.pc_dis_left .fv_cta02 .ntg-rule-box a,
  #pc_dis.pc_dis_left .fv_cta02 .ntg-rule-box a:hover,
  #pc_dis.pc_dis_left .fv_cta02 .ntg-rule-box label,
  #pc_dis.pc_dis_left .fv_cta02 .ntg-rule-box strong {
      color: #fff !important;
      text-align: left !important;
      text-decoration: none !important;
      font-size: 9px !important;
      font-weight: 500 !important;
      font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif !important;
      line-height: inherit !important;
  }
  
  #pc_dis.pc_dis_left .fv_cta02 .ntg-rule-box a {
      text-decoration: underline !important;
      cursor: pointer !important;
  }
  
  #pc_dis.pc_dis_left .fv_cta02 .ntg-rule-box strong {
      font-weight: bold !important;
      font-size: inherit !important;
  }
  
  #pc_dis.pc_dis_left .fv_cta02 .ntg-rule-box input {
      display: inline !important;
  }
  
  #pc_dis.pc_dis_left .fv_cta02 .ntg-rule-info label, #pc_dis.pc_dis_left .fv_cta02 .ntg-rule-prof label {
    display: flex;          /* 横並びにする */
    align-items: center;    /* 上下中央揃えにする */
    gap: 2px;               /* チェックボックスと文字の間隔 */
    cursor: pointer;        /* クリックできることを分かりやすく */
    }
    #pc_dis.pc_dis_left .fv_cta02 .skipDetail_notification, #pc_dis.pc_dis_left .fv_cta02 .skipDetail_myapp {
      width: 10px;  /* 幅 */
      height: 10px; /* 高さ */
      cursor: pointer; /* マウスを乗せた時に指マークにする */
      accent-color: #fcba03; /* チェック時の色も変更可能（任意） */
    }







	#pc_dis02.pc_dis_right {
		width: 300px;
		height: 93lvh;
		right: 0;
		left: auto;
		background-color: #fffcf1;
		margin: 56px 16px 16px 0;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li {
		position: relative;
		margin-bottom: 10px;
		cursor: pointer;
		transition: all .6s cubic-bezier(0.22, 1, 0.36, 1);
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li::before {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		margin: auto;
		top: auto;
		bottom: 0;
		display: block;
		width: 100%;
		height: 1px;
		pointer-events: none;
		background-color: #f3c200;
		z-index: 0;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li_a {
		display: inline-block;
		margin-bottom: 0px;
        padding-top: 1.5vw;
        padding-bottom: 1.5vw;
        padding-left: 30px;
		overflow: visible;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li_a .rmenu span {
		display: block;
		margin-right: 20px;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li_a .rmenu span img {
		width: 20px;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_logo {
		width: 320px;
		margin: 0 auto 40px;
        padding-left: 30px;
	}
    
	#pc_dis02.pc_dis_right .frame01 {
		position: absolute;
        top: 10px;
	}
	#pc_dis02.pc_dis_right .frame01 img {
		width: 95%;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_logo {
		width: 275px;
		margin: 0 auto 15px;
        padding-left: 30px;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li_a {
		display: inline-block;
		margin-bottom: 0px;
        padding-top: 1.0vw;
        padding-bottom: 1.0vw;
        padding-left: 20px;
		overflow: visible;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li_a .rmenu p {
		font-family: 'M PLUS 2p', sans-serif;
		color: #846a5c;
        font-weight: 800;
		font-size: 1.1em;
		letter-spacing: 0.44em;
		line-height: 1.2em;
	}

    .fv_homerare  {
        display: none;
		position: fixed;
        z-index: 400;
		width: 353px;
        height: 300px;
        right: 0vw;
        bottom: 0;
	}
	.fv_homerare .frame02 {
		position: absolute;
        z-index: 400;
        width: 190px;
        right: 115px;
        bottom: 128px;
	}
	.fv_homerare .frame03 {
		position: absolute;
        z-index: 400;
		width: 423px;
        right: 0vw;
        bottom: -35px;
	}
	.fv_homerare .btn_homerare {
		position: absolute;
        z-index: 400;
        width: 250px;
        right: 55px;
        bottom: 30px;
	}
	.fv_homerare .txt_homerare {
		position: absolute;
        z-index: 400;
        width: 290px;
        right: 15px;
        bottom: 15px;
	}
    




	#wrapper {
		position: relative;
        z-index: 400;
		background-color: #efe8d0;
		overflow: hidden;
		max-width: 450px;
		margin: 0 auto;
		right: 315px;
        padding-top: 0vh;
	}

	#maincontents .fv {
		display: none;
	}
	#maincontents #sec01 {
		display: block;
		position: relative;
        z-index: 499;
        background: url(../images/sec01/pcbg.webp) no-repeat top center;
        background-image: url(../images/sec01/pcbg.webp);
        background-image: image-set(url(../images/sec01/pcbg.webp) 1x, url(../images/2x/sec01/pcbg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec01/pcbg.webp) 1x, url(../images/2x/sec01/pcbg@2x.webp) 2x);
        background-size: 100%;
		overflow: hidden;
		max-width: 615px;
        height: 650px;
		margin: 1.0vw auto 0 auto;
	}
	#maincontents #sec01 .pcfv_capt{
        padding-top: 25%;
    }
	#maincontents #sec01 .pcfv_capt img {
        width: 90%;
    }
	#maincontents #sec01 .icons {
        display: none;
    }
	#maincontents #sec01 .boy {
        display: none;
    }
	#maincontents #sec01 .sec01rb01 {
        display: none;
		position: absolute;
        z-index: 800;
        top: 32.2vw;
        left: -4.0vw;
        width: 11vw;
    }
	#maincontents #sec01 .sec01rb01 img {
        width: 98%;
    }
	#maincontents #sec01 .sec01rb02 {
        display: none;
		position: absolute;
        z-index: 800;
        top: 36.2vw;
        right: -4.0vw;
        width: 10vw;
    }
	#maincontents #sec01 .sec01rb02 img {
        width: 98%;
    }



	#maincontents #sec01 .md {
        padding-top: 71.5%;
        padding-bottom: 5%;
        /*
        */
    }
	#maincontents #sec01 .md img {
        width: 90%;
    }
	#maincontents #sec01 .cta_btn__ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-image: url(../images/cta/btnframe_Pre.webp);
        background-image: image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-repeat: no-repeat;
        background-position: top center;
        background-size: 100%;
        padding-top: 80%;
		width: 100%;
        height: auto;
	}
	#maincontents #sec01 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 12.5%;
        margin: 0 auto;
		width: 100%;
        height: auto;
	}
	#maincontents #sec01 ul li {
        margin-left: 5px;
        margin-right: 5px;
        margin-bottom: 10px;
        width: 49%;
        padding: 5px;
    }
	#maincontents #sec01 ul li:first-child {
        width: 41.5%;
    }
	#maincontents #sec01 ul li:nth-of-type(3) {
        width: 55%;
    }
	#maincontents #sec01 ul img {
        width: 100%;
        height: auto;
        max-height: 106px;
        /*
        */
	}

    

    #maincontents .ntg-rule-box-area {
      position: relative;
      width: 350px;
      right: 0;
      top: -135px;
      transform: translateX(-0%);
      margin: 0 auto;
  }

  
  #maincontents .ntg-rule-box {
      position: relative;
      clear: both;
      width: 350px;
      max-width: 350px;
      /*
      background: rgba(0, 0, 0, 0.4);
      padding: 7px 14px 5px 14px;
      */
      box-sizing: border-box;
      display: block;
      margin: 0 auto 10px auto;
      line-height: 1.8 !important;
      color: #fff;
      overflow: hidden;
  }
  
  #maincontents .ntg-rule-info {
      float: left;
      text-align: left;
      font-size: 14px;
      line-height: 2.2;
      padding-right: 10px;
  }
  
  #maincontents .ntg-rule-prof {
      float: left;
      text-align: left;
      font-size: 14px;
      line-height: 2.2;
      padding-right: 5px;
  }
  
  #maincontents .ntg-rule-comname {
      float:inherit;
      text-align: center;
      font-size: 14px;
      line-height: 2.2;
  }
  
  #maincontents .ntg-rule-box,
  #maincontents .ntg-rule-box a,
  #maincontents .ntg-rule-box a:hover,
  #maincontents .ntg-rule-box label,
  #maincontents .ntg-rule-box strong {
      color: #5f473a !important;
      text-align: left !important;
      text-decoration: none !important;
      font-size: 14px !important;
      font-weight: 600 !important;
      font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif !important;
      line-height: inherit !important;
  }
  
  #maincontents .ntg-rule-box a {
      text-decoration: underline !important;
      cursor: pointer !important;
  }
  
  #maincontents .ntg-rule-box strong {
      font-weight: bold !important;
      font-size: inherit !important;
  }
  
  #maincontents .ntg-rule-box input {
      display: inline !important;
  }
  
  #maincontents .ntg-rule-info label, #maincontents .ntg-rule-prof label {
    display: flex;          /* 横並びにする */
    align-items: center;    /* 上下中央揃えにする */
    gap: 6px;               /* チェックボックスと文字の間隔 */
    cursor: pointer;        /* クリックできることを分かりやすく */
    }
    #maincontents .skipDetail_notification, #maincontents .skipDetail_myapp {
      width: 14px;  /* 幅 */
      height: 14px; /* 高さ */
      cursor: pointer; /* マウスを乗せた時に指マークにする */
      accent-color: #fcba03; /* チェック時の色も変更可能（任意） */
    }






	#maincontents #sec01 .btn_homerare {
		position: absolute;
		z-index: 5;
        top: 81.0%;
        margin: 0 auto;
		width: 98%;
        padding-top: 0.1%;
    }
	#maincontents #sec01 .btn_homerare img {
        width: 85%;
    }




    

	#maincontents #sec07 {
		display: block;
		position: relative;
        z-index: 599;
        top: -140px;
        background: url(../images/sec07/mdbg.webp) no-repeat top center;
        background-image: url(../images/sec07/mdbg.webp);
        background-image: image-set(url(../images/sec07/mdbg.webp) 1x, url(../images/2x/sec07/mdbg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec07/mdbg.webp) 1x, url(../images/2x/sec07/mdbg@2x.webp) 2x);
        background-size: 100%;
        /*
        background: none;
        */
		overflow: hidden;
		max-width: 836px;
        height: 150vw;
        height: 2270px;
	}

	#maincontents #sec07 #cam {
		display: block;
		position: relative;
        z-index: 499;
        top: 2.6%;
        height: 110vw;
        height: 1620px;
        /*
        */
    }
	#maincontents #sec07 #cam .md {
		position: relative;
        z-index: 499;
        padding-top: 1vw;
        /*
        */
    }
	#maincontents #sec07 #cam .md img {
        width: 90%;
    }

	#maincontents #sec07 #cam .sec07rb71 {
		position: absolute;
        z-index: 800;
        top: -2.8%;
        left: -6.3vw;
        width: 11.6vw;
    }
	#maincontents #sec07 #cam .sec07rb71 img {
        width: 60%;
    }
	#maincontents #sec07 #cam .sec07rb72 {
		position: absolute;
        z-index: 800;
        top: -3.2%;
        right: -5.5vw;
        width: 11vw;
    }
	#maincontents #sec07 #cam .sec07rb72 img {
        width: 64%;
    }

    
	#maincontents #sec07 #cam .txt {
		position: relative;
        z-index: 499;
		width: 427px;
        height: 406px;
        padding-top: 3vw;
        /*
        */
    }
	#maincontents #sec07 #cam .txt img {
        width: 100%;
    }



	#maincontents #sec07 #cam .lef01 {
		position: relative;
		z-index: 5;
        top: -4.0vw;
        left: 2.0%;
        margin: 0 auto;
		width: 35%;
        padding-top: 0.1%;
    }
	#maincontents #sec07 #cam .lef01 img {
        width: 75%;
    }
    #maincontents #sec07 #cam .lef01 {
        transform-origin: center bottom;
        animation: yurayura 2s linear infinite;
    }

    @keyframes yurayura {
        0% , 100%{
            transform: rotate(10deg);
        }
        50%{
            transform: rotate(-10deg);
        }
    }

	#maincontents #sec07 #cam .campaign__ul {
		z-index: 4;
		position: absolute;
        text-align: center;
        top: 570px;
        background-image: url(../images/sec07/bg.webp);
        background-image: image-set(url(../images/sec07/bg.webp) 1x, url(../images/2x/sec07/bg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec07/bg.webp) 1x, url(../images/2x/sec07/bg@2x.webp) 2x);
        background-repeat: no-repeat;
        background-position: top center;
        background-size: 100% 100%;
		width: 100%;
        height: 991px;
	}
	#maincontents #sec07 #cam .campaign__ul ul {
		z-index: 4;
		position: absolute;
        text-align: center;
        background-size: cover;
        top: -1.5vw;
        margin: 0 auto;
		width: 100%;
        height: auto;
	}
	#maincontents #sec07 #cam .campaign__ul ul li {
        margin-left: 5px;
        margin-right: 5px;
        margin-bottom: 2.1vw;
        margin: 0 auto 0.3vw auto;
        width: 100%;
        height: auto;
        max-height: 522px;
        padding: 5px 0 0.1vw 0;
    }
	#maincontents #sec07 #cam .campaign__ul ul img {
        width: auto;
        height: 100%;
        max-height: 522px;
        /*
        */
	}
	#maincontents #sec07 #cam .campaign__ul ul li.cam01 {
        margin: 5vw auto 0.3vw auto;
        width: 100%;
        height: auto;
    }
	#maincontents #sec07 #cam .lef02 {
        display: none;
		position: absolute;
		z-index: 5;
        top: 35.0vw;
        right: 1.0vw;
        margin: 0 auto;
		width: 25%;
        padding-top: 1.1%;
    }
	#maincontents #sec07 #cam .lef02 img {
        width: 75%;
    }
    #maincontents #sec07 #cam .lef02 {
        transform-origin: center bottom;
        animation: yurayura 2s linear infinite;
    }

    @keyframes yurayura {
        0% , 100%{
            transform: rotate(10deg);
        }
        50%{
            transform: rotate(-10deg);
        }
    }

	#maincontents #sec07 #cam .attention {
		position: relative;
		z-index: 5;
        top: 730px;
        margin: 2vw auto;
		width: 94%;
        padding-top: 0%;
        text-align: left;
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        font-weight: 800;
		font-size: 0.8em;
		letter-spacing: 0.64px;
		line-height: 1.8em;
    }
	#maincontents #sec07 #cam .attention img {
        width: 100%;
    }
	#maincontents #sec07 .ctamd {
        position: relative;
        top: 30px;
        width: 90%;
    }
	#maincontents #sec07 .ctamd img {
        width: 100%;
    }


	#maincontents #sec07 .registmd {
		position: relative;
        top: 1.2%;
        /*
        */
    }
	#maincontents #sec07 .registmd img {
        width: 90%;
    }
	#maincontents #sec07 .cta_btn__ul {
		z-index: 4;
		position: relative;
        top: 50px;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-image: url(../images/cta/btnframe_Pre.webp);
        background-image: image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-repeat: no-repeat;
        background-position: top center;
        background-size: 100%;
        padding-top: 80%;
		width: 100%;
        height: auto;
	}
	#maincontents #sec07 .cta_btn__ul ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 11.8%;
        margin: 0 auto;
		width: 100%;
        height: auto;
	}
	#maincontents #sec07 .cta_btn__ul ul li {
        margin-left: 6px;
        margin-right: 6px;
        margin-bottom: 12px;
        width: 49%;
        padding: 5px;
    } 
    #maincontents #sec07 .cta_btn__ul ul li:first-child {
        width: 41.5%;
    }
    #maincontents #sec07 .cta_btn__ul ul li:nth-of-type(3) {
        width: 55%;
    }
	#maincontents #sec07 .cta_btn__ul ul img {
        width: 100%;
        height: auto;
        max-height: 106px;
        /*
        */
	}

	#maincontents #sec07 .cta_btn__ul .btn_homerare {
		position: absolute;
		z-index: 5;
        top: 81.0%;
        margin: 0 auto;
		width: 98%;
        padding-top: 0.1%;
    }
	#maincontents #sec07 .cta_btn__ul .btn_homerare img {
        width: 85%;
        height: auto;
    }
    



    
	#maincontents .sec02rb01 {
		position: absolute;
        z-index: 800;
        top: 2700px;
        right: -20px;
        width: 70px;
    }
	#maincontents .sec02rb01 img {
        width: 98%;
    }
    [data-aos=HorizontalOpen]{ clip-path:inset(0 1000px); }
    [data-aos=HorizontalOpen].aos-animate{ clip-path:inset(0 0); }
    [data-aos=HorizontalOpenT]{ clip-path:inset(1000px 0); }
    [data-aos=HorizontalOpenT].aos-animate{ clip-path:inset(0 0); }




	#maincontents #sec02 {
		display: block;
		position: relative;
        z-index: 499;
        top: -130px;
		overflow: hidden;
		max-width: 836px;
        height: 286vw;
        height: 3500px;
		margin: 0vw auto 0.0vw auto;
	}


	#maincontents #sec02 .md {
		position: relative;
        top: 0vw;
        padding-bottom: 2vw;
    }
	#maincontents #sec02 .md img {
        width: 88%;
    }

    
	#maincontents #sec02 .point01 {
		position: relative;
        height: 790px;
		/*
        max-height: 64vw;
        */
    }

	#maincontents .sec02rb02 {
		position: absolute;
        z-index: 800;
        top: 80px;
        left: -50px;
        width: 100px;
    }
	#maincontents .sec02rb02 img {
        width: 98%;
    }

	#maincontents #sec02 .point01 .bg {
		position: absolute;
        width: 100%;
        top: 4%;
        left: -7.7%;
    }
	#maincontents #sec02 .point01 .pointbase {
		position: absolute;
        padding-top: 0vw;
        width: 70px;
        top: 0px;
        left: 30px;
        animation: rotateAnimation 6s linear infinite;
    }
    @keyframes rotateAnimation {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }
	#maincontents #sec02 .point01 .pt {
		position: absolute;
        width: 35px;
        top: 22px;
        left: 48px;
    }
	#maincontents #sec02 .point01 .txt {
		position: absolute;
        top: 20px;
        right: 1vw;
        /*width: 8.5vw;*/
    }
	#maincontents #sec02 .point01 .txt img {
        width: 105px;
    }
	#maincontents #sec02 .point01 .support_ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
		bottom: 0;
        top: 0.0%;
        margin: 5px auto;
		width: 99.5%;
        height: auto;
	}
	#maincontents #sec02 .point01 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 520px;
        margin: 0 auto;
		width: 99%;
        height: 100%;
	}
	#maincontents #sec02 .point01 ul li {
        margin-left: 5px;
        margin-right: 5px;
        width: 47%;
        padding: 5px;
    }
	#maincontents #sec02 .point01 ul img {
        height: auto;
	}
	#maincontents #sec02 .point01 .ss01 {
		position: absolute;
		left: 3.5%;
		bottom: 0;
        top: -28.5%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point01 .ss01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec02 .point01 .ss02 {
		position: absolute;
		right: 3.5%;
		bottom: 0;
        top: -28.3%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point01 .ss02.aos-animate {
        filter: blur(0px);
    }
    

	#maincontents #sec02 .point02 {
		position: relative;
        height: 850px;
		/*max-height: 68vw;*/
    }
	#maincontents #sec02 .point02 .bg {
		position: absolute;
        width: 100%;
        top: 5%;
        right: -6.2%;
    }
	#maincontents #sec02 .point02 .pointbase {
		position: absolute;
        padding-top: 0vw;
        width: 70px;
        top: 0px;
        right: 25px;
        animation: rotateAnimation 6s linear infinite;
    }
    @keyframes rotateAnimation {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }
	#maincontents #sec02 .point02 .pt {
		position: absolute;
        width: 35px;
        top: 22px;
        right: 43px;
    }
	#maincontents #sec02 .point02 .txt {
		position: absolute;
        top: 3.8vw;
        left: 1.5vw;
        /*width: 8.5vw;*/
    }
	#maincontents #sec02 .point02 .txt img {
        width: 105px;
    }
	
	#maincontents #sec02 .point02 .support_ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
		bottom: 0;
        top: 0.0%;
        margin: 5px auto;
		width: 99.5%;
        height: 100%;
	}
	#maincontents #sec02 .point02 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 550px;
        margin: 0 auto;
		width: 99%;
        height: 100%;
	}
	#maincontents #sec02 .point02 ul li {
        margin-left: 5px;
        margin-right: 5px;
        width: 47%;
        padding: 5px;
    }
	#maincontents #sec02 .point02 ul img {
        height: auto;
	}
	#maincontents #sec02 .point02 .ss01 {
		position: absolute;
		left: 3.5%;
		bottom: 0;
        top: -26.5%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point02 .ss01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec02 .point02 .ss02 {
		position: absolute;
		right: 3.5%;
		bottom: 0;
        top: -26.7%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point02 .ss02.aos-animate {
        filter: blur(0px);
    }



	#maincontents .sec02rb03 {
		position: absolute;
        z-index: 800;
        top: 1300px;
        left: -50px;
        width: 90px;
    }
	#maincontents .sec02rb03 img {
        width: 88%;
    }


	#maincontents #sec02 .point03 {
		position: relative;
        height: 890px;
		/*max-height: 62vw;*/
    }
    
	#maincontents #sec02 .point03 .bg {
		position: absolute;
        width: 100%;
        top: 6%;
        left: -7.7%;
    }
	#maincontents #sec02 .point03 .pointbase {
		position: absolute;
        padding-top: 0vw;
        width: 70px;
        top: 1.8%;
        left: 30px;
        animation: rotateAnimation 6s linear infinite;
    }
    @keyframes rotateAnimation {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }
	#maincontents #sec02 .point03 .pt {
		position: absolute;
        width: 35px;
        top: 38px;
        left: 48px;
    }
	#maincontents #sec02 .point03 .txt {
		position: absolute;
        top: 3.5%;
        right: 1.5vw;
        width: 7.5vw;
    }
	#maincontents #sec02 .point03 .txt img {
        width: 100%;
    }
	#maincontents #sec02 .point03 .support_ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
		bottom: 0;
        top: 0.0%;
        margin: 5px auto;
		width: 99.5%;
        height: 100%;
	}
	#maincontents #sec02 .point03 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 590px;
        margin: 0 auto;
		width: 99%;
        height: 100%;
	}
	#maincontents #sec02 .point03 ul li {
        margin-left: 5px;
        margin-right: 5px;
        width: 47%;
        padding: 5px;
    }
	#maincontents #sec02 .point03 ul img {
        height: auto;
	}
	#maincontents #sec02 .point03 .ss01 {
		position: absolute;
		left: 3.5%;
		bottom: 0;
        top: -26.4%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point03 .ss01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec02 .point03 .ss02 {
		position: absolute;
		right: 3.5%;
		bottom: 0;
        top: -26.2%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point03 .ss02.aos-animate {
        filter: blur(0px);
    }



	#maincontents .sec02rb04 {
		position: absolute;
        z-index: 800;
        top: 2200px;
        right: -3.8vw;
        width: 7vw;
    }
	#maincontents .sec02rb04 img {
        width: 88%;
    }



	#maincontents #sec02 .point04 {
		position: relative;
        height: 930px;
		/*max-height: 65vw;*/
    }
	#maincontents #sec02 .point04 .bg {
		position: absolute;
        width: 100%;
        top: 5%;
        right: -6.2%;
    }
	#maincontents #sec02 .point04 .pointbase {
		position: absolute;
        padding-top: 0vw;
        width: 70px;
        top: 0px;
        right: 25px;
        animation: rotateAnimation 6s linear infinite;
    }
    @keyframes rotateAnimation {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }
	#maincontents #sec02 .point04 .pt {
		position: absolute;
        width: 35px;
        top: 22px;
        right: 41px;
    }
	#maincontents #sec02 .point04 .txt {
		position: absolute;
        top: 3.8vw;
        left: 1.5vw;
        width: 6.5vw;
    }
	#maincontents #sec02 .point04 .txt img {
        width: 100%;
    }
	
	#maincontents #sec02 .point04 .support_ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
		bottom: 0;
        top: 0.0%;
        margin: 5px auto;
		width: 99.5%;
        height: 100%;
	}
	#maincontents #sec02 .point04 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 640px;
        margin: 0 auto;
		width: 99%;
        height: 100%;
	}
	#maincontents #sec02 .point04 ul li {
        margin-left: 5px;
        margin-right: 5px;
        width: 47%;
        padding: 5px;
    }
	#maincontents #sec02 .point04 ul img {
        height: auto;
	}
	#maincontents #sec02 .point04 .ss01 {
		position: absolute;
		left: 3.5%;
		bottom: 0;
        top: -28.5%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point04 .ss01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec02 .point04 .ss02 {
		position: absolute;
		right: 3.5%;
		bottom: 0;
        top: -28.7%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point04 .ss02.aos-animate {
        filter: blur(0px);
    }


	#maincontents .sec02rb05 {
		position: absolute;
        z-index: 800;
        top: 3000px;
        left: -4.4vw;
        width: 9vw;
    }
	#maincontents .sec02rb05 img {
        width: 60%;
    }



	#maincontents #sec03 {
		display: block;
		position: relative;
        z-index: 499;
        background: url(../images/sec03/bg.webp) no-repeat top center;
        background-image: url(../images/sec03/bg.webp);
        background-image: image-set(url(../images/sec03/bg.webp) 1x, url(../images/2x/sec03/bg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec03/bg.webp) 1x, url(../images/2x/sec03/bg@2x.webp) 2x);
        background-size: 100%;
		overflow: hidden;
		max-width: 836px;
        height: 92vw;
        height: 1320px;
	}
	#maincontents #sec03 .sec03_capt {
		position: relative;
        top: -5vw;
    }
	#maincontents #sec03 .sec03_capt img {
        width: 90%;
    }
	#maincontents #sec03 .voice_sample {
		position: relative;
        top: 2vw;
        width: 100%;
        height: 12vw;
        background: url(../images/sec03/btnbg.webp) repeat-y top center;
        background-image: url(../images/sec03/btnbg.webp);
        background-image: image-set(url(../images/sec03/btnbg.webp) 1x, url(../images/2x/sec03/btnbg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec03/btnbg.webp) 1x, url(../images/2x/sec03/btnbg@2x.webp) 2x);
        background-size: cover;
    }
	#maincontents #sec03 .voice_sample .catch {
		position: relative;
        top: 1.5vw;
        width: 90%;
    }
	#maincontents #sec03 .voice_sample .btn {
		position: relative;
        top: 2.4vw;
        width: 70%;
    }
	#maincontents #sec03 .voice_sample .starl {
		position: relative;
        top: -8%;
        left: -41.5%;
        width: 10%;
    }
	#maincontents #sec03 .voice_sample .starr {
		position: relative;
        top: -45.7%;
        right: -41.5%;
        width: 10%;
    }
	#maincontents #sec03 .voice_slider {
		position: relative;
        top: 4vw;
		width: 100%;
        /*
        */
    }
	#maincontents #sec03 .voice_slider img {
        width: 90%;
    }
    
    /* スライド内の画像を中央寄せにする */
    .voice_slider .slick-slide img {
        display: block;
        margin: 0 auto;
    }


    /* --- スライドショーの矢印カスタマイズ --- */

    /* 矢印画像の共通設定 */
    #maincontents #sec03 .voice_slider .slide-arrow {
        position: absolute;
        top: 50%;             /* 垂直方向の中央 */
        transform: translateY(-50%); /* 中央位置の補正 */
        cursor: pointer;      /* カーソルを指の形に */
        z-index: 10;          /* 画像より手前に表示 */
        width: 50px;          /* ★矢印の大きさ（お好みで調整してください） */
        height: auto;
    }
    
    /* 左矢印の位置 */
    #maincontents #sec03 .voice_slider .prev-arrow {
        left: 10px;           /* 左端から少し内側へ */
    }
    
    /* 右矢印の位置 */
    #maincontents #sec03 .voice_slider .next-arrow {
        right: 10px;          /* 右端から少し内側へ */
    }
    #maincontents #sec03 .voice_slider .slick-dots {
        bottom: -35px;
    }
    #maincontents #sec03 .voice_slider .slick-dots li button:before {
        width: 30px;
        height: 30px;
        font-size: 10px;
    }





	#maincontents #sec03 .md {
		position: relative;
        top: 5.5vw;
        /*
        */
    }
	#maincontents #sec03 .md img {
        width: 90%;
    }
	#maincontents #sec03 .cta_btn__ul {
		z-index: 4;
		position: relative;
        top: 6.5vw;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-image: url(../images/cta/btnframe_Pre.webp);
        background-image: image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-repeat: no-repeat;
        background-position: top center;
        background-size: 100%;
        padding-top: 80%;
		width: 100%;
        height: auto;
	}
	#maincontents #sec03 .cta_btn__ul ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 11.5%;
        margin: 0 auto;
		width: 100%;
        height: auto;
	}
	#maincontents #sec03 .cta_btn__ul ul li {
        margin-left: 6px;
        margin-right: 6px;
        margin-bottom: 12px;
        width: 49%;
        padding: 5px;
    } 
    #maincontents #sec03 .cta_btn__ul ul li:first-child {
        width: 41.5%;
    }
	#maincontents #sec03 .cta_btn__ul ul li:nth-of-type(3) {
        width: 55%;
    }
	#maincontents #sec03 .cta_btn__ul ul img {
        width: 100%;
        height: auto;
        max-height: 106px;
        /*
        */
	}

	#maincontents #sec03 .cta_btn__ul .btn_homerare {
		position: absolute;
		z-index: 5;
        top: 81.0%;
        margin: 0 auto;
		width: 98%;
        padding-top: 0.1%;
    }
	#maincontents #sec03 .cta_btn__ul .btn_homerare img {
        width: 85%;
        height: auto;
    }



	#maincontents #sec04 {
		display: block;
		position: relative;
        z-index: 899;
        background-size: 105%;
		overflow: hidden;
		max-width: 836px;
        height: 85vw;
        height: 1050px;
	}
	#maincontents #sec04 .md {
        padding-top: 5.5%;
        padding-bottom: 4%;
        /*
        */
    }
	#maincontents #sec04 .md img {
        width: 90%;
    }
	

    #sec04 .container {
        margin: 5% auto 10% auto;
        flex-direction: column;
        align-items: center;
    }
    #sec04 .box {
        width: 100%;
        height: auto;
        opacity: 1;
        transition: opacity 0.5s ease-in-out;	
    }
    #sec04 .background-image {
        width: 100%;
        height: auto;
        opacity: 1;
        transition: opacity 0.5s ease-in-out;
    }	
    #sec04 .background-image.hidden {
        opacity: 0;
    }
    #sec04 .audio-buttons {
        display: none;
        position: relative;
        top: -416px;
        left: -112px;
        width: 200x;
    }
    #sec04 .audio-btn {
        margin: 0% 2px 0% 2px;
        padding: 0 3px;
        border: none;
        cursor: pointer;
        width: 46px;
    }
    #sec04 .voice_capt	{
        top: 20%;
        left: 71%;
        width: 26%;
        height: auto;
        position: absolute;
        display: flex;
        animation: float 3s ease-in-out infinite;
    }
    @keyframes float {
        0%, 100% {
            transform: translateY(0); /* 初期位置 */
        }
        50% {
            transform: translateY(-5px); /* 上に移動 */
        }
    }	
    #sec04 .thumbnails {
        position: relative;
        top: -9vw;
        flex-wrap: wrap;
        justify-content: center;
    }
    #sec04 .thumbnail {
        width: 20%;
        height: auto;
        margin: 5px 7px;
    }
    .thumbnail.active {
        filter: brightness(0.5);
    }  	
	#sec04 .left-arrow, .right-arrow {
        font-size: 1.5em;
        position: absolute;
    z-index:10;
    }
    #sec04 .left-arrow {
        display:none;
        margin: 50% 0% 0% 0%;
        width: 8%;}
    #sec04 .right-arrow {
        display: none;
        margin: -68% 0% 0% 0%;
        right: 0%;
        width:8%;
    }	
    #sec04 .thumbnail.active {
        filter: brightness(1.2);
    }	

    
    /* 親要素（キャラ表示エリア） */
.character_display_area {
    position: relative;
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
}

/* ボイスユニット全体の位置 */
.voice_unit {
    display: none;
    position: absolute;
    /* 位置調整：立ち絵の左側、いい感じの高さに配置 */
    top: 32%; 
    left: 4%; 
    width: 40%; /* 立ち絵に対する幅の比率。スマホで小さすぎないよう調整 */
    z-index: 10;
}

/* ベース画像（黄色や青の画像） */
.voice_base_img {
    width: 100%;
    height: auto;
    display: block;
}

/* 透明ボタンを配置するエリア */
.voice_hit_zones {
    position: absolute;
    /* 画像の下部（カプセル部分）に合わせるための調整 */
    /* "VOICE"の文字が画像に含まれている場合、少し下げる必要があります */
    bottom: 10%; 
    left: 24%; /* 左側のアイコン部分（約1/4）を避ける */
    width: 74%; /* 残りの右側部分 */
    height: 42%; /* 高さ調整："VOICE"の文字を除いたカプセルの高さに合わせる */
    display: flex; /* 横並びにする */
}

/* 個別の透明ボタン */
.v-zone {
    flex: 1; /* 3つのボタンを均等な幅にする */
    background-color: transparent; /* 透明 */
    border: none;
    cursor: pointer;
    /* タップしたかわかるように少しだけハイライト（お好みで削除可） */
    transition: background-color 0.2s;
    border-radius: 5px;
}

/* ホバー時やタップ時に薄く白く光らせる（操作感のため） */
.v-zone:hover, .v-zone:active {
    background-color: rgba(255, 255, 255, 0.3);
}






/* スマホ用の微調整 */
@media screen and (max-width: 768px) {
    .voice_unit {
        width: 35%; /* スマホでは少し大きめに表示 */
        top: 38%;
        left: 2%;
    }
}


/* --- ZOOMボタンの配置 --- */
.zoom_btn_container {
    display: none;
    position: absolute;
    /* デザイン画像の位置に合わせて調整 */
    top: 54%; 
    right: 1.5%; 
    width: 13%; /* ボタンの大きさ */
    z-index: 20;
    cursor: pointer;
    transition: transform 0.2s;
}
.zoom_btn_container:hover {
    transform: scale(1.1); /* ホバー時に少し大きくなる */
}
.zoom_btn_container img {
    width: 100%;
    display: block;
    /* ドロップシャドウをつけると浮いて見えて押しやすくなります（お好みで） */
    filter: drop-shadow(0px 2px 3px rgba(0,0,0,0.2));
}

/* --- スマホ時のZOOMボタン調整 --- */
@media screen and (max-width: 768px) {
    .zoom_btn_container {
        width: 16%; /* スマホでは指で押しやすいように少し大きく */
        top: 52%;
        right: 2%;
    }
}

/* --- ポップアップ（モーダル）全体のスタイル --- */
.popup_overlay {
    display: none; /* 初期状態は非表示 */
    position: fixed;
    z-index: 9999; /* 最前面 */
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.85); /* 背景を暗く */
    opacity: 0;
    transition: opacity 0.3s ease;
    justify-content: center;
    align-items: center;
    padding: 20px; /* 画面端の余白 */
    box-sizing: border-box;
}

/* 表示時のクラス */
.popup_overlay.show {
    display: flex;
    opacity: 1;
}

/* ポップアップの中身 */
.popup_content {
    position: relative;
    top: 20px;
    max-width: 80%;
    max-height: 80%;
    text-align: center;
    background: #fff;
}

/* 拡大画像の設定 */
.popup_content img {
    width: 80%;
    height: 80%;
    /* 画面の高さいっぱいに表示しつつ、横幅も画面に収める */
    max-height: 90vh; 
    max-width: 100%; 
    border-radius: 8px;
    box-shadow: 0 0 20px rgba(255, 255, 255, 0.2);
}

/* 閉じるボタン（×） */
.popup_close {
    position: absolute;
    top: -45px;
    right: -10px;
    color: #fff;
    font-size: 40px;
    font-weight: bold;
    cursor: pointer;
    line-height: 1;
    text-shadow: 0 0 5px rgba(0,0,0,0.5);
}

/* スマホの場合、閉じるボタンを少し内側に */
@media screen and (max-width: 768px) {
    .popup_close {
        top: -45px;
        right: 0;
    }
}

}

@media screen and (min-width: 1131px) and (max-width: 1570px) {
    #pc_dis.pc_dis_left .fv_con .capt03 {
        /* 下寄せを解除して上に移動 */
        bottom: auto !important; 
        
        /* 他のキャッチコピーの下に来るように調整（数値は微調整してください） */
        top: 30vw !important; 
        
        /* 左の余白はそのまま維持 */
        left: 1.2vw !important; 
    }





	#maincontents #sec05 .sec05rb51 {
		position: absolute;
        z-index: 800;
        top: -10px;
        right: -2.8%;
        width: 5vw;
    }
	#maincontents #sec05 .sec05rb51 img {
        width: 78%;
    }
	#maincontents #sec05 .sec05rb52 {
		position: absolute;
        z-index: 800;
        top: -50px;
        left: -7.5%;
        width: 6vw;
    }
	#maincontents #sec05 .sec05rb52 img {
        width: 88%;
    }

	#maincontents #sec05 {
		display: block;
		position: relative;
        z-index: 499;
        background: url(../images/sec05/bg.webp) no-repeat top center;
        background-image: url(../images/sec05/bg.webp);
        background-image: image-set(url(../images/sec05/bg.webp) 1x, url(../images/2x/sec05/bg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec05/bg.webp) 1x, url(../images/2x/sec05/bg@2x.webp) 2x);
        background-size: 105%;
		overflow: hidden;
		max-width: 836px;
        height: 83.0vw;
        height: 980px;
	}
	#maincontents #sec05 .md {
        padding-top: 2.5%;
        padding-bottom: 4%;
        margin-top: 10%;
        /*
        */
    }
	#maincontents #sec05 .md img {
        width: 90%;
    }
	#maincontents #sec05 .story01 {
		position: relative;
		position: relative;
        margin-top: 10%;
        /*
        */
    }
	#maincontents #sec05 .story01 .you {
		position: absolute;
        z-index: 10;
        left: 0%;
        width: 37%;
    }
	#maincontents #sec05 .story01 .capt01 {
		position: absolute;
        z-index: 11;
        right: 3%;
        width: 60%;
    }
	#maincontents #sec05 .story01 .txt01 {
		position: absolute;
        z-index: 11;
        right: 3%;
        width: 56%;
        padding-top: 9%;
        filter: blur(5px); /* ぼかしの強さを指定 */
        transition: filter 2s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec05 .story01 .txt01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec05 .story02 {
		position: relative;
        margin-top: 65%;
        /*
        */
    }
	#maincontents #sec05 .story02 .capt02 {
		position: absolute;
        z-index: 11;
        left: 3%;
        width: 55%;
    }
	#maincontents #sec05 .story02 .txt02 {
		position: absolute;
        z-index: 11;
        left: 3%;
        width: 56%;
        padding-top: 19%;
        filter: blur(5px); /* ぼかしの強さを指定 */
        transition: filter 2s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec05 .story02 .txt02.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec05 .story02 .apartment {
		position: absolute;
        z-index: 10;
        right: -2.0vw;
        width: 14vw;
    }
	#maincontents #sec05 .story03 {
		position: relative;
        margin-top: 58%;
        padding-bottom: 3vw;
        /*
        */
    }
	#maincontents #sec05 .story03 .txt03 {
		position: relative;
        z-index: 11;
        width: 86%;
        padding-top: 65%;
    }


	#maincontents .sec06rb61 {
		position: absolute;
        z-index: 800;
        top: 9650px;
        left: -14.0%;
        width: 8vw;
    }
	#maincontents .sec06rb61 img {
        width: 78%;
    }
	#maincontents .sec06rb62 {
		position: absolute;
        z-index: 800;
        top: 9700px;
        right: -5.4%;
        width: 5.5vw;
    }
	#maincontents .sec06rb62 img {
        width: 78%;
    }

	#maincontents #sec06 {
		display: block;
		position: relative;
        z-index: 499;
        background-size: 100%;
		overflow: hidden;
		max-width: 836px;
        height: 50vw;
        height: 650px;
	}
	#maincontents #sec06 .ai {
		position: relative;
        margin-top: 0%;
        /*
        */
    }
	#maincontents #sec06 .ai img {
        width: 45%;
    }
	#maincontents #sec06 .md {
        padding-top: 1.5%;
        margin-top: 0%;
        /*
        */
    }
	#maincontents #sec06 .md img {
        width: 55%;
    }
	#maincontents #sec06 .lef {
		position: relative;
        z-index: 20;
        top: 1vw;
        right: -200px;
        transform-origin: right bottom;
    }
    [data-aos=lef]{ transform:rotate(60deg) }
    [data-aos=lef].aos-animate{ transform:rotate(-7deg) }

	#maincontents #sec06 .lef img {
        width: 50%;
        height: auto;
    }
	#maincontents #sec06 .framebox {
		position: absolute;
        z-index: 20;
        background: #ffffff;
        top: 270px;
        left: 3%;
        width: 65%;
        height: 26vw;
        height: 300px;
        border: 2px solid #222222;
        border-radius: 15px;
        overflow-y: scroll;
        -ms-overflow-style: none; /*IE(Internet Explorer)・Microsoft Edgeへの対応*/
        scrollbar-width: none; /*Firefoxへの対応*/
    }
     /*Google Chrome、Safariへの対応*/
    #maincontents #sec06 .framebox::-webkit-scrollbar {
		display: none;
    }
	#maincontents #sec06 .framebox p {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        font-weight: 800;
		font-size: 46px;
		letter-spacing: 0.64px;
		line-height: 2.0em;
    }
	#maincontents #sec06 .framebox img {
        width: 100%;
        height: auto;
    }

	#maincontents #sec06 .framebox .exbox{
		position: absolute;
        z-index: 20;
        background: #ffffff;
        width: 100%;
        height: 450px;
        padding: 2.5%;
    }
	#maincontents #sec06 .framebox .ex01{
		position: relative;
        z-index: 20;
        background: url(../images/sec06/ex01bg.webp) no-repeat top center;
        background-size: cover;
        border: 1px solid #ffffff;
        border-radius: 15px;
        width: 99%;
        height: auto;
        padding: 0%;
        margin-bottom: 1.5vw
    }
    #maincontents #sec06 .framebox .ex01 .title {
        padding: 4% 4% 2% 2%;
        width: 95%;
    }
    #maincontents #sec06 .framebox .ex01 .txt {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        padding: 4% 4% 5% 7%;
        text-align: left;
        font-weight: 800;
		font-size: 1em;
		letter-spacing: 1.64px;
		line-height: 1.7em;
    }
	#maincontents #sec06 .framebox .ex02{
		position: relative;
        z-index: 20;
        background: url(../images/sec06/ex02bg.webp) no-repeat top center;
        background-size: cover;
        border: 1px solid #ffffff;
        border-radius: 15px;
        width: 99%;
        height: auto;
        padding: 0%;
        margin-bottom: 1.5vw
    }
    #maincontents #sec06 .framebox .ex02 .title {
        padding: 4% 4% 2% 2%;
        width: 95%;
    }
    #maincontents #sec06 .framebox .ex02 .txt {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        padding: 4% 4% 5% 7%;
        text-align: left;
        font-weight: 800;
		font-size: 1em;
		letter-spacing: 1.64px;
		line-height: 1.7em;
    }
	#maincontents #sec06 .framebox .ex03{
		position: relative;
        z-index: 20;
        background: url(../images/sec06/ex03bg.webp) no-repeat top center;
        background-size: cover;
        border: 1px solid #ffffff;
        border-radius: 15px;
        width: 99%;
        height: auto;
        padding: 0%;
        margin-bottom: 1.5vw
    }
    #maincontents #sec06 .framebox .ex03 .title {
        padding: 4% 4% 2% 2%;
        width: 95%;
    }
    #maincontents #sec06 .framebox .ex03 .txt {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        padding: 4% 4% 5% 7%;
        text-align: left;
        font-weight: 800;
		font-size: 1em;
		letter-spacing: 1.64px;
		line-height: 1.7em;
    }
	#maincontents #sec06 .framebox .ex04{
		position: relative;
        z-index: 20;
        background: url(../images/sec06/ex04bg.webp) no-repeat top center;
        background-size: cover;
        border: 1px solid #ffffff;
        border-radius: 15px;
        width: 99%;
        height: auto;
        padding: 0%;
        margin-bottom: 1.5vw
    }
    #maincontents #sec06 .framebox .ex04 .title {
        padding: 4% 4% 2% 0%;
        width: 95%;
    }
    #maincontents #sec06 .framebox .ex04 .txt {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        padding: 4% 4% 6% 7%;
        text-align: left;
        font-weight: 800;
		font-size: 1em;
		letter-spacing: 1.64px;
		line-height: 1.7em;
    }




	#maincontents #foot {
		display: block;
		position: relative;
        z-index: 499;
        background-color: #ebc84a;
        background-size: 100%;
		overflow: hidden;
		max-width: 836px;
        height: 92vw;
        height: 100%;
        padding-bottom: 0.0vw;
    }
	#maincontents #foot .icon {
		position: relative;
		z-index: 5;
        top: 5.0%;
        margin: 0 auto;
		width: 35%;
        padding-top: 7.1%;
    }
	#maincontents #foot .icon img {
        width: 100%;
    }
    #maincontents #foot .foot__spec {
		position: relative;
		z-index: 4;
        text-align: center;
        padding-top: 3%;
        padding-bottom: 3%;
        margin-top: 7%;
		width: 97%;
        height: 13.6805555556vw;
        height: auto;
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        top: 0.1vw;
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        font-weight: 800;
		font-size: 0.6em;
		letter-spacing: 0.64px;
		line-height: 1.8em;
    }
    #maincontents #foot .foot__spec dl {
	    float: left;
	    padding-right: 2px;
	    text-align: center;
    }

    #maincontents #foot .foot__spec dt {
	    float: left;
	    clear: left;
	    width: 29%;
	    height: 1em;
        height: auto;
        margin-right: 2%;
        padding-top: 1%;
        padding-bottom: 1%;
	    font-weight: bold;
        text-align: right;
    }

    #maincontents #foot .foot__spec dd {
	    margin-left: 0px;
	    width: 65%;
	    height: 1em;
        height: auto;
        margin-right: 2%;
        padding-top: 1%;
        padding-bottom: 1%;
	    font-weight: 600;
        text-align: left;
    }
    #maincontents #foot .foot__spec dd span {
		font-size: 0.55em;
    }
    
    
	#maincontents #foot .foot__btn {
		z-index: 4;
		position: relative;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        top: 1%;
        padding-bottom: 1%;
		width: 77%;
        height: 11.0805555556vw;
        /*
        max-height: 95px;
        */
        margin: 0 auto;
	}
	#maincontents #foot .foot__btn ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 5.0%;
        margin: 0vw auto;
		width: 100%;
        height: 11.5805555556vw;
        /*
        max-height: 95px;
        */
	}
	#maincontents #foot .foot__btn ul li {
        margin-left: 5px;
        margin-right: 5px;
        margin-bottom: 5px;
        width: 44%;
        height: 4.2805555556vw;
        padding: 0px;
    }
	#maincontents #foot .foot__btn ul img {
        width: auto;
        height: auto;
        max-height: 94px;
        /*
        */
	}
	#maincontents #foot .foot__links {
		z-index: 4;
		position: relative;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-color: #5f473a;
        top: 23%;
        bottom: 0;
		width: 100%;
        height: 6.5805555556vw;
        min-height: 110px;
        margin: 1vw auto 0 auto;
		font-family: 'M PLUS 1p', sans-serif;
		color: #ffffff;
        letter-spacing: 1.0px;
		font-size: 0.8em;
        padding-bottom: 5vw;
	}
	#maincontents #foot .foot__links ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 0.0%;
        margin: 0 auto;
		width: 90%;
        height: auto;
	}
	#maincontents #foot .foot__links ul li {
        margin-left: 5px;
        margin-right: 5px;
        margin-bottom: 10px;
        padding: 15px 5px;
        width: 47%;
        height: 100%;
    }
    #maincontents #foot .foot__links .foot__atten {
        padding-top: 40px;
        width: 95vw;
    }
	#maincontents #foot .foot__links .txt {
		position: relative;
        padding-top: 5px;
		width: 95%;
		font-size: 0.6em;
    }

	#maincontents #foot .foot__copy {
		z-index: 4;
		position: relative;
        text-align: center;
        background-color: #000;
        top: 15%;
        bottom: 0;
		width: 100%;
        height: auto;
        margin: 0vw auto 0 auto;
		font-family: 'M PLUS 1p', sans-serif;
		color: #ffffff;
        letter-spacing: 1.0px;
		font-size: 0.6em;
	}
	#maincontents #foot .foot__copy .copy {
		position: relative;
        padding-top: 1.5vw;
        padding-bottom: 1.5vw;
		width: 70%;
    }

}





@media screen and (min-width: 1024px) {
	body .sp_view {
		display: block;
	}
}


@media screen and (min-width: 769px) and (max-width: 1130px){
	#pc_dis.pc_dis_left {
        display: none;
		width: calc(100vw - 660px);
		height: 93lvh;
		min-height: 737px;
		position: fixed;
		right: auto;
		top: 0;
		bottom: 0;
		margin: auto 0;
		transition: left .3s ease-in-out;
		margin: 56px 0 16px 16px;
        background: url(../images/fv/kvpc.webp) no-repeat center;
        background-image: url(../images/fv/kvpc.webp);
        background-image: image-set(url(../images/fv/kvpc.webp) 1x, url(../images/2x/fv/kvpc@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/fv/kvpc.webp) 1x, url(../images/2x/fv/kvpc@2x.webp) 2x);
        background-size: cover;
	}
	#pc_dis02.pc_dis_right {
		width: 300px;
		height: 93lvh;
		right: 0;
		left: auto;
		background-color: #fffcf1;
		margin: 56px 16px 16px 0
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li {
		position: relative;
		margin-bottom: 10px;
		cursor: pointer;
		transition: all .6s cubic-bezier(0.22, 1, 0.36, 1);
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li::before {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		margin: auto;
		top: auto;
		bottom: 0;
		display: block;
		width: 100%;
		height: 1px;
		pointer-events: none;
		background-color: #f3c200;
		z-index: 0;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li_a {
		display: inline-block;
		margin-bottom: 0px;
        padding-top: 7px;
        padding-bottom: 7px;
        padding-left: 30px;
		overflow: visible;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li_a .rmenu span {
		display: block;
		margin-right: 20px;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li_a .rmenu span img {
		width: 20px;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_logo {
		width: 320px;
		margin: 0 auto 40px;
        padding-left: 30px;
	}
    
	#pc_dis02.pc_dis_right .frame01 {
		position: absolute;
        top: 10px;
	}
	#pc_dis02.pc_dis_right .frame01 img {
		width: 95%;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_logo {
		width: 275px;
		margin: 0 auto 30px;
        padding-left: 30px;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul {
		text-align: left;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li_a {
		display: inline-block;
		margin-bottom: 0px;
        padding-top: 1.2vw;
        padding-bottom: 1.2vw;
        padding-left: 20px;
		overflow: visible;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li_a .rmenu p {
		font-family: 'M PLUS 2p', sans-serif;
		color: #846a5c;
        font-weight: 800;
		font-size: 14px;
		letter-spacing: 0.44em;
		line-height: 1.2em;
	}

    
    .fv_homerare  {
        display: none;
		position: fixed;
        z-index: 400;
		width: 300px;
        height: 300px;
        right: 0vw;
        bottom: 0;
	}
	.fv_homerare .frame02 {
		position: absolute;
        z-index: 400;
        width: 185px;
        right: 120px;
        bottom: 120px;
	}
	.fv_homerare .frame03 {
		position: absolute;
        z-index: 400;
		width: 423px;
        right: 0vw;
        bottom: -35px;
	}
	.fv_homerare .btn_homerare {
		position: absolute;
        z-index: 400;
        width: 225px;
        right: 75px;
        bottom: 35px;
	}
	.fv_homerare .txt_homerare {
		position: absolute;
        z-index: 400;
        width: 285px;
        right: 15px;
        bottom: 15px;
	}
    


	#wrapper {
        position: relative;
        z-index: 499;
		background-color: #efe8d0;
		overflow: hidden;
		margin: 0;
		right: 300px;
		width: calc(100vw - 315px);
	}
	#wrapper {
		margin: 16px 0 0 !important;
		left: auto;
		right: 315px;
		z-index: 400;
	}
	
	#maincontents #pcfv {
		display: block;
		position: relative;
        z-index: 499;
        background: url(../images/fv/wrapper.webp) no-repeat center;
        background-size: contain;
		overflow: hidden;
		max-width: 815px;
        height: 130lvh;
		max-height: 925px;
		margin: 0 auto;
        margin-top: 0vw;
	}
	#maincontents #pcfv .pcfv_capt{
        padding-top: 11vw;
        padding-bottom: 20vw;
    }
	#maincontents #pcfv .pcfv_capt img {
        width: 90%;
    }
	#maincontents .fv {
		position: relative;
		overflow: hidden;
        z-index: 599;
        background: #f8f5ee;
		height: 90vw;
		max-height: 1030px;
	}
	#maincontents .fv_con .capt {
		display: none;
		pointer-events: none;
		position: absolute;
		left: 0;
		right: 3.0%;
		top: 2.0%;
		bottom: 0;
		margin: auto;
		left: auto;
		z-index: 3;
		width: 17%;
	}
	#maincontents .fv_con .capt02 {
        display: block;
		pointer-events: none;
		position: absolute;
		left: 0;
		right: 2vw;
		top: 5vw;
		bottom: 0;
		margin: auto;
		left: auto;
		z-index: 3;
		width: 10%;
    }
	#maincontents .fv_con .capt03 {
        display: block;
		pointer-events: none;
		position: absolute;
		left: 4vw;
		/*
		right: 0;
		bottom: 16vw;
        padding-top: 60%;
        */
        top: 27vw;
		margin: auto;
		z-index: 3;
		width: 10%;
    }

	#maincontents .fv_cta02 {
		display: none;
		position: absolute;
        right: 2.0%;
        top: 80vw;
		width: 90%;
        max-width: 480px;
        height: auto;
	}
	#maincontents .fv_cta02 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        left: 0%;
		right: -2.8%;
		bottom: 8.4%;
		width: 89%;
        max-width: 450px;
        height: auto;
	}
	#maincontents .fv_cta02 ul li {
        width: 34.5%;
        height: auto;
        margin-left: 10px;
        margin-right: 25px;
    }
	#maincontents .fv_cta02 ul li:first-child {
        width: 31.5%;
        height: auto;
        margin-left: 0px;
        margin-right: 20px;
    }
	#maincontents .fv_cta02 ul li img {
        height: 100%;
        max-height: 36px;
	}
	#maincontents .fv .fluer_logo {
		position: relative;
        z-index: 200;
        top: 75vw;
        width: 39vw;
	}
	#maincontents .fv .fvrb01 {
		position: absolute;
        z-index: 800;
        top: 54.2vw;
        left: -15.0vw;
        width: 25vw;
    }
	#maincontents .fvrb01 img {
        width: 98%;
    }
	#maincontents .fv .fvrb02 {
		position: absolute;
        z-index: 800;
        top: 53.2vw;
        right: -9.0vw;
        width: 20vw;
    }
	#maincontents .fvrb02 img {
        width: 98%;
    }



	#maincontents #sec01 {
		display: block;
		position: relative;
        z-index: 499;
        top: 1vw;
        background-color: #f8f5ee;
		overflow: hidden;
        width: 100%;
        height: auto;
        padding-bottom: 10px;
	}
	#maincontents #sec01 .pcfv_capt{
        padding-top: 0;
    }
	#maincontents #sec01 .pcfv_capt img {
        width: 95%;
    }
	#maincontents #sec01 .icons {
        padding-top: 5vw;
    }
	#maincontents #sec01 .icons img {
        width: 98%;
    }
	#maincontents #sec01 .boy {
        padding-top: 3vw;
    }
	#maincontents #sec01 .boy img {
        width: 55%;
    }
	#maincontents #sec01 .sec01rb01 {
		position: absolute;
        z-index: 800;
        top: 30.2vw;
        left: -4.0vw;
        width: 10vw;
    }
	#maincontents #sec01 .sec01rb01 img {
        width: 78%;
    }
	#maincontents #sec01 .sec01rb02 {
		position: absolute;
        z-index: 800;
        top: 36.2vw;
        right: -4.0vw;
        width: 9vw;
    }
	#maincontents #sec01 .sec01rb02 img {
        width: 78%;
    }




	#maincontents #sec01 .md {
        padding-top: 18vw;
        padding-bottom: 5%;
        /*
        */
    }
	#maincontents #sec01 .md img {
        width: 90%;
    }
    

	#maincontents #sec07 {
		display: block;
		position: relative;
        z-index: 599;
        top: 0vw;
        background: url(../images/sec07/mdbg.webp) no-repeat top center;
        background-image: url(../images/sec07/mdbg.webp);
        background-image: image-set(url(../images/sec07/mdbg.webp) 1x, url(../images/2x/sec07/mdbg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec07/mdbg.webp) 1x, url(../images/2x/sec07/mdbg@2x.webp) 2x);
        background-size: 100%;
        /*
        padding-top: 80%;
        background: none;
        */
		overflow: hidden;
		max-width: 836px;
        height: 324vw;
        max-height: 3670px;
	}

	#maincontents #sec07 #cam {
		display: block;
		position: relative;
        z-index: 499;
        top: 12.6vw;
        height: 220vw;
        /*
        max-height: 2520px;
        */
    }
	#maincontents #sec07 #cam .md {
		position: relative;
        z-index: 499;
        padding-top: 1vw;
        /*
        */
    }
	#maincontents #sec07 #cam .md img {
        width: 90%;
    }

	#maincontents #sec07 #cam .sec07rb71 {
		position: absolute;
        z-index: 800;
        top: -2.8%;
        left: -6.3vw;
        width: 12.6vw;
    }
	#maincontents #sec07 #cam .sec07rb71 img {
        width: 80%;
    }
	#maincontents #sec07 #cam .sec07rb72 {
		position: absolute;
        z-index: 800;
        top: -3.2%;
        right: -5.5vw;
        width: 12vw;
    }
	#maincontents #sec07 #cam .sec07rb72 img {
        width: 84%;
    }

    
	#maincontents #sec07 #cam .txt {
		position: relative;
        z-index: 499;
		width: 85%;
        height: auto;
        padding-top: 2vw;
        /*
        */
    }
	#maincontents #sec07 #cam .txt img {
        width: 100%;
    }



	#maincontents #sec07 #cam .lef01 {
		position: relative;
		z-index: 5;
        top: -8.0vw;
        left: 2.0%;
        margin: 0 auto;
		width: 35%;
        padding-top: 0.1%;
    }
	#maincontents #sec07 #cam .lef01 img {
        width: 65%;
    }
    #maincontents #sec07 #cam .lef01 {
        transform-origin: center bottom;
        animation: yurayura 2s linear infinite;
    }

    @keyframes yurayura {
        0% , 100%{
            transform: rotate(10deg);
        }
        50%{
            transform: rotate(-10deg);
        }
    }

	#maincontents #sec07 #cam .campaign__ul {
		z-index: 4;
		position: absolute;
        text-align: center;
        top: 87vw;
        background-image: url(../images/sec07/bg.webp);
        background-image: image-set(url(../images/sec07/bg.webp) 1x, url(../images/2x/sec07/bg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec07/bg.webp) 1x, url(../images/2x/sec07/bg@2x.webp) 2x);
        background-repeat: no-repeat;
        background-position: top center;
        background-size: 100% 100%;
		width: 100%;
        height: 133vw;
        max-height: 1500px;
	}
	#maincontents #sec07 #cam .campaign__ul ul {
		z-index: 4;
		position: absolute;
        text-align: center;
        background-size: cover;
        top: -1.5vw;
        margin: 0 auto;
		width: 100%;
        height: auto;
	}
	#maincontents #sec07 #cam .campaign__ul ul li {
        margin-left: 5px;
        margin-right: 5px;
        margin-bottom: 2.1vw;
        margin: 0 auto 0.3vw auto;
        width: 100%;
        height: auto;
        max-height: 522px;
        padding: 5px 0 0.1vw 0;
    }
	#maincontents #sec07 #cam .campaign__ul ul img {
        width: auto;
        height: 100%;
        max-height: 522px;
        /*
        */
	}
	#maincontents #sec07 #cam .campaign__ul ul li.cam01 {
        margin: 5vw auto 0.3vw auto;
        width: 100%;
        height: auto;
    }
	#maincontents #sec07 #cam .lef02 {
        display: none;
		position: absolute;
		z-index: 5;
        top: 35.0vw;
        right: 1.0vw;
        margin: 0 auto;
		width: 25%;
        padding-top: 1.1%;
    }
	#maincontents #sec07 #cam .lef02 img {
        width: 75%;
    }
    #maincontents #sec07 #cam .lef02 {
        transform-origin: center bottom;
        animation: yurayura 2s linear infinite;
    }

    @keyframes yurayura {
        0% , 100%{
            transform: rotate(10deg);
        }
        50%{
            transform: rotate(-10deg);
        }
    }

	#maincontents #sec07 #cam .attention {
		position: relative;
		z-index: 5;
        top: 118vw;
        margin: 2vw auto;
		width: 94%;
        padding-top: 0%;
        text-align: left;
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        font-weight: 800;
		font-size: 0.9em;
		letter-spacing: 0.64px;
		line-height: 2.1em;
    }
	#maincontents #sec07 #cam .attention img {
        width: 100%;
    }
	#maincontents #sec07 .ctamd {
        position: relative;
        top: 18vw;
        width: 90%;
    }
	#maincontents #sec07 .ctamd img {
        width: 100%;
    }


	#maincontents #sec07 .registmd {
		position: relative;
        top: 1.2%;
        /*
        */
    }
	#maincontents #sec07 .registmd img {
        width: 90%;
    }
	#maincontents #sec07 .cta_btn__ul {
		z-index: 4;
		position: relative;
        top: 20vw;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-image: url(../images/cta/btnframe_Pre.webp);
        background-image: image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-repeat: no-repeat;
        background-position: top center;
        background-size: 100% 100%;
        padding-top: 85%;
		width: 100%;
        height: auto;
	}
	#maincontents #sec07 .cta_btn__ul ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 11.8%;
        margin: 0 auto;
		width: 100%;
        height: auto;
	}
	#maincontents #sec07 .cta_btn__ul ul li {
        margin-left: 6px;
        margin-right: 6px;
        margin-bottom: 12px;
        width: 49%;
        padding: 5px;
    } 
    #maincontents #sec07 .cta_btn__ul ul li:first-child {
        width: 41.5%;
    }
    #maincontents #sec07 .cta_btn__ul ul li:nth-of-type(3) {
        width: 55%;
    }
	#maincontents #sec07 .cta_btn__ul ul img {
        width: 100%;
        height: auto;
        max-height: 106px;
        /*
        */
	}

    

	#maincontents #sec07 .cta_btn__ul .btn_homerare {
		position: absolute;
		z-index: 5;
        top: 81.0%;
        margin: 0 auto;
		width: 98%;
        padding-top: 0.1%;
    }
	#maincontents #sec07 .cta_btn__ul .btn_homerare img {
        width: 85%;
        height: auto;
    }
    





	#maincontents .sec02rb01 {
		position: absolute;
        z-index: 800;
        top: 27.7%;
        right: -3.5vw;
        width: 9vw;
    }
	#maincontents .sec02rb01 img {
        width: 98%;
    }
    [data-aos=HorizontalOpen]{ clip-path:inset(0 1000px); }
    [data-aos=HorizontalOpen].aos-animate{ clip-path:inset(0 0); }
    [data-aos=HorizontalOpenT]{ clip-path:inset(1000px 0); }
    [data-aos=HorizontalOpenT].aos-animate{ clip-path:inset(0 0); }




	#maincontents #sec02 {
		display: block;
		position: relative;
        z-index: 499;
		overflow: hidden;
		max-width: 836px;
        
        height: 540vw;
		margin: 0vw auto 0.0vw auto;
	}


	#maincontents #sec02 .md {
		position: relative;
        top: 0vw;
        padding-bottom: 2vw;
    }
	#maincontents #sec02 .md img {
        width: 88%;
    }

    
	#maincontents #sec02 .point01 {
		position: relative;
        height: 100%;
        max-height: 130vw;
		/*
        */
    }

	#maincontents .sec02rb02 {
		position: absolute;
        z-index: 800;
        top: 27.2vw;
        left: -6.5vw;
        width: 14vw;
    }
	#maincontents .sec02rb02 img {
        width: 98%;
    }

	#maincontents #sec02 .point01 .bg {
		position: absolute;
        width: 100%;
        top: 10%;
        left: -7.7%;
    }
	#maincontents #sec02 .point01 .pointbase {
		position: absolute;
        padding-top: 0vw;
        width: 11vw;
        top: 5.8%;
        left: 4.7vw;
        animation: rotateAnimation 6s linear infinite;
    }
    @keyframes rotateAnimation {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }
	#maincontents #sec02 .point01 .pt {
		position: absolute;
        width: 5.8vw;
        top: 8.4%;
        left: 7.4vw;
    }
	#maincontents #sec02 .point01 .txt {
		position: absolute;
        top: 8.5%;
        right: 2vw;
        width: 14.5vw;
    }
	#maincontents #sec02 .point01 .txt img {
        width: 100%;
    }
	#maincontents #sec02 .point01 .support_ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
		bottom: 0;
        top: 0.0%;
        margin: 5px auto;
		width: 99.5%;
        height: auto;
	}
	#maincontents #sec02 .point01 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 90.0vw;
        margin: 0 auto;
		width: 99%;
        height: 100%;
	}
	#maincontents #sec02 .point01 ul li {
        margin-left: 5px;
        margin-right: 5px;
        width: 47%;
        padding: 5px;
    }
	#maincontents #sec02 .point01 ul img {
        height: auto;
	}
	#maincontents #sec02 .point01 .ss01 {
		position: absolute;
		left: 3.5%;
		bottom: 0;
        top: -28.5%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point01 .ss01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec02 .point01 .ss02 {
		position: absolute;
		right: 3.5%;
		bottom: 0;
        top: -28.3%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point01 .ss02.aos-animate {
        filter: blur(0px);
    }
    

	#maincontents #sec02 .point02 {
		position: relative;
        height: 100%;
		max-height: 126vw;
    }
	#maincontents #sec02 .point02 .bg {
		position: absolute;
        width: 97%;
        top: 4%;
        right: -3.8vw;
    }
	#maincontents #sec02 .point02 .pointbase {
		position: absolute;
        padding-top: 0vw;
        width: 11vw;
        top: -0.0%;
        right: 4.7vw;
        animation: rotateAnimation 6s linear infinite;
    }
    @keyframes rotateAnimation {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }
	#maincontents #sec02 .point02 .pt {
		position: absolute;
        width: 5.8vw;
        top: 2.5%;
        right: 7.2vw;
    }
	#maincontents #sec02 .point02 .txt {
		position: absolute;
        top: 5.8vw;
        left: 3vw;
        width: 14.5vw;
    }
	#maincontents #sec02 .point02 .txt img {
        width: 100%;
    }
	
	#maincontents #sec02 .point02 .support_ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
		bottom: 0;
        top: 0.0%;
        margin: 5px auto;
		width: 99.5%;
        height: 100%;
	}
	#maincontents #sec02 .point02 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 78.0vw;
        margin: 0 auto;
		width: 99%;
        height: 100%;
	}
	#maincontents #sec02 .point02 ul li {
        margin-left: 5px;
        margin-right: 5px;
        width: 47%;
        padding: 5px;
    }
	#maincontents #sec02 .point02 ul img {
        height: auto;
	}
	#maincontents #sec02 .point02 .ss01 {
		position: absolute;
		left: 3.5%;
		bottom: 0;
        top: -26.5%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point02 .ss01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec02 .point02 .ss02 {
		position: absolute;
		right: 3.5%;
		bottom: 0;
        top: -26.7%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point02 .ss02.aos-animate {
        filter: blur(0px);
    }



	#maincontents .sec02rb03 {
		position: absolute;
        z-index: 800;
        top: 190.9vw;
        left: -5.8vw;
        width: 12vw;
    }
	#maincontents .sec02rb03 img {
        width: 88%;
    }


	#maincontents #sec02 .point03 {
		position: relative;
        height: 100%;
		max-height: 130vw;
    }

	#maincontents #sec02 .point03 .bg {
		position: absolute;
        width: 98%;
        top: 5%;
        left: -7.2%;
    }
	#maincontents #sec02 .point03 .pointbase {
		position: absolute;
        padding-top: 0vw;
        width: 11vw;
        top: 0.8%;
        left: 4.7vw;
        animation: rotateAnimation 6s linear infinite;
    }
    @keyframes rotateAnimation {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }
	#maincontents #sec02 .point03 .pt {
		position: absolute;
        width: 5.8vw;
        top: 3.4%;
        left: 7.3vw;
    }
	#maincontents #sec02 .point03 .txt {
		position: absolute;
        top: 2.5%;
        right: 3vw;
        width: 12.5vw;
    }
	#maincontents #sec02 .point03 .txt img {
        width: 100%;
    }
	#maincontents #sec02 .point03 .support_ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
		bottom: 0;
        top: 0.0%;
        margin: 5px auto;
		width: 99.5%;
        height: 100%;
	}
	#maincontents #sec02 .point03 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 78.0vw;
        margin: 0 auto;
		width: 99%;
        height: 100%;
	}
	#maincontents #sec02 .point03 ul li {
        margin-left: 5px;
        margin-right: 5px;
        width: 47%;
        padding: 5px;
    }
	#maincontents #sec02 .point03 ul img {
        height: auto;
	}
	#maincontents #sec02 .point03 .ss01 {
		position: absolute;
		left: 3.5%;
		bottom: 0;
        top: -26.5%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point03 .ss01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec02 .point03 .ss02 {
		position: absolute;
		right: 3.5%;
		bottom: 0;
        top: -26.2%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point03 .ss02.aos-animate {
        filter: blur(0px);
    }



	#maincontents .sec02rb04 {
		position: absolute;
        z-index: 800;
        top: 320.9vw;
        right: -4.7vw;
        width: 11vw;
    }
	#maincontents .sec02rb04 img {
        width: 88%;
    }



	#maincontents #sec02 .point04 {
		position: relative;
        height: 100%;
		max-height: 125vw;
    }
	#maincontents #sec02 .point04 .bg {
		position: absolute;
        width: 99%;
        top: 4.4%;
        right: -3.8vw;
    }
	#maincontents #sec02 .point04 .pointbase {
		position: absolute;
        padding-top: 0vw;
        width: 11vw;
        top: 0.2%;
        right: 4.2vw;
        animation: rotateAnimation 6s linear infinite;
    }
    @keyframes rotateAnimation {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }
	#maincontents #sec02 .point04 .pt {
		position: absolute;
        width: 5.8vw;
        top: 2.9%;
        right: 6.5vw;
    }
	#maincontents #sec02 .point04 .txt {
		position: absolute;
        top: 3.8vw;
        left: 3vw;
        width: 11.5vw;
    }
	#maincontents #sec02 .point04 .txt img {
        width: 100%;
    }
	
	#maincontents #sec02 .point04 .support_ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
		bottom: 0;
        top: 0.0%;
        margin: 5px auto;
		width: 99.5%;
        height: 100%;
	}
	#maincontents #sec02 .point04 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 82.0vw;
        margin: 0 auto;
		width: 99%;
        height: 100%;
	}
	#maincontents #sec02 .point04 ul li {
        margin-left: 5px;
        margin-right: 5px;
        width: 47%;
        padding: 5px;
    }
	#maincontents #sec02 .point04 ul img {
        height: auto;
	}
	#maincontents #sec02 .point04 .ss01 {
		position: absolute;
		left: 3.5%;
		bottom: 0;
        top: -28.5%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point04 .ss01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec02 .point04 .ss02 {
		position: absolute;
		right: 3.5%;
		bottom: 0;
        top: -28.7%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point04 .ss02.aos-animate {
        filter: blur(0px);
    }


	#maincontents .sec02rb05 {
		position: absolute;
        z-index: 800;
        top: 453.0vw;
        left: -4.0vw;
        width: 9vw;
    }
	#maincontents .sec02rb05 img {
        width: 100%;
    }



	#maincontents #sec03 {
		display: block;
		position: relative;
        z-index: 499;
        background: url(../images/sec03/bg.webp) no-repeat top center;
        background-image: url(../images/sec03/bg.webp);
        background-image: image-set(url(../images/sec03/bg.webp) 1x, url(../images/2x/sec03/bg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec03/bg.webp) 1x, url(../images/2x/sec03/bg@2x.webp) 2x);
        background-size: 100%;
		overflow: hidden;
		max-width: 836px;
        height: 195vw;
	}
	#maincontents #sec03 .sec03_capt {
		position: relative;
        top: 0%;
    }
	#maincontents #sec03 .sec03_capt img {
        width: 90%;
    }
	#maincontents #sec03 .voice_sample {
		position: relative;
        top: 2vw;
        width: 100%;
        height: 20vw;
        background: url(../images/sec03/btnbg.webp) repeat-x top center;
        background-image: url(../images/sec03/btnbg.webp);
        background-image: image-set(url(../images/sec03/btnbg.webp) 1x, url(../images/2x/sec03/btnbg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec03/btnbg.webp) 1x, url(../images/2x/sec03/btnbg@2x.webp) 2x);
        background-size: cover;
    }
	#maincontents #sec03 .voice_sample .catch {
		position: relative;
        top: 2vw;
        width: 90%;
    }
	#maincontents #sec03 .voice_sample .btn {
		position: relative;
        top: 3vw;
        width: 70%;
    }
	#maincontents #sec03 .voice_sample .starl {
		position: relative;
        top: -4vw;
        left: -30vw;
        width: 10%;
    }
	#maincontents #sec03 .voice_sample .starr {
		position: relative;
        top: -12vw;
        right: -30vw;
        width: 10%;
    }
	#maincontents #sec03 .voice_slider {
		position: relative;
        top: 6vw;
		width: 100%;
        /*
        */
    }
	#maincontents #sec03 .voice_slider img {
        width: 90%;
    }
    
    /* スライド内の画像を中央寄せにする */
    .voice_slider .slick-slide img {
        display: block;
        margin: 0 auto;
    }


    /* --- スライドショーの矢印カスタマイズ --- */

    /* 矢印画像の共通設定 */
    #maincontents #sec03 .voice_slider .slide-arrow {
        position: absolute;
        top: 50%;             /* 垂直方向の中央 */
        transform: translateY(-50%); /* 中央位置の補正 */
        cursor: pointer;      /* カーソルを指の形に */
        z-index: 10;          /* 画像より手前に表示 */
        width: 60px;          /* ★矢印の大きさ（お好みで調整してください） */
        height: auto;
    }
    
    /* 左矢印の位置 */
    #maincontents #sec03 .voice_slider .prev-arrow {
        left: 10px;           /* 左端から少し内側へ */
    }
    
    /* 右矢印の位置 */
    #maincontents #sec03 .voice_slider .next-arrow {
        right: 10px;          /* 右端から少し内側へ */
    }
    #maincontents #sec03 .voice_slider .slick-dots {
        bottom: -35px;
    }
    #maincontents #sec03 .voice_slider .slick-dots li button:before {
        width: 30px;
        height: 30px;
        font-size: 10px;
    }










	#maincontents #sec03 .md {
		position: relative;
        top: 7.5%;
        /*
        */
    }
	#maincontents #sec03 .md img {
        width: 90%;
    }
	#maincontents #sec03 .cta_btn__ul {
		z-index: 4;
		position: relative;
        top: 8%;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-image: url(../images/cta/btnframe_Pre.webp);
        background-image: image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-repeat: no-repeat;
        background-position: top center;
        background-size: 100% 100%;
        padding-top: 85%;
		width: 100%;
        height: auto;
	}
	#maincontents #sec03 .cta_btn__ul ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 11.5%;
        margin: 0 auto;
		width: 100%;
        height: auto;
	}
	#maincontents #sec03 .cta_btn__ul ul li {
        margin-left: 6px;
        margin-right: 6px;
        margin-bottom: 12px;
        width: 49%;
        padding: 5px;
    }
	#maincontents #sec03 .cta_btn__ul ul li:first-child {
        width: 41.5%;
    }
	#maincontents #sec03 .cta_btn__ul ul li:nth-of-type(3) {
        width: 55%;
    }
	#maincontents #sec03 .cta_btn__ul ul img {
        width: 100%;
        height: auto;
        max-height: 126px;
        /*
        */
	}
    

    #maincontents .ntg-rule-box-area {
      position: relative;
      width: 55vw;
      right: 0;
      top: -23.5vw;
      transform: translateX(-0%);
      margin: 0 auto;
  }

  
  #maincontents .ntg-rule-box {
      position: relative;
      clear: both;
      width: 55vw;
      max-width: 800px;
      /*
      background: rgba(0, 0, 0, 0.4);
      padding: 7px 14px 5px 14px;
      */
      box-sizing: border-box;
      display: block;
      margin: 0 auto 10px auto;
      line-height: 1.8 !important;
      color: #fff;
      overflow: hidden;
  }
  
  #maincontents .ntg-rule-info {
      float: left;
      text-align: left;
      font-size: 1.0em;
      line-height: 2.2;
      padding-right: 3vw;
  }
  
  #maincontents .ntg-rule-prof {
      float: left;
      text-align: left;
      font-size: 1.0em;
      line-height: 2.2;
      padding-right: 5px;
  }
  
  #maincontents .ntg-rule-comname {
      clear: both;
      float:inherit;
      text-align: center;
      font-size: 1.0em;
      line-height: 2.2;
  }
  
  #maincontents .ntg-rule-box,
  #maincontents .ntg-rule-box a,
  #maincontents .ntg-rule-box a:hover,
  #maincontents .ntg-rule-box label,
  #maincontents .ntg-rule-box strong {
      color: #5f473a !important;
      text-align: left !important;
      text-decoration: none !important;
      font-size: 1.0em !important;
      font-weight: 600 !important;
      font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif !important;
      line-height: inherit !important;
  }
  
  #maincontents .ntg-rule-box a {
      text-decoration: underline !important;
      cursor: pointer !important;
  }
  
  #maincontents .ntg-rule-box strong {
      font-weight: bold !important;
      font-size: inherit !important;
  }
  
  #maincontents .ntg-rule-box input {
      display: inline !important;
  }
  
  #maincontents .ntg-rule-info label, #maincontents .ntg-rule-prof label {
    display: flex;          /* 横並びにする */
    align-items: center;    /* 上下中央揃えにする */
    gap: 6px;               /* チェックボックスと文字の間隔 */
    cursor: pointer;        /* クリックできることを分かりやすく */
    }
    #maincontents .skipDetail_notification, #maincontents .skipDetail_myapp {
      width: 14px;  /* 幅 */
      height: 14px; /* 高さ */
      cursor: pointer; /* マウスを乗せた時に指マークにする */
      accent-color: #fcba03; /* チェック時の色も変更可能（任意） */
    }



	#maincontents #sec03 .btn_homerare {
		position: absolute;
		z-index: 5;
        top: 80.0%;
        margin: 0 auto;
		width: 98%;
        padding-top: 0.1%;
    }
	#maincontents #sec03 .cta_btn__ul .btn_homerare img {
        width: 85%;
        height: auto;
    }



	#maincontents #sec04 {
		display: block;
		position: relative;
        z-index: 899;
        background-size: 105%;
		overflow: hidden;
		max-width: 836px;
        height: 162vw;
	}
	#maincontents #sec04 .md {
        padding-top: 5.5%;
        padding-bottom: 4%;
        /*
        */
    }
	#maincontents #sec04 .md img {
        width: 90%;
    }
	

    #sec04 .container {
        margin: 5% auto 10% auto;
        flex-direction: column;
        align-items: center;
    }
    #sec04 .box {
        width: 100%;
        height: auto;
        opacity: 1;
        transition: opacity 0.5s ease-in-out;	
    }
    #sec04 .background-image {
        width: 100%;
        height: auto;
        opacity: 1;
        transition: opacity 0.5s ease-in-out;
    }	
    #sec04 .background-image.hidden {
        opacity: 0;
    }
    #sec04 .audio-buttons {
        display: none;
        position: absolute;
        top: 72.2vw;
        left: 5.5vw;
        width: 28vw;
    }
    #sec04 .audio-btn {
        margin: 0% 2px 0% 2px;
        padding: 0 2px;
        border: none;
        cursor: pointer;
        width: 72px;
    }
    #sec04 .voice_capt	{
        top: 20%;
        left: 71%;
        width: 26%;
        height: auto;
        position: absolute;
        display: flex;
        animation: float 3s ease-in-out infinite;
    }
    @keyframes float {
        0%, 100% {
            transform: translateY(0); /* 初期位置 */
        }
        50% {
            transform: translateY(-5px); /* 上に移動 */
        }
    }	
    #sec04 .thumbnails {
        position: relative;
        top: -16vw;
        flex-wrap: wrap;
        justify-content: center;
    }
    #sec04 .thumbnail {
        width: 20%;
        height: auto;
        margin: 5px 7px;
    }
    .thumbnail.active {
        filter: brightness(0.5);
    }  	
	#sec04 .left-arrow, .right-arrow {
        font-size: 1.5em;
        position: absolute;
    z-index:10;
    }
    #sec04 .left-arrow {
        display:none;
        margin: 50% 0% 0% 0%;
        width: 8%;}
    #sec04 .right-arrow {
        display: none;
        margin: -68% 0% 0% 0%;
        right: 0%;
        width:8%;
    }	
    #sec04 .thumbnail.active {
        filter: brightness(1.2);
    }	

    
    /* 親要素（キャラ表示エリア） */
.character_display_area {
    position: relative;
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
}

/* ボイスユニット全体の位置 */
.voice_unit {
    display: none;
    position: absolute;
    /* 位置調整：立ち絵の左側、いい感じの高さに配置 */
    top: 32%; 
    left: 4%; 
    width: 40%; /* 立ち絵に対する幅の比率。スマホで小さすぎないよう調整 */
    z-index: 10;
}

/* ベース画像（黄色や青の画像） */
.voice_base_img {
    width: 100%;
    height: auto;
    display: block;
}

/* 透明ボタンを配置するエリア */
.voice_hit_zones {
    position: absolute;
    /* 画像の下部（カプセル部分）に合わせるための調整 */
    /* "VOICE"の文字が画像に含まれている場合、少し下げる必要があります */
    bottom: 10%; 
    left: 24%; /* 左側のアイコン部分（約1/4）を避ける */
    width: 74%; /* 残りの右側部分 */
    height: 42%; /* 高さ調整："VOICE"の文字を除いたカプセルの高さに合わせる */
    display: flex; /* 横並びにする */
}

/* 個別の透明ボタン */
.v-zone {
    flex: 1; /* 3つのボタンを均等な幅にする */
    background-color: transparent; /* 透明 */
    border: none;
    cursor: pointer;
    /* タップしたかわかるように少しだけハイライト（お好みで削除可） */
    transition: background-color 0.2s;
    border-radius: 5px;
}

/* ホバー時やタップ時に薄く白く光らせる（操作感のため） */
.v-zone:hover, .v-zone:active {
    background-color: rgba(255, 255, 255, 0.3);
}

/* スマホ用の微調整 */
@media screen and (max-width: 768px) {
    .voice_unit {
        width: 35%; /* スマホでは少し大きめに表示 */
        top: 38%;
        left: 2%;
    }
}


/* --- ZOOMボタンの配置 --- */
.zoom_btn_container {
    display: none;
    position: absolute;
    /* デザイン画像の位置に合わせて調整 */
    top: 54%; 
    right: 1.5%; 
    width: 13%; /* ボタンの大きさ */
    z-index: 20;
    cursor: pointer;
    transition: transform 0.2s;
}
.zoom_btn_container:hover {
    transform: scale(1.1); /* ホバー時に少し大きくなる */
}
.zoom_btn_container img {
    width: 100%;
    display: block;
    /* ドロップシャドウをつけると浮いて見えて押しやすくなります（お好みで） */
    filter: drop-shadow(0px 2px 3px rgba(0,0,0,0.2));
}

/* --- スマホ時のZOOMボタン調整 --- */
@media screen and (max-width: 768px) {
    .zoom_btn_container {
        width: 16%; /* スマホでは指で押しやすいように少し大きく */
        top: 52%;
        right: 2%;
    }
}

/* --- ポップアップ（モーダル）全体のスタイル --- */
.popup_overlay {
    display: none; /* 初期状態は非表示 */
    position: fixed;
    z-index: 9999; /* 最前面 */
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.85); /* 背景を暗く */
    opacity: 0;
    transition: opacity 0.3s ease;
    justify-content: center;
    align-items: center;
    padding: 20px; /* 画面端の余白 */
    box-sizing: border-box;
}

/* 表示時のクラス */
.popup_overlay.show {
    display: flex;
    opacity: 1;
}

/* ポップアップの中身 */
.popup_content {
    position: relative;
    top: 20px;
    max-width: 80%;
    max-height: 80%;
    text-align: center;
    background: #fff;
}

/* 拡大画像の設定 */
.popup_content img {
    width: 80%;
    height: 80%;
    /* 画面の高さいっぱいに表示しつつ、横幅も画面に収める */
    max-height: 90vh; 
    max-width: 100%; 
    border-radius: 8px;
    box-shadow: 0 0 20px rgba(255, 255, 255, 0.2);
}

/* 閉じるボタン（×） */
.popup_close {
    position: absolute;
    top: -45px;
    right: -10px;
    color: #fff;
    font-size: 40px;
    font-weight: bold;
    cursor: pointer;
    line-height: 1;
    text-shadow: 0 0 5px rgba(0,0,0,0.5);
}

/* スマホの場合、閉じるボタンを少し内側に */
@media screen and (max-width: 768px) {
    .popup_close {
        top: -45px;
        right: 0;
    }
}








	#maincontents #sec05 .sec05rb51 {
		position: absolute;
        z-index: 800;
        top: -0.1%;
        right: -2.8%;
        width: 8vw;
    }
	#maincontents #sec05 .sec05rb51 img {
        width: 88%;
    }
	#maincontents #sec05 .sec05rb52 {
		position: absolute;
        z-index: 800;
        top: -3.4%;
        left: -7.1%;
        width: 11vw;
    }
	#maincontents #sec05 .sec05rb52 img {
        width: 88%;
    }

	#maincontents #sec05 {
		display: block;
		position: relative;
        z-index: 499;
        background: url(../images/sec05/bg.webp) no-repeat top center;
        background-image: url(../images/sec05/bg.webp);
        background-image: image-set(url(../images/sec05/bg.webp) 1x, url(../images/2x/sec05/bg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec05/bg.webp) 1x, url(../images/2x/sec05/bg@2x.webp) 2x);
        background-size: 105%;
		overflow: hidden;
		max-width: 836px;
        height: 155vw;
	}
	#maincontents #sec05 .md {
        padding-top: 2.5%;
        padding-bottom: 4%;
        margin-top: 10%;
        /*
        */
    }
	#maincontents #sec05 .md img {
        width: 90%;
    }
	#maincontents #sec05 .story01 {
		position: relative;
		position: relative;
        margin-top: 10%;
        /*
        */
    }
	#maincontents #sec05 .story01 .you {
		position: absolute;
        z-index: 10;
        left: 0%;
        width: 37%;
    }
	#maincontents #sec05 .story01 .capt01 {
		position: absolute;
        z-index: 11;
        right: 3%;
        width: 60%;
    }
	#maincontents #sec05 .story01 .txt01 {
		position: absolute;
        z-index: 11;
        right: 3%;
        width: 56%;
        padding-top: 9%;
        filter: blur(5px); /* ぼかしの強さを指定 */
        transition: filter 2s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec05 .story01 .txt01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec05 .story02 {
		position: relative;
        margin-top: 65%;
        /*
        */
    }
	#maincontents #sec05 .story02 .capt02 {
		position: absolute;
        z-index: 11;
        left: 3%;
        width: 55%;
    }
	#maincontents #sec05 .story02 .txt02 {
		position: absolute;
        z-index: 11;
        left: 3%;
        width: 56%;
        padding-top: 19%;
        filter: blur(5px); /* ぼかしの強さを指定 */
        transition: filter 2s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec05 .story02 .txt02.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec05 .story02 .apartment {
		position: absolute;
        z-index: 10;
        right: -3.6vw;
        width: 24vw;
    }
	#maincontents #sec05 .story03 {
		position: relative;
        margin-top: 58%;
        /*
        */
    }
	#maincontents #sec05 .story03 .txt03 {
		position: relative;
        z-index: 11;
        width: 86%;
        padding-top: 55%;
    }


	#maincontents .sec06rb61 {
		position: absolute;
        z-index: 800;
        top: 1525.2vw;
        left: -12.0%;
        width: 14vw;
    }
	#maincontents .sec06rb61 img {
        width: 88%;
    }
	#maincontents .sec06rb62 {
		position: absolute;
        z-index: 800;
        top: 1535.2vw;
        right: -5.4%;
        width: 10vw;
    }
	#maincontents .sec06rb62 img {
        width: 78%;
    }

	#maincontents #sec06 {
		display: block;
		position: relative;
        z-index: 499;
        background-size: 100%;
		overflow: hidden;
		max-width: 836px;
        height: 92vw;
	}
	#maincontents #sec06 .ai {
		position: relative;
        margin-top: 0%;
        /*
        */
    }
	#maincontents #sec06 .ai img {
        width: 45%;
    }
	#maincontents #sec06 .md {
        padding-top: 1.5%;
        margin-top: 0%;
        /*
        */
    }
	#maincontents #sec06 .md img {
        width: 55%;
    }
	#maincontents #sec06 .lef {
		position: relative;
        z-index: 20;
        margin-top: 7%;
        right: -30vw;
        transform-origin: right bottom;
    }
    [data-aos=lef]{ transform:rotate(60deg) }
    [data-aos=lef].aos-animate{ transform:rotate(-7deg) }

	#maincontents #sec06 .lef img {
        width: 45%;
        height: auto;
    }
	#maincontents #sec06 .framebox {
		position: absolute;
        z-index: 20;
        background: #ffffff;
        top: 40vw;
        left: 3%;
        width: 65%;
        height: 48vw;
        border: 2px solid #222222;
        border-radius: 15px;
        overflow-y: scroll;
        -ms-overflow-style: none; /*IE(Internet Explorer)・Microsoft Edgeへの対応*/
        scrollbar-width: none; /*Firefoxへの対応*/
    }
     /*Google Chrome、Safariへの対応*/
    #maincontents #sec06 .framebox::-webkit-scrollbar {
		display: none;
    }
	#maincontents #sec06 .framebox p {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        font-weight: 800;
		font-size: 46px;
		letter-spacing: 0.64px;
		line-height: 2.0em;
    }
	#maincontents #sec06 .framebox img {
        width: 100%;
        height: auto;
    }

	#maincontents #sec06 .framebox .exbox{
		position: absolute;
        z-index: 20;
        background: #ffffff;
        width: 100%;
        height: 450px;
        padding: 2.5%;
    }
	#maincontents #sec06 .framebox .ex01{
		position: relative;
        z-index: 20;
        background: url(../images/sec06/ex01bg.webp) no-repeat top center;
        background-size: cover;
        border: 1px solid #ffffff;
        border-radius: 15px;
        width: 99%;
        height: auto;
        padding: 0%;
        margin-bottom: 1.5vw
    }
    #maincontents #sec06 .framebox .ex01 .title {
        padding: 4% 4% 2% 2%;
        width: 95%;
    }
    #maincontents #sec06 .framebox .ex01 .txt {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        padding: 4% 4% 5% 7%;
        text-align: left;
        font-weight: 800;
		font-size: 1em;
		letter-spacing: 1.64px;
		line-height: 1.7em;
    }
	#maincontents #sec06 .framebox .ex02{
		position: relative;
        z-index: 20;
        background: url(../images/sec06/ex02bg.webp) no-repeat top center;
        background-size: cover;
        border: 1px solid #ffffff;
        border-radius: 15px;
        width: 99%;
        height: auto;
        padding: 0%;
        margin-bottom: 1.5vw
    }
    #maincontents #sec06 .framebox .ex02 .title {
        padding: 4% 4% 2% 2%;
        width: 95%;
    }
    #maincontents #sec06 .framebox .ex02 .txt {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        padding: 4% 4% 5% 7%;
        text-align: left;
        font-weight: 800;
		font-size: 1em;
		letter-spacing: 1.64px;
		line-height: 1.7em;
    }
	#maincontents #sec06 .framebox .ex03{
		position: relative;
        z-index: 20;
        background: url(../images/sec06/ex03bg.webp) no-repeat top center;
        background-size: cover;
        border: 1px solid #ffffff;
        border-radius: 15px;
        width: 99%;
        height: auto;
        padding: 0%;
        margin-bottom: 1.5vw
    }
    #maincontents #sec06 .framebox .ex03 .title {
        padding: 4% 4% 2% 2%;
        width: 95%;
    }
    #maincontents #sec06 .framebox .ex03 .txt {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        padding: 4% 4% 5% 7%;
        text-align: left;
        font-weight: 800;
		font-size: 1em;
		letter-spacing: 1.64px;
		line-height: 1.7em;
    }
	#maincontents #sec06 .framebox .ex04{
		position: relative;
        z-index: 20;
        background: url(../images/sec06/ex04bg.webp) no-repeat top center;
        background-size: cover;
        border: 1px solid #ffffff;
        border-radius: 15px;
        width: 99%;
        height: auto;
        padding: 0%;
        margin-bottom: 1.5vw
    }
    #maincontents #sec06 .framebox .ex04 .title {
        padding: 4% 4% 2% 0%;
        width: 95%;
    }
    #maincontents #sec06 .framebox .ex04 .txt {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        padding: 4% 4% 6% 7%;
        text-align: left;
        font-weight: 800;
		font-size: 1em;
		letter-spacing: 1.64px;
		line-height: 1.7em;
    }





	#maincontents #foot {
		display: block;
		position: relative;
        z-index: 499;
        background-color: #ebc84a;
        background-size: 100%;
		overflow: hidden;
		max-width: 836px;
        height: 92vw;
        height: 100%;
        padding-bottom: 0.0vw;
    }
	#maincontents #foot .icon {
		position: relative;
		z-index: 5;
        top: 5.0%;
        margin: 0 auto;
		width: 35%;
        padding-top: 7.1%;
    }
	#maincontents #foot .icon img {
        width: 100%;
    }
    #maincontents #foot .foot__spec {
		position: relative;
		z-index: 4;
        text-align: center;
        padding-top: 3%;
        padding-bottom: 3%;
        margin-top: 7%;
		width: 97%;
        height: 13.6805555556vw;
        height: auto;
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        top: 0.1vw;
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        font-weight: 800;
		font-size: 0.9em;
		letter-spacing: 0.64px;
		line-height: 1.8em;
    }
    #maincontents #foot .foot__spec dl {
	    float: left;
	    padding-right: 2px;
	    text-align: center;
    }

    #maincontents #foot .foot__spec dt {
	    float: left;
	    clear: left;
	    width: 29%;
	    height: 1em;
        height: auto;
        margin-right: 2%;
        padding-top: 1%;
        padding-bottom: 1%;
	    font-weight: bold;
        text-align: right;
    }

    #maincontents #foot .foot__spec dd {
	    margin-left: 0px;
	    width: 65%;
	    height: 1em;
        height: auto;
        margin-right: 2%;
        padding-top: 1%;
        padding-bottom: 1%;
	    font-weight: 600;
        text-align: left;
    }
    #maincontents #foot .foot__spec dd span {
		font-size: 0.8em;
    }
    
    
	#maincontents #foot .foot__btn {
		z-index: 4;
		position: relative;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        top: 1%;
        padding-bottom: 1%;
		width: 77%;
        height: 20.5805555556vw;
        /*
        max-height: 95px;
        */
        margin: 0 auto;
	}
	#maincontents #foot .foot__btn ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 5.0%;
        margin: 0vw auto;
		width: 100%;
        height: 18.5805555556vw;
        /*
        max-height: 95px;
        */
	}
	#maincontents #foot .foot__btn ul li {
        margin-left: 5px;
        margin-right: 5px;
        margin-bottom: 5px;
        width: 44%;
        height: 8.2805555556vw;
        padding: 0px;
    }
	#maincontents #foot .foot__btn ul img {
        width: auto;
        height: 7.5805555556vw;
        max-height: 95px;
        /*
        */
	}
	#maincontents #foot .foot__links {
		z-index: 4;
		position: relative;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-color: #5f473a;
        top: 23%;
        bottom: 0;
		width: 100%;
        height: 17.0805555556vw;
        min-height: 75px;
        margin: 1vw auto 0 auto;
		font-family: 'M PLUS 1p', sans-serif;
		color: #ffffff;
	}
	#maincontents #foot .foot__links ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 1.0vw;
        margin: 0 auto;
		width: 90%;
        height: auto;
	}
	#maincontents #foot .foot__links ul li {
        margin-left: 5px;
        margin-right: 5px;
        margin-bottom: 10px;
        padding: 15px 5px;
        width: 47%;
        height: 100%;
        letter-spacing: 1.0px;
		font-size: 1.2em;
        padding-bottom: 5vw;
    }
    #maincontents #foot .foot__links .foot__atten {
        padding-top: 70px;
        width: 95vw;
    }
	#maincontents #foot .foot__links .txt {
		position: relative;
        padding-top: 5px;
		width: 95%;
		font-size: 0.9em;
    }

	#maincontents #foot .foot__copy {
		z-index: 4;
		position: relative;
        text-align: center;
        background-color: #000;
        top: 15%;
        bottom: 0;
		width: 100%;
        height: auto;
        margin: 0vw auto 0 auto;
		font-family: 'M PLUS 1p', sans-serif;
		color: #ffffff;
        letter-spacing: 1.0px;
		font-size: 0.6em;
	}
	#maincontents #foot .foot__copy .copy {
		position: relative;
        padding-top: 1.5vw;
        padding-bottom: 1.5vw;
		width: 70%;
    }


}



@media screen and (min-width: 769px){
	#content {
		position: relative;
		background-color: #efe8d0;
		display: flex;
		justify-content: flex-end;
		align-items: flex-start;
	}
	#pc_dis , #pc_dis02 {
		position: fixed;
		top: 0;
        left: 0;
		z-index: 3;
		overflow: hidden;
	}
	#pc_dis img, #pc_dis02 img {
		width: 100%;
	}
	body img, body svg {
		width: 100%;
		height: auto;
		display: inline-block;
	}
	#pc_dis02.pc_dis_right .rightmenu {
		position: relative;
		top: 7vh;
		/*
        transform: translateY(-50%);
        */
		height: 737px
	}
	#pc_dis02.pc_dis_right .rightmenu_con {
        padding: 0px 0 0;
		/*
        */
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul {
		text-align: left;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li_a .rmenu {
		display: flex;
		justify-content: flex-start;
		align-items: center;
		margin-left: 1px;
		margin-bottom: 8px;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li_a::before {
		content: "";
		position: absolute;
		margin: auto;
		top: 0;
		left: 0;
		bottom: auto;
		right: auto;
		display: block;
		opacity: 0;
		background-size: contain;
		transition: all .3s cubic-bezier(0.33, 1, 0.68, 1);
		pointer-events: none;
		z-index: -1;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li_a::after {
		content: "";
		position: absolute;
		top: auto;
		bottom: 19px;
		left: auto;
		right: 0;
		display: block;
		width: 16px;
		height: 16px;
		background-size: contain;
		z-index: 0;
		transition: all .6s cubic-bezier(0.22, 1, 0.36, 1);
		transform: translateY(0);
	}
	#wrapper {
		margin: 16px 0 0 !important;
		left: auto;
		/*right: 315px;*/
		z-index: 400;
	}
	#sp_nav {
		position: fixed;
		top: 0;
		left: 0;
		z-index: 1000;
		width: 100%;
		overflow: hidden;
		pointer-events: none;
	}
	#sp_nav {
		display: none !important;
	}
	#sp_nav .sp_menu {
		position: relative;
		margin: 0 auto;
		top: 0;
		left: 0;
		width: 100%;
		height: 105svh;
		clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
		transition: all .5s cubic-bezier(0.33, 1, 0.68, 1);
		z-index: -9;
		background-color: #222;
		pointer-events: none;
	}
	#sp_nav .sp_menu.on {
		pointer-events: all;
		z-index: 9;
		opacity: 1;
	}
	#sp_nav .sp_menu .sp_menu_content {
		position: relative;
		display: block;
		padding: 5.641025641vw 10.2564102564vw;
	}
	#sp_nav .sp_menu .sp_menu_content ul li {
		position: relative;
		margin-bottom: 17px;
	}
	#sp_nav .sp_menu .sp_menu_content ul li:last-child {
		margin-bottom: 0px;
	}
	#sp_nav .sp_menu .sp_menu_content ul li:last-child a::before {
		display: none;
	}
	#sp_nav .sp_menu .sp_menu_content ul li:hover a::after {
		transform: translateX(5px);
	}
	#sp_nav .sp_menu .sp_menu_content ul li a {
		display: inline-block;
		margin-bottom: 17px;
	}
	#sp_nav .sp_menu .sp_menu_content ul li a::before {
		content: "";
		display: block;
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		margin: auto;
		top: auto;
		bottom: 0;
		width: 100%;
		height: 2px;
		z-index: 0;
		pointer-events: none;
		background-color: #fff;
	}
	#sp_nav .sp_menu .sp_menu_content ul li a::after {
		content: "";
		display: block;
		position: absolute;
		top: auto;
		left: auto;
		right: 0;
		bottom: 19px;
		width: 16px;
		height: 16px;
		background-size: contain;
		z-index: 0;
		transition: all .6s cubic-bezier(0.22, 1, 0.36, 1);
		transform: translateX(0);
	}
	#sp_nav .sp_menu .sp_menu_content ul li a .ttl {
		display: flex;
		justify-content: flex-start;
		align-items: center;
		margin-left: 1px;
		margin-bottom: 8px;
	}
	#sp_nav .sp_menu .sp_menu_content ul li a .ttl span {
		display: block;
		margin-right: 9px;
	}
	#sp_nav .sp_menu .sp_menu_content ul li a .ttl span img {
		width: 44px;
	}
	#sp_nav .sp_menu .sp_menu_content ul li a .ttl p {
		font-family: "Montserrat", "Noto Sans JP", "Shippori Mincho", "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "Hiragino Mincho ProN", "游明朝", "Yu Mincho", "Noto Serif SC", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
		color: #fff;
		font-weight: 700;
		font-size: 16px;
		letter-spacing: 0.04em;
		line-height: 1em;
	}
	#sp_nav .sp_menu .sp_menu_content ul li a .txt {
		color: #fff;
		font-weight: 700;
		font-size: 18px;
		letter-spacing: 0.08em;
		line-height: 1em;
	}

    
    .fixhome {
        display: none !important;
    }



	#main {
        margin-top: 0;
		padding-top: 0;
	}
	#maincontents {
		position: relative;
		font-family: "Noto Sans JP", "Shippori Mincho", "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "Hiragino Mincho ProN", "游明朝", "Yu Mincho", "Noto Serif SC", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
        background: #f8f5ee;
	}
	body section {
		position: relative;
		overflow: hidden;
	}
	#maincontents .fv_con {
		position: absolute;
		width: 100%;
		/*
        height: 100svh;
		max-height: 664px;
		bottom: 0;
        */
	}
	#maincontents .fv_con .img {
		position: relative;
		display: block;
		width: 100%;
		bottom: 0;
		max-height: 644px;
		z-index: -1;
	}

}



@media screen and (min-width: 769px) and (max-width: 897px){
	#wrapper {
		position: relative;
        z-index: 499;
		background-color: #efe8d0;
		overflow: hidden;
		width: calc(100vw - 315px);
		max-width: 66.4vw;
		margin: 0;
		right: 315px;
	}
	#maincontents .fv {
		position: relative;
		overflow: hidden;
		height: 80vw;
		max-height: 950px;
	}
	#maincontents .fv_con .capt {
		display: none;
		pointer-events: none;
		position: absolute;
		left: 0;
		right: 3.0%;
		top: 2.0%;
		bottom: 0;
		margin: auto;
		left: auto;
		z-index: 3;
		width: 17%;
	}
	#maincontents .fv_con .capt02 {
        display: block;
		pointer-events: none;
		position: absolute;
		left: 0;
		right: 2vw;
		top: 7.5vw;
		bottom: 0;
		margin: auto;
		left: auto;
		z-index: 3;
		width: 10%;
    }
	#maincontents .fv_con .capt03 {
        display: block;
		pointer-events: none;
		position: absolute;
		left: 4vw;
		/*
		right: 0;
		bottom: 16vw;
        padding-top: 60%;
        */
        top: 27vw;
		margin: auto;
		z-index: 3;
		width: 10%;
    }
	#maincontents .fv_con {
		top: 0;
	}
	#maincontents .fv_con .img {
		position: relative;
		display: block;
		width: 100%;
        top: 2.5vw;
		bottom: 0;
		z-index: -1
	}


	#maincontents .fv_cta02 {
		display: block;
		position: absolute;
        left: 0vw;
        right: -7.0%;
        bottom: 5.5%;
		width: 420px;
        height: auto;
        max-height: 280px;
		overflow: hidden;
	}
	#maincontents .fv_cta02 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        left: 0%;
		right: 0.6%;
		bottom: 8.4%;
		width: 400px;
        height: auto;
	}
	#pc_dis.pc_dis_left .fv_cta02 ul li {
        width: 32.5%;
        height: auto;
        margin-left: 10px;
        margin-right: 25px;
    }
	#pc_dis.pc_dis_left .fv_cta02 ul li:first-child {
        width: 31.5%;
        height: auto;
        margin-left: 0px;
        margin-right: 10px;
    }
	#pc_dis.pc_dis_left .fv_cta02 ul li img {
        height: 100%;
        max-height: 36px;
	}


	#maincontents .fv {
		position: relative;
		overflow: hidden;
        z-index: 599;
        background: #f8f5ee;
	}
	#maincontents .fv_cta02 {
		display: none;
		position: absolute;
        right: 2.0%;
        top: 80vw;
		width: 90%;
        max-width: 480px;
        height: auto;
	}
	#maincontents .fv_cta02 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        left: 0%;
		right: -2.8%;
		bottom: 8.4%;
		width: 89%;
        max-width: 450px;
        height: auto;
	}
	#maincontents .fv_cta02 ul li {
        width: 34.5%;
        height: auto;
        margin-left: 10px;
        margin-right: 25px;
    }
	#maincontents .fv_cta02 ul li:first-child {
        width: 31.5%;
        height: auto;
        margin-left: 0px;
        margin-right: 20px;
    }
	#maincontents .fv_cta02 ul li img {
        height: 100%;
        max-height: 36px;
	}
	#maincontents .fv .fluer_logo {
		position: relative;
        z-index: 200;
        top: 65vw;
        width: 39vw;
	}
	#maincontents .fv .fvrb01 {
		position: absolute;
        z-index: 800;
        top: 44.2vw;
        left: -15.0vw;
        width: 25vw;
    }
	#maincontents .fvrb01 img {
        width: 98%;
    }
	#maincontents .fv .fvrb02 {
		position: absolute;
        z-index: 800;
        top: 43.2vw;
        right: -9.0vw;
        width: 20vw;
    }
	#maincontents .fvrb02 img {
        width: 98%;
    }



	#maincontents #sec01 {
		display: block;
		position: relative;
        z-index: 499;
        top: 0vw;
        background-color: #f8f5ee;
		overflow: hidden;
        width: 100%;
        height: auto;
        padding-bottom: 50px;
	}
	#maincontents #sec01 .pcfv_capt{
        padding-top: 0;
    }
	#maincontents #sec01 .pcfv_capt img {
        width: 95%;
    }
	#maincontents #sec01 .icons {
        padding-top: 5vw;
    }
	#maincontents #sec01 .icons img {
        width: 98%;
    }
	#maincontents #sec01 .boy {
        padding-top: 3vw;
    }
	#maincontents #sec01 .boy img {
        width: 55%;
    }
	#maincontents #sec01 .sec01rb01 {
		position: absolute;
        z-index: 800;
        top: 24.2vw;
        left: -4.0vw;
        width: 10vw;
    }
	#maincontents #sec01 .sec01rb01 img {
        width: 98%;
    }
	#maincontents #sec01 .sec01rb02 {
		position: absolute;
        z-index: 800;
        top: 31.2vw;
        right: -4.0vw;
        width: 9vw;
    }
	#maincontents #sec01 .sec01rb02 img {
        width: 98%;
    }


	#maincontents #sec01 .md {
        padding-top: 18vw;
        padding-bottom: 5%;
        /*
        */
    }
	#maincontents #sec01 .md img {
        width: 90%;
    }
    

    

	#maincontents #sec07 {
		display: block;
		position: relative;
        z-index: 599;
        top: -5vw;
        background: url(../images/sec07/mdbg.webp) no-repeat top center;
        background-image: url(../images/sec07/mdbg.webp);
        background-image: image-set(url(../images/sec07/mdbg.webp) 1x, url(../images/2x/sec07/mdbg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec07/mdbg.webp) 1x, url(../images/2x/sec07/mdbg@2x.webp) 2x);
        background-size: 100%;
        /*
        padding-top: 80%;
        background: none;
        */
		overflow: hidden;
		max-width: 836px;
        height: 304vw;
        max-height: 3670px;
	}

	#maincontents #sec07 #cam {
		display: block;
		position: relative;
        z-index: 499;
        top: 12.6vw;
        height: 207vw;
        /*
        max-height: 2520px;
        */
    }
	#maincontents #sec07 #cam .md {
		position: relative;
        z-index: 499;
        padding-top: 1vw;
        /*
        */
    }
	#maincontents #sec07 #cam .md img {
        width: 90%;
    }

	#maincontents #sec07 #cam .sec07rb71 {
		position: absolute;
        z-index: 800;
        top: -2.8%;
        left: -6.3vw;
        width: 12.6vw;
    }
	#maincontents #sec07 #cam .sec07rb71 img {
        width: 85%;
    }
	#maincontents #sec07 #cam .sec07rb72 {
		position: absolute;
        z-index: 800;
        top: 2.2%;
        right: -5.5vw;
        width: 12vw;
    }
	#maincontents #sec07 #cam .sec07rb72 img {
        width: 90%;
    }

    
	#maincontents #sec07 #cam .txt {
		position: relative;
        z-index: 499;
		width: 95%;
        height: auto;
        padding-top: 2vw;
        /*
        */
    }
	#maincontents #sec07 #cam .txt img {
        width: 100%;
    }



	#maincontents #sec07 #cam .lef01 {
		position: relative;
		z-index: 5;
        top: -8.0vw;
        left: 2.0%;
        margin: 0 auto;
		width: 35%;
        padding-top: 0.1%;
    }
	#maincontents #sec07 #cam .lef01 img {
        width: 65%;
    }
    #maincontents #sec07 #cam .lef01 {
        transform-origin: center bottom;
        animation: yurayura 2s linear infinite;
    }

    @keyframes yurayura {
        0% , 100%{
            transform: rotate(10deg);
        }
        50%{
            transform: rotate(-10deg);
        }
    }

	#maincontents #sec07 #cam .campaign__ul {
		z-index: 4;
		position: absolute;
        text-align: center;
        top: 77vw;
        background-image: url(../images/sec07/bg.webp);
        background-image: image-set(url(../images/sec07/bg.webp) 1x, url(../images/2x/sec07/bg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec07/bg.webp) 1x, url(../images/2x/sec07/bg@2x.webp) 2x);
        background-repeat: no-repeat;
        background-position: top center;
        background-size: 100% 100%;
		width: 100%;
        height: 123vw;
        max-height: 1500px;
	}
	#maincontents #sec07 #cam .campaign__ul ul {
		z-index: 4;
		position: absolute;
        text-align: center;
        background-size: cover;
        top: -1.5vw;
        margin: 0 auto;
		width: 100%;
        height: auto;
	}
	#maincontents #sec07 #cam .campaign__ul ul li {
        margin-left: 5px;
        margin-right: 5px;
        margin-bottom: 2.1vw;
        margin: 0 auto 0.3vw auto;
        width: 100%;
        height: auto;
        max-height: 522px;
        padding: 5px 0 0.1vw 0;
    }
	#maincontents #sec07 #cam .campaign__ul ul img {
        width: auto;
        height: 100%;
        max-height: 522px;
        /*
        */
	}
	#maincontents #sec07 #cam .campaign__ul ul li.cam01 {
        margin: 5vw auto 0.3vw auto;
        width: 100%;
        height: auto;
    }
	#maincontents #sec07 #cam .lef02 {
        display: none;
		position: absolute;
		z-index: 5;
        top: 35.0vw;
        right: 1.0vw;
        margin: 0 auto;
		width: 25%;
        padding-top: 1.1%;
    }
	#maincontents #sec07 #cam .lef02 img {
        width: 75%;
    }
    #maincontents #sec07 #cam .lef02 {
        transform-origin: center bottom;
        animation: yurayura 2s linear infinite;
    }

    @keyframes yurayura {
        0% , 100%{
            transform: rotate(10deg);
        }
        50%{
            transform: rotate(-10deg);
        }
    }

	#maincontents #sec07 #cam .attention {
		position: relative;
		z-index: 5;
        top: 101vw;
        margin: 2vw auto;
		width: 94%;
        padding-top: 0%;
        text-align: left;
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        font-weight: 800;
		font-size: 0.8em;
		letter-spacing: 0.64px;
		line-height: 2.1em;
    }
	#maincontents #sec07 #cam .attention img {
        width: 100%;
    }
	#maincontents #sec07 .ctamd {
        position: relative;
        top: 18vw;
        width: 90%;
    }
	#maincontents #sec07 .ctamd img {
        width: 100%;
    }


	#maincontents #sec07 .registmd {
		position: relative;
        top: 1.2%;
        /*
        */
    }
	#maincontents #sec07 .registmd img {
        width: 90%;
    }
	#maincontents #sec07 .cta_btn__ul {
		z-index: 4;
		position: relative;
        top: 20vw;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-image: url(../images/cta/btnframe_Pre.webp);
        background-image: image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-repeat: no-repeat;
        background-position: top center;
        background-size: 100% 90%;
        padding-top: 90%;
		width: 100%;
        height: auto;
	}
	#maincontents #sec07 .cta_btn__ul ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 9.8%;
        margin: 0 auto;
		width: 100%;
        height: auto;
	}
	#maincontents #sec07 .cta_btn__ul ul li {
        margin-left: 6px;
        margin-right: 6px;
        margin-bottom: 12px;
        width: 49%;
        padding: 5px;
    } 
    #maincontents #sec07 .cta_btn__ul ul li:first-child {
        width: 41.5%;
    }
    #maincontents #sec07 .cta_btn__ul ul li:nth-of-type(3) {
        width: 55%;
    }
	#maincontents #sec07 .cta_btn__ul ul img {
        width: 100%;
        height: auto;
        max-height: 106px;
        /*
        */
	}

    

	#maincontents #sec07 .cta_btn__ul .btn_homerare {
		position: absolute;
		z-index: 5;
        top: 74.0%;
        margin: 0 auto;
		width: 98%;
        padding-top: 0.1%;
    }
	#maincontents #sec07 .cta_btn__ul .btn_homerare img {
        width: 85%;
        height: auto;
    }
    









	#maincontents .sec02rb01 {
		position: absolute;
        z-index: 800;
        top: 27.7%;
        right: -3.5vw;
        width: 10vw;
    }
	#maincontents .sec02rb01 img {
        width: 78%;
    }
    [data-aos=HorizontalOpen]{ clip-path:inset(0 1000px); }
    [data-aos=HorizontalOpen].aos-animate{ clip-path:inset(0 0); }
    [data-aos=HorizontalOpenT]{ clip-path:inset(1000px 0); }
    [data-aos=HorizontalOpenT].aos-animate{ clip-path:inset(0 0); }




	#maincontents #sec02 {
		display: block;
		position: relative;
        z-index: 499;
		overflow: hidden;
		max-width: 836px;
        
        height: 510vw;
		margin: 0vw auto 0.0vw auto;
	}


	#maincontents #sec02 .md {
		position: relative;
        top: 0vw;
        padding-bottom: 2vw;
    }
	#maincontents #sec02 .md img {
        width: 88%;
    }

    
	#maincontents #sec02 .point01 {
		position: relative;
        height: 100%;
        max-height: 123vw;
		/*
        */
    }

	#maincontents .sec02rb02 {
		position: absolute;
        z-index: 800;
        top: 26.2vw;
        left: -6.5vw;
        width: 14vw;
    }
	#maincontents .sec02rb02 img {
        width: 98%;
    }

	#maincontents #sec02 .point01 .bg {
		position: absolute;
        width: 100%;
        top: 10%;
        left: -7.7%;
    }
	#maincontents #sec02 .point01 .pointbase {
		position: absolute;
        padding-top: 0vw;
        width: 11vw;
        top: 5.8%;
        left: 4.7vw;
        animation: rotateAnimation 6s linear infinite;
    }
    @keyframes rotateAnimation {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }
	#maincontents #sec02 .point01 .pt {
		position: absolute;
        width: 5.8vw;
        top: 8.4%;
        left: 7.4vw;
    }
	#maincontents #sec02 .point01 .txt {
		position: absolute;
        top: 8.5%;
        right: 2vw;
        width: 14.5vw;
    }
	#maincontents #sec02 .point01 .txt img {
        width: 100%;
    }
	#maincontents #sec02 .point01 .support_ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
		bottom: 0;
        top: 0.0%;
        margin: 5px auto;
		width: 99.5%;
        height: auto;
	}
	#maincontents #sec02 .point01 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 90.0vw;
        margin: 0 auto;
		width: 99%;
        height: 100%;
	}
	#maincontents #sec02 .point01 ul li {
        margin-left: 5px;
        margin-right: 5px;
        width: 47%;
        padding: 5px;
    }
	#maincontents #sec02 .point01 ul img {
        height: auto;
	}
	#maincontents #sec02 .point01 .ss01 {
		position: absolute;
		left: 3.5%;
		bottom: 0;
        top: -28.5%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point01 .ss01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec02 .point01 .ss02 {
		position: absolute;
		right: 3.5%;
		bottom: 0;
        top: -28.3%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point01 .ss02.aos-animate {
        filter: blur(0px);
    }
    

	#maincontents #sec02 .point02 {
		position: relative;
        height: 100%;
		max-height: 118vw;
    }
	#maincontents #sec02 .point02 .bg {
		position: absolute;
        width: 97%;
        top: 4%;
        right: -3.2vw;
    }
	#maincontents #sec02 .point02 .pointbase {
		position: absolute;
        padding-top: 0vw;
        width: 11vw;
        top: -0.0%;
        right: 4.7vw;
        animation: rotateAnimation 6s linear infinite;
    }
    @keyframes rotateAnimation {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }
	#maincontents #sec02 .point02 .pt {
		position: absolute;
        width: 5.8vw;
        top: 2.5%;
        right: 7.2vw;
    }
	#maincontents #sec02 .point02 .txt {
		position: absolute;
        top: 5.8vw;
        left: 3vw;
        width: 14.5vw;
    }
	#maincontents #sec02 .point02 .txt img {
        width: 100%;
    }
	
	#maincontents #sec02 .point02 .support_ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
		bottom: 0;
        top: 0.0%;
        margin: 5px auto;
		width: 99.5%;
        height: 100%;
	}
	#maincontents #sec02 .point02 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 78.0vw;
        margin: 0 auto;
		width: 99%;
        height: 100%;
	}
	#maincontents #sec02 .point02 ul li {
        margin-left: 5px;
        margin-right: 5px;
        width: 47%;
        padding: 5px;
    }
	#maincontents #sec02 .point02 ul img {
        height: auto;
	}
	#maincontents #sec02 .point02 .ss01 {
		position: absolute;
		left: 3.5%;
		bottom: 0;
        top: -26.5%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point02 .ss01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec02 .point02 .ss02 {
		position: absolute;
		right: 3.5%;
		bottom: 0;
        top: -26.7%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point02 .ss02.aos-animate {
        filter: blur(0px);
    }



	#maincontents .sec02rb03 {
		position: absolute;
        z-index: 800;
        top: 190.9vw;
        left: -5.8vw;
        width: 12vw;
    }
	#maincontents .sec02rb03 img {
        width: 88%;
    }


	#maincontents #sec02 .point03 {
		position: relative;
        height: 100%;
		max-height: 120vw;
    }

	#maincontents #sec02 .point03 .bg {
		position: absolute;
        width: 98%;
        top: 5%;
        left: -7.2%;
    }
	#maincontents #sec02 .point03 .pointbase {
		position: absolute;
        padding-top: 0vw;
        width: 11vw;
        top: 0.8%;
        left: 4.7vw;
        animation: rotateAnimation 6s linear infinite;
    }
    @keyframes rotateAnimation {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }
	#maincontents #sec02 .point03 .pt {
		position: absolute;
        width: 5.8vw;
        top: 3.4%;
        left: 7.3vw;
    }
	#maincontents #sec02 .point03 .txt {
		position: absolute;
        top: 2.5%;
        right: 3vw;
        width: 12.5vw;
    }
	#maincontents #sec02 .point03 .txt img {
        width: 100%;
    }
	#maincontents #sec02 .point03 .support_ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
		bottom: 0;
        top: 0.0%;
        margin: 5px auto;
		width: 99.5%;
        height: 100%;
	}
	#maincontents #sec02 .point03 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 78.0vw;
        margin: 0 auto;
		width: 99%;
        height: 100%;
	}
	#maincontents #sec02 .point03 ul li {
        margin-left: 5px;
        margin-right: 5px;
        width: 47%;
        padding: 5px;
    }
	#maincontents #sec02 .point03 ul img {
        height: auto;
	}
	#maincontents #sec02 .point03 .ss01 {
		position: absolute;
		left: 3.5%;
		bottom: 0;
        top: -26.5%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point03 .ss01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec02 .point03 .ss02 {
		position: absolute;
		right: 3.5%;
		bottom: 0;
        top: -26.2%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point03 .ss02.aos-animate {
        filter: blur(0px);
    }



	#maincontents .sec02rb04 {
		position: absolute;
        z-index: 800;
        top: 310.9vw;
        right: -4.7vw;
        width: 11vw;
    }
	#maincontents .sec02rb04 img {
        width: 88%;
    }



	#maincontents #sec02 .point04 {
		position: relative;
        height: 100%;
		max-height: 115vw;
    }
	#maincontents #sec02 .point04 .bg {
		position: absolute;
        width: 99%;
        top: 4.4%;
        right: -3.6vw;
    }
	#maincontents #sec02 .point04 .pointbase {
		position: absolute;
        padding-top: 0vw;
        width: 11vw;
        top: 0.2%;
        right: 4.2vw;
        animation: rotateAnimation 6s linear infinite;
    }
    @keyframes rotateAnimation {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }
	#maincontents #sec02 .point04 .pt {
		position: absolute;
        width: 5.8vw;
        top: 2.9%;
        right: 6.5vw;
    }
	#maincontents #sec02 .point04 .txt {
		position: absolute;
        top: 3.8vw;
        left: 3vw;
        width: 11.5vw;
    }
	#maincontents #sec02 .point04 .txt img {
        width: 100%;
    }
	
	#maincontents #sec02 .point04 .support_ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
		bottom: 0;
        top: 0.0%;
        margin: 5px auto;
		width: 99.5%;
        height: 100%;
	}
	#maincontents #sec02 .point04 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 82.0vw;
        margin: 0 auto;
		width: 99%;
        height: 100%;
	}
	#maincontents #sec02 .point04 ul li {
        margin-left: 5px;
        margin-right: 5px;
        width: 47%;
        padding: 5px;
    }
	#maincontents #sec02 .point04 ul img {
        height: auto;
	}
	#maincontents #sec02 .point04 .ss01 {
		position: absolute;
		left: 3.5%;
		bottom: 0;
        top: -28.5%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point04 .ss01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec02 .point04 .ss02 {
		position: absolute;
		right: 3.5%;
		bottom: 0;
        top: -28.7%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point04 .ss02.aos-animate {
        filter: blur(0px);
    }


	#maincontents .sec02rb05 {
		position: absolute;
        z-index: 800;
        top: 433.0vw;
        left: -4.0vw;
        width: 9vw;
    }
	#maincontents .sec02rb05 img {
        width: 100%;
    }



	#maincontents #sec03 {
		display: block;
		position: relative;
        z-index: 499;
        background: url(../images/sec03/bg.webp) no-repeat top center;
        background-image: url(../images/sec03/bg.webp);
        background-image: image-set(url(../images/sec03/bg.webp) 1x, url(../images/2x/sec03/bg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec03/bg.webp) 1x, url(../images/2x/sec03/bg@2x.webp) 2x);
        background-size: 100%;
		overflow: hidden;
		max-width: 836px;
        height: 175vw;
	}
	#maincontents #sec03 .sec03_capt {
		position: relative;
        top: 0%;
    }
	#maincontents #sec03 .sec03_capt img {
        width: 90%;
    }
	#maincontents #sec03 .voice_sample {
		position: relative;
        top: 2vw;
        width: 100%;
        height: 19vw;
        background: url(../images/sec03/btnbg.webp) repeat-y top center;
        background-image: url(../images/sec03/btnbg.webp);
        background-image: image-set(url(../images/sec03/btnbg.webp) 1x, url(../images/2x/sec03/btnbg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec03/btnbg.webp) 1x, url(../images/2x/sec03/btnbg@2x.webp) 2x);
    }
	#maincontents #sec03 .voice_sample .catch {
		position: relative;
        top: 3vw;
        width: 90%;
    }
	#maincontents #sec03 .voice_sample .btn {
		position: relative;
        top: 4vw;
        width: 70%;
    }
	#maincontents #sec03 .voice_sample .starl {
		position: relative;
        top: -2vw;
        left: -26vw;
        width: 10%;
    }
	#maincontents #sec03 .voice_sample .starr {
		position: relative;
        top: -9vw;
        right: -26vw;
        width: 10%;
    }
	#maincontents #sec03 .voice_slider {
		position: relative;
        top: 6vw;
		width: 100%;
        /*
        */
    }
	#maincontents #sec03 .voice_slider img {
        width: 90%;
    }
	#maincontents #sec03 .md {
		position: relative;
        top: 7.5%;
        /*
        */
    }
	#maincontents #sec03 .md img {
        width: 90%;
    }
	#maincontents #sec03 .cta_btn__ul {
		z-index: 4;
		position: relative;
        top: 8%;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background: url(../images/cta/btnframe_Pre.webp) no-repeat top center;
        background-image: url(../images/cta/btnframe_Pre.webp);
        background-image: image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-size: 100%;
        padding-top: 90%;
		width: 100%;
        height: auto;
	}
	#maincontents #sec03 .cta_btn__ul ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 9.8%;
        margin: 0 auto;
		width: 100%;
        height: auto;
	}
	#maincontents #sec03 .cta_btn__ul ul li {
        margin-left: 6px;
        margin-right: 6px;
        margin-bottom: 12px;
        width: 48%;
        padding: 5px;
    } 
    #maincontents #sec03 .cta_btn__ul ul li:first-child {
        width: 40%;
    }
	#maincontents #sec03 .cta_btn__ul ul img {
        width: 100%;
        height: auto;
        max-height: 106px;
        /*
        */
	}
    
    #maincontents #sec03 .ntg-rule-box-area {
      position: relative;
      width: 50vw;
      right: 0;
      top: -24vw;
      transform: translateX(-0%);
      margin: 0 auto;
  }

  
  #maincontents .ntg-rule-box {
      position: relative;
      clear: both;
      width: 50vw;
      max-width: 800px;
      /*
      background: rgba(0, 0, 0, 0.4);
      padding: 7px 14px 5px 14px;
      */
      box-sizing: border-box;
      display: block;
      margin: 0 auto 10px auto;
      line-height: 1.8 !important;
      color: #fff;
      overflow: hidden;
  }
  
  #maincontents .ntg-rule-info {
      float: left;
      text-align: left;
      font-size: 14px;
      line-height: 2.2;
      padding-right: 3vw;
  }
  
  #maincontents .ntg-rule-prof {
      float: left;
      text-align: left;
      font-size: 14px;
      line-height: 2.2;
      padding-right: 5px;
  }
  
  #maincontents .ntg-rule-comname {
      clear: both;
      float:inherit;
      text-align: center;
      font-size: 14px;
      line-height: 2.2;
  }
  
  #maincontents .ntg-rule-box,
  #maincontents .ntg-rule-box a,
  #maincontents .ntg-rule-box a:hover,
  #maincontents .ntg-rule-box label,
  #maincontents .ntg-rule-box strong {
      color: #5f473a !important;
      text-align: left !important;
      text-decoration: none !important;
      font-size: 14px !important;
      font-weight: 600 !important;
      font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif !important;
      line-height: inherit !important;
  }
  
  #maincontents .ntg-rule-box a {
      text-decoration: underline !important;
      cursor: pointer !important;
  }
  
  #maincontents .ntg-rule-box strong {
      font-weight: bold !important;
      font-size: inherit !important;
  }
  
  #maincontents .ntg-rule-box input {
      display: inline !important;
  }
  
  #maincontents .ntg-rule-info label, #maincontents .ntg-rule-prof label {
    display: flex;          /* 横並びにする */
    align-items: center;    /* 上下中央揃えにする */
    gap: 6px;               /* チェックボックスと文字の間隔 */
    cursor: pointer;        /* クリックできることを分かりやすく */
    }
    #maincontents .skipDetail_notification, #maincontents .skipDetail_myapp {
      width: 14px;  /* 幅 */
      height: 14px; /* 高さ */
      cursor: pointer; /* マウスを乗せた時に指マークにする */
      accent-color: #fcba03; /* チェック時の色も変更可能（任意） */
    }



	#maincontents #sec03 .cta_btn__ul .btn_homerare {
		position: absolute;
		z-index: 5;
        top: 75.0%;
        margin: 0 auto;
		width: 98%;
        padding-top: 0.1%;
    }
	#maincontents #sec03 .cta_btn__ul .btn_homerare img {
        width: 85%;
        height: auto;
    }



	#maincontents #sec04 {
		display: block;
		position: relative;
        z-index: 899;
        background-size: 100%;
		overflow: hidden;
		max-width: 836px;
	}
	#maincontents #sec04 .md {
        padding-top: 5.5%;
        padding-bottom: 4%;
        /*
        */
    }
	#maincontents #sec04 .md img {
        width: 90%;
    }
	

    #sec04 .container {
        margin: 5% auto 10% auto;
        flex-direction: column;
        align-items: center;
    }
    #sec04 .box {
        width: 100%;
        height: auto;
        opacity: 1;
        transition: opacity 0.5s ease-in-out;	
    }
    #sec04 .background-image {
        width: 100%;
        height: auto;
        opacity: 1;
        transition: opacity 0.5s ease-in-out;
    }	
    #sec04 .background-image.hidden {
        opacity: 0;
    }
    #sec04 .audio-buttons {
        display: none;
        position: relative;
        top: -344px;
        left: -75px;
        width: 200x;
    }
    #sec04 .audio-btn {
        margin: 0% 2px 0% 2px;
        padding: 0 3px;
        border: none;
        cursor: pointer;
        width: 40px;
    }
    #sec04 .voice_capt	{
        top: 20%;
        left: 71%;
        width: 26%;
        height: auto;
        position: absolute;
        display: flex;
        animation: float 3s ease-in-out infinite;
    }
    @keyframes float {
        0%, 100% {
            transform: translateY(0); /* 初期位置 */
        }
        50% {
            transform: translateY(-5px); /* 上に移動 */
        }
    }	
    #sec04 .thumbnails {
        position: relative;
        top: -15vw;
        flex-wrap: wrap;
        justify-content: center;
    }
    #sec04 .thumbnail {
        width: 20%;
        height: auto;
        margin: 5px 7px;
    }
    .thumbnail.active {
        filter: brightness(0.5);
    }  	
	#sec04 .left-arrow, .right-arrow {
        font-size: 1.5em;
        position: absolute;
    z-index:10;
    }
    #sec04 .left-arrow {
        display:none;
        margin: 50% 0% 0% 0%;
        width: 8%;}
    #sec04 .right-arrow {
        display: none;
        margin: -68% 0% 0% 0%;
        right: 0%;
        width:8%;
    }	
    #sec04 .thumbnail.active {
        filter: brightness(1.2);
    }	



	#maincontents #sec05 .sec05rb51 {
		position: absolute;
        z-index: 800;
        top: -0.1%;
        right: -2.8%;
        width: 8vw;
    }
	#maincontents #sec05 .sec05rb51 img {
        width: 88%;
    }
	#maincontents #sec05 .sec05rb52 {
		position: absolute;
        z-index: 800;
        top: -3.4%;
        left: -7.1%;
        width: 11vw;
    }
	#maincontents #sec05 .sec05rb52 img {
        width: 88%;
    }

	#maincontents #sec05 {
		display: block;
		position: relative;
        z-index: 499;
        background: url(../images/sec05/bg.webp) no-repeat top center;
        background-image: url(../images/sec05/bg.webp);
        background-image: image-set(url(../images/sec05/bg.webp) 1x, url(../images/2x/sec05/bg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec05/bg.webp) 1x, url(../images/2x/sec05/bg@2x.webp) 2x);
        background-size: 105%;
		overflow: hidden;
		max-width: 836px;
        height: 135vw;
	}
	#maincontents #sec05 .md {
        padding-top: 2.5%;
        padding-bottom: 4%;
        margin-top: 10%;
        /*
        */
    }
	#maincontents #sec05 .md img {
        width: 90%;
    }
	#maincontents #sec05 .story01 {
		position: relative;
		position: relative;
        margin-top: 10%;
        /*
        */
    }
	#maincontents #sec05 .story01 .you {
		position: absolute;
        z-index: 10;
        left: 0%;
        width: 37%;
    }
	#maincontents #sec05 .story01 .capt01 {
		position: absolute;
        z-index: 11;
        right: 3%;
        width: 60%;
    }
	#maincontents #sec05 .story01 .txt01 {
		position: absolute;
        z-index: 11;
        right: 3%;
        width: 56%;
        padding-top: 9%;
        filter: blur(5px); /* ぼかしの強さを指定 */
        transition: filter 2s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec05 .story01 .txt01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec05 .story02 {
		position: relative;
        margin-top: 65%;
        /*
        */
    }
	#maincontents #sec05 .story02 .capt02 {
		position: absolute;
        z-index: 11;
        left: 3%;
        width: 55%;
    }
	#maincontents #sec05 .story02 .txt02 {
		position: absolute;
        z-index: 11;
        left: 3%;
        width: 56%;
        padding-top: 19%;
        filter: blur(5px); /* ぼかしの強さを指定 */
        transition: filter 2s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec05 .story02 .txt02.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec05 .story02 .apartment {
		position: absolute;
        z-index: 10;
        right: -3.6vw;
        width: 24vw;
    }
	#maincontents #sec05 .story03 {
		position: relative;
        margin-top: 58%;
        /*
        */
    }
	#maincontents #sec05 .story03 .txt03 {
		position: relative;
        z-index: 11;
        width: 86%;
        padding-top: 55%;
    }


	#maincontents .sec06rb61 {
		position: absolute;
        z-index: 800;
        top: 1445.2vw;
        left: -12.0%;
        width: 14vw;
    }
	#maincontents .sec06rb61 img {
        width: 88%;
    }
	#maincontents .sec06rb62 {
		position: absolute;
        z-index: 800;
        top: 1450.2vw;
        right: -5.4%;
        width: 10vw;
    }
	#maincontents .sec06rb62 img {
        width: 88%;
    }

	#maincontents #sec06 {
		display: block;
		position: relative;
        z-index: 499;
        background-size: 100%;
		overflow: hidden;
		max-width: 836px;
        height: 92vw;
	}
	#maincontents #sec06 .ai {
		position: relative;
        margin-top: 0%;
        /*
        */
    }
	#maincontents #sec06 .ai img {
        width: 45%;
    }
	#maincontents #sec06 .md {
        padding-top: 1.5%;
        margin-top: 0%;
        /*
        */
    }
	#maincontents #sec06 .md img {
        width: 55%;
    }
	#maincontents #sec06 .lef {
		position: relative;
        z-index: 20;
        margin-top: 10%;
        right: -24vw;
        transform-origin: right bottom;
    }
    [data-aos=lef]{ transform:rotate(60deg) }
    [data-aos=lef].aos-animate{ transform:rotate(-7deg) }

	#maincontents #sec06 .lef img {
        width: 45%;
        height: auto;
    }
	#maincontents #sec06 .framebox {
		position: absolute;
        z-index: 20;
        background: #ffffff;
        top: 33vw;
        left: 3%;
        width: 65%;
        height: 48vw;
        border: 2px solid #222222;
        border-radius: 15px;
        overflow-y: scroll;
        -ms-overflow-style: none; /*IE(Internet Explorer)・Microsoft Edgeへの対応*/
        scrollbar-width: none; /*Firefoxへの対応*/
    }
     /*Google Chrome、Safariへの対応*/
    #maincontents #sec06 .framebox::-webkit-scrollbar {
		display: none;
    }
	#maincontents #sec06 .framebox p {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        font-weight: 800;
		font-size: 46px;
		letter-spacing: 0.64px;
		line-height: 2.0em;
    }
	#maincontents #sec06 .framebox img {
        width: 100%;
        height: auto;
    }

	#maincontents #sec06 .framebox .exbox{
		position: absolute;
        z-index: 20;
        background: #ffffff;
        width: 100%;
        height: 450px;
        padding: 2.5%;
    }
	#maincontents #sec06 .framebox .ex01{
		position: relative;
        z-index: 20;
        background: url(../images/sec06/ex01bg.webp) no-repeat top center;
        background-size: cover;
        border: 1px solid #ffffff;
        border-radius: 15px;
        width: 99%;
        height: auto;
        padding: 0%;
        margin-bottom: 1.5vw
    }
    #maincontents #sec06 .framebox .ex01 .title {
        padding: 4% 4% 2% 2%;
        width: 95%;
    }
    #maincontents #sec06 .framebox .ex01 .txt {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        padding: 4% 4% 5% 7%;
        text-align: left;
        font-weight: 800;
		font-size: 1em;
		letter-spacing: 1.64px;
		line-height: 1.7em;
    }
	#maincontents #sec06 .framebox .ex02{
		position: relative;
        z-index: 20;
        background: url(../images/sec06/ex02bg.webp) no-repeat top center;
        background-size: cover;
        border: 1px solid #ffffff;
        border-radius: 15px;
        width: 99%;
        height: auto;
        padding: 0%;
        margin-bottom: 1.5vw
    }
    #maincontents #sec06 .framebox .ex02 .title {
        padding: 4% 4% 2% 2%;
        width: 95%;
    }
    #maincontents #sec06 .framebox .ex02 .txt {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        padding: 4% 4% 5% 7%;
        text-align: left;
        font-weight: 800;
		font-size: 1em;
		letter-spacing: 1.64px;
		line-height: 1.7em;
    }
	#maincontents #sec06 .framebox .ex03{
		position: relative;
        z-index: 20;
        background: url(../images/sec06/ex03bg.webp) no-repeat top center;
        background-size: cover;
        border: 1px solid #ffffff;
        border-radius: 15px;
        width: 99%;
        height: auto;
        padding: 0%;
        margin-bottom: 1.5vw
    }
    #maincontents #sec06 .framebox .ex03 .title {
        padding: 4% 4% 2% 2%;
        width: 95%;
    }
    #maincontents #sec06 .framebox .ex03 .txt {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        padding: 4% 4% 5% 7%;
        text-align: left;
        font-weight: 800;
		font-size: 1em;
		letter-spacing: 1.64px;
		line-height: 1.7em;
    }
	#maincontents #sec06 .framebox .ex04{
		position: relative;
        z-index: 20;
        background: url(../images/sec06/ex04bg.webp) no-repeat top center;
        background-size: cover;
        border: 1px solid #ffffff;
        border-radius: 15px;
        width: 99%;
        height: auto;
        padding: 0%;
        margin-bottom: 1.5vw
    }
    #maincontents #sec06 .framebox .ex04 .title {
        padding: 4% 4% 2% 0%;
        width: 95%;
    }
    #maincontents #sec06 .framebox .ex04 .txt {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        padding: 4% 4% 6% 7%;
        text-align: left;
        font-weight: 800;
		font-size: 1em;
		letter-spacing: 1.64px;
		line-height: 1.7em;
    }




  
  #maincontents .ntg-rule-box {
      position: relative;
      clear: both;
      width: 50vw;
      max-width: 800px;
      /*
      background: rgba(0, 0, 0, 0.4);
      padding: 7px 14px 5px 14px;
      */
      box-sizing: border-box;
      display: block;
      margin: 0 auto 10px auto;
      line-height: 1.8 !important;
      color: #fff;
      overflow: hidden;
  }
  
  #maincontents .ntg-rule-info {
      float: left;
      text-align: left;
      font-size: 14px;
      line-height: 2.2;
      padding-right: 3vw;
  }
  
  #maincontents .ntg-rule-prof {
      float: left;
      text-align: left;
      font-size: 14px;
      line-height: 2.2;
      padding-right: 5px;
  }
  
  #maincontents .ntg-rule-comname {
      clear: both;
      float:inherit;
      text-align: center;
      font-size: 14px;
      line-height: 2.2;
  }
  
  #maincontents .ntg-rule-box,
  #maincontents .ntg-rule-box a,
  #maincontents .ntg-rule-box a:hover,
  #maincontents .ntg-rule-box label,
  #maincontents .ntg-rule-box strong {
      color: #5f473a !important;
      text-align: left !important;
      text-decoration: none !important;
      font-size: 14px !important;
      font-weight: 600 !important;
      font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif !important;
      line-height: inherit !important;
  }
  
  #maincontents .ntg-rule-box a {
      text-decoration: underline !important;
      cursor: pointer !important;
  }
  
  #maincontents .ntg-rule-box strong {
      font-weight: bold !important;
      font-size: inherit !important;
  }
  
  #maincontents .ntg-rule-box input {
      display: inline !important;
  }
  
  #maincontents .ntg-rule-info label, #maincontents .ntg-rule-prof label {
    display: flex;          /* 横並びにする */
    align-items: center;    /* 上下中央揃えにする */
    gap: 6px;               /* チェックボックスと文字の間隔 */
    cursor: pointer;        /* クリックできることを分かりやすく */
    }
    #maincontents .skipDetail_notification, #maincontents .skipDetail_myapp {
      width: 14px;  /* 幅 */
      height: 14px; /* 高さ */
      cursor: pointer; /* マウスを乗せた時に指マークにする */
      accent-color: #fcba03; /* チェック時の色も変更可能（任意） */
    }




	#maincontents #foot {
		display: block;
		position: relative;
        z-index: 499;
        background-color: #ebc84a;
        background-size: 100%;
		overflow: hidden;
		max-width: 836px;
        height: 92vw;
        height: 100%;
        padding-bottom: 0.0vw;
    }
	#maincontents #foot .icon {
		position: relative;
		z-index: 5;
        top: 5.0%;
        margin: 0 auto;
		width: 35%;
        padding-top: 7.1%;
    }
	#maincontents #foot .icon img {
        width: 100%;
    }
    #maincontents #foot .foot__spec {
		position: relative;
		z-index: 4;
        text-align: center;
        padding-top: 3%;
        padding-bottom: 3%;
        margin-top: 7%;
		width: 97%;
        height: 13.6805555556vw;
        height: auto;
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        top: 0.1vw;
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        font-weight: 800;
		font-size: 0.7em;
		letter-spacing: 0.54px;
		line-height: 1.8em;
    }
    #maincontents #foot .foot__spec dl {
	    float: left;
	    padding-right: 2px;
	    text-align: center;
    }

    #maincontents #foot .foot__spec dt {
	    float: left;
	    clear: left;
	    width: 29%;
	    height: 1em;
        height: auto;
        margin-right: 2%;
        padding-top: 1%;
        padding-bottom: 1%;
	    font-weight: bold;
        text-align: right;
    }

    #maincontents #foot .foot__spec dd {
	    margin-left: 0px;
	    width: 65%;
	    height: 1em;
        height: auto;
        margin-right: 2%;
        padding-top: 1%;
        padding-bottom: 1%;
	    font-weight: 100;
        text-align: left;
    }
    #maincontents #foot .foot__spec dd span {
		font-size: 0.6em;
    }
    
    
	#maincontents #foot .foot__btn {
		z-index: 4;
		position: relative;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        top: 1%;
        padding-bottom: 1%;
		width: 77%;
        height: 20.5805555556vw;
        /*
        max-height: 95px;
        */
        margin: 0 auto;
	}
	#maincontents #foot .foot__btn ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 5.0%;
        margin: 0vw auto;
		width: 100%;
        height: 18.5805555556vw;
        /*
        max-height: 95px;
        */
	}
	#maincontents #foot .foot__btn ul li {
        margin-left: 5px;
        margin-right: 5px;
        margin-bottom: 5px;
        width: 44%;
        height: 8.2805555556vw;
        padding: 0px;
    }
	#maincontents #foot .foot__btn ul img {
        width: auto;
        height: 7.5805555556vw;
        max-height: 95px;
        /*
        */
	}
	#maincontents #foot .foot__links {
		z-index: 4;
		position: relative;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-color: #5f473a;
        top: 23%;
        bottom: 0;
		width: 100%;
        height: 10.0805555556vw;
        min-height: 140px;
        margin: 1vw auto 0 auto;
		font-family: 'M PLUS 1p', sans-serif;
		color: #ffffff;
        letter-spacing: 1.0px;
		font-size: 0.8em;
        padding-bottom: 10vw;
	}
	#maincontents #foot .foot__links ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 0.0%;
        margin: 0 auto;
		width: 90%;
        height: auto;
	}
	#maincontents #foot .foot__links ul li {
        margin-left: 5px;
        margin-right: 5px;
        margin-bottom: 10px;
        padding: 15px 5px;
        width: 47%;
        height: 100%;
    }
    #maincontents #foot .foot__links .foot__atten {
        padding-top: 60px;
        width: 95vw;
    }
	#maincontents #foot .foot__links .txt {
		position: relative;
        padding-top: 5px;
		width: 95%;
		font-size: 0.9em;
    }


	#maincontents #foot .foot__copy {
		z-index: 4;
		position: relative;
        text-align: center;
        background-color: #000;
        top: 15%;
        bottom: 0;
		width: 100%;
        height: auto;
        margin: 0vw auto 0 auto;
		font-family: 'M PLUS 1p', sans-serif;
		color: #ffffff;
        letter-spacing: 1.0px;
		font-size: 0.6em;
	}
	#maincontents #foot .foot__copy .copy {
		position: relative;
        padding-top: 1.5vw;
        padding-bottom: 1.5vw;
		width: 70%;
    }


}


@media screen and (min-width: 767px) {
	#maincontents .shopping__content__heading {
		padding-top: 0px
	}
	#maincontents .fv_con .sp_fv {
		display:none;
	}
}


@media (min-width: 769px) {
  .hamBtn,
  .hamBox,
  .footer_share_sp {
    display: none;
  }
}


@media screen and (max-width: 768px) {
	#pc_dis, #pc_dis02 {
		display: none !important;
	}
	body img {
		width: 100%;
	}
	body .sp_view {
		display: block !important
	}
	
/* SP版menu /////////////////////////////////////// */

#dmm_ntgnavi {
    /*
    position: fixed;
    z-index: 900;
    */
    position: relative;
    z-index: 500 !important;
    width: 100%;
    background: url(../images/common/bg_navimain.gif) center center repeat-x;
    border-bottom: 1px solid #ccc;
    border-top: 1px solid #ccc;
    font-size: 12px;
    font-family: 'メイリオ', 'Meiryo', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'ＭＳ Ｐゴシック', Verdana, sans-serif;
    display: flex;
    justify-content: space-between;
}

  #menu.menu {
    display: none;
  }

  .hamBtn {
    position: fixed;
    right: 0;
    top: 0;
    width: 4rem;
    height: 4rem;
    transition: top 0.8s ease-out;
    cursor: pointer;
    z-index: 9999999;
    background: #ebc84a;
    border-radius: 0 0 0 1rem;
    border-bottom: 4px double #fff;
    border-left: 4px double #fff;
  }
  .hamBtn_bar {
    position: absolute;
    width: 32%;
    top: 1.8rem;
    right: 1.2rem;
  }

  .hamBtn span {
    display: block;
    right: 0;
    width: 100%;
    height: 3px;
    border-bottom: 3px solid #ffffff;
    transition: all 0.3s ease;
  }

  .hamBtn span:nth-of-type(1) {
    top: 0.5rem;
  }

  .hamBtn span:nth-of-type(2) {
    position: absolute;
    top: 0.5rem;
  }

  .hamBtn span:nth-of-type(3) {
    position: absolute;
    bottom: 0.5rem;
  }

  .hamBtn.open span:nth-of-type(1) {
    opacity: 0;
  }

  .hamBtn.open span:nth-of-type(2) {
    transform: translateY(-0.5rem) rotate(-45deg);
  }

  .hamBtn.open span:nth-of-type(3) {
    transform: translateY(0.5rem) rotate(45deg);
  }

  .hamBtn.open {
    box-shadow: none;
  }

  .hamBox {
    box-sizing: border-box;
    position: fixed;
    height: 100vh;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 999 !important;
    pointer-events: none;
  }

  .hamBox.open {
    pointer-events: all;
  }

  .hamBox::before {
    content: "";
    display: inline-block;
    position: fixed;
    top: 0;
    right: 0;
    transform: scale(0);
    transition: 0.5s 0.1s;
    transform-origin: top right;
    opacity: 0.95;
    width: 100%;
    height: 100%;
    position: fixed !important;
    background-color: #ebc84a;
    background-image: url('../images/common/menu_flower.webp');
    border-bottom: none;
    background-repeat: no-repeat;
    background-size: 6%;
    background-attachment: fixed;
    background-position: 11% 11%;
    border-radius: 0px;
}

.hamBox::after {
  content: "";
  display: inline-block;
  position: fixed;
  top: 0;
  right: 0;
  transform: scale(0);
  transition: 0.5s 0.1s;
  transform-origin: top right;
  opacity: 0.95;
  width: 100%;
  height: 100%;
  position: fixed !important;
  background-image: url('../images/common/menu_lf.webp');
  border-bottom: none;
  background-repeat: no-repeat;
  background-size: 20%;
  background-attachment: fixed;
  background-position: 4% 97%;
}

  .hamBox.open::before {
    transform: scale(1);
  }
  .hamBox.open::after {
    transform: scale(1);
  }


  .hamBox .lf {
    position: absolute;
    z-index: 300;
    left: -13vw;
    bottom: 5vw;
    width: 20vw;
    pointer-events: all;
  }
  .hamBox .lf img {
    width: 100%;
  }
  .hamBox_inner {
    margin: 0 0 0 auto;
    display: flex;
    opacity: 0;
    transition: 0.4s 0s;
    position: relative;
    z-index: 1;
    background: #ffffff;
    width: 72%;
    margin-right: 0 !important;
    height: 100%;
    overflow: hidden;
  }

  .open .hamBox_inner {
    opacity: 1;
    transition-delay: 0.4s;
    overflow: auto;
  }
  
  .hamBox_menu {
    width: 100vw;
  }
  .menuList {
    margin: 5rem auto 2rem;
    text-align: left;
    position: relative;
    display: block;
    overflow: hidden;
  }

  body.page_detail .menuList.menu_main {
    display: none;
  }

  body:not(.page_detail) .menuList.menu_lower {
    display: none;
  }

  .menuList li:last-child {
    margin-bottom: 0;
  }

  .menuList li .icon_new {
    position: absolute;
    top: -18px;
    font-size: 10px;
    left: 10px;
    display: flex;
    color: #ffffff;
    width: 38px;
    height: 15px;
    background: #f19999;
    border-radius: 10px;
    align-items: center;
    justify-content: center;
  }

  .menuList a {
    font-family: 'M PLUS 2p', sans-serif;
    color: #846a5c;
    font-weight: 700;
    font-size: 14px;
    letter-spacing: 0.38em;
    line-height: 1.2em
  }

  .menuList a:hover {
    opacity: 0.7;
  }

  .menutit {
    font-family: futura-pt, sans-serif;
    font-weight: 600;
    font-style: italic;
    letter-spacing: -0.01em;
    color: #fff;
    font-size: 3.6vw;
    text-align: center;
    line-height: 1;
    margin-bottom: 3.8vw;
  }

  .homeList li a {
    font-family: futura-pt, sans-serif;
    font-weight: 500;
    text-decoration: none;
    font-size: 1.2em;
  }

  .menu .menu__content nav {
    display: block;
    margin-left: 0;
    padding: 60px 0 30px !important;
  }

  .menuList li:first-of-type {
    border-top: 0px solid var(--primary-accent-color);
    /*
    */
  }

  .menuList li {
    border-bottom: 2px solid #ebc84a;
    padding: 5.5vw;
    width: 72vw;
    position: relative;
  }

  .ornament::before {
    background-size: 7%;
    /* height: 7%; */
  }

  
/* SP版FOOT固定褒められ */

  .fixhome {
    display: flex;
    position: fixed;
    bottom: -11vw;
    left: 0;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 41vw;
    padding: 0px 0 0 0;
    background-image: url('../images/common/footfix_base_Pre.webp');
    background-image: url(../images/common/footfix_base_Pre.webp);
    background-image: image-set(url(../images/common/footfix_base_Pre.webp) 1x, url(../images/2x/common/footfix_base_Pre@2x.webp) 2x);
    background-image: -webkit-image-set(url(../images/common/footfix_base_Pre.webp) 1x, url(../images/2x/common/footfix_base_Pre@2x.webp) 2x);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center bottom;
    transition: opacity 0.5s ease-out;
    opacity: 0;
    z-index: 750;
  }
  
  .fixhome .fixhome__content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: 100%;
    margin: 0 3%;
  }
  .fixhome__text-wrapper {
    position: relative;
    top: 1.7vw;
    width: 92%;
  }
  


  

	#main {
		padding-top: 0;
        background: #f8f5ee;
	}
	#maincontents {
		position: relative;
		z-index: 2;
		font-family: "Noto Sans JP", "Shippori Mincho", "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "Hiragino Mincho ProN", "游明朝", "Yu Mincho", "Noto Serif SC", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
        background: #f8f5ee;
	}
	#maincontents .fv_con {
		bottom: 0;
	}
	#maincontents .fv_con .img {
		position: relative;
		display: block;
		width: 100%;
        top: -6.2vw;
		bottom: 0;
		z-index: -1
	}
	#wrapper {
		position: relative;
		z-index: 2;
	}
}




@media screen and (min-width: 531px) and (max-width: 768px){
    .fv_homerare  {
		display: none;
	}
	#maincontents .fv {
		position: relative;
        z-index: 599;
		overflow: hidden;
		height: 115vw;
        max-height: 950px;
	}
	#maincontents .fv_con {
		position: absolute;
		width: 100%;
		top: 0
	}
	#maincontents .fv_con .sp_fv {
		display: block;
		position: absolute;
		left: 0;
		right: 0;
		top: 3%;
		bottom: 0;
		margin: auto;
		width: 54.9305555556vw;
		z-index: 3;
	}
	
	#maincontents .fv_con .capt {
		display: none;
		pointer-events: none;
		position: absolute;
		left: 0;
		right: 3.0%;
		top: 2.0%;
		bottom: 0;
		margin: auto;
		left: auto;
		z-index: 3;
		width: 17%;
	}
	#maincontents .fv_con .capt02 {
        display: block;
		pointer-events: none;
		position: absolute;
		left: 0;
		right: 2vw;
		top: 3vw;
		bottom: 0;
		margin: auto;
		left: auto;
		z-index: 3;
		width: 10%;
    }
	#maincontents .fv_con .capt03 {
        display: block;
		pointer-events: none;
		position: absolute;
		left: 4vw;
		/*
		right: 0;
        top: 27vw;
        padding-top: 60%;
        */
		bottom: 16vw;
		margin: auto;
		z-index: 3;
		width: 10%;
    }


	#maincontents #pcfv {
		display: block;
		position: relative;
        z-index: 499;
        background: url(../images/fv/wrapper.webp) no-repeat center;
        background-size: contain;
		overflow: hidden;
		max-width: 815px;
        height: 130lvh;
		max-height: 925px;
		margin: 0 auto;
        margin-top: 0vw;
	}
	#maincontents #pcfv .pcfv_capt{
        padding-top: 11vw;
        padding-bottom: 20vw;
    }
	#maincontents #pcfv .pcfv_capt img {
        width: 90%;
    }

	#maincontents .shopping__content__heading {
		position: relative;
		z-index: 4;
		padding-top: 0.001538vw
	}
	#wrapper {
		position: relative;
		background-color: #efe8d0;
		overflow: hidden;
		max-width: 100vw;
		margin: 0 auto
	}
	#maincontents .fv {
		position: relative;
		overflow: hidden;
        z-index: 599;
        background: #f8f5ee;
	}
	#maincontents .fv_cta02 {
		display: none;
		position: absolute;
        right: 2.0%;
        top: 80vw;
		width: 90%;
        max-width: 480px;
        height: auto;
	}
	#maincontents .fv_cta02 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        left: 0%;
		right: -2.8%;
		bottom: 8.4%;
		width: 89%;
        max-width: 450px;
        height: auto;
	}
	#maincontents .fv_cta02 ul li {
        width: 34.5%;
        height: auto;
        margin-left: 10px;
        margin-right: 25px;
    }
	#maincontents .fv_cta02 ul li:first-child {
        width: 31.5%;
        height: auto;
        margin-left: 0px;
        margin-right: 20px;
    }
	#maincontents .fv_cta02 ul li img {
        height: 100%;
        max-height: 36px;
	}
	#maincontents .fv .fluer_logo {
		position: relative;
        z-index: 200;
        top: 98vw;
        width: 60vw;
	}
	#maincontents .fv .fvrb01 {
		position: absolute;
        z-index: 800;
        top: 68.2vw;
        left: -22.0vw;
        width: 35vw;
    }
	#maincontents .fvrb01 img {
        width: 98%;
    }
	#maincontents .fv .fvrb02 {
		position: absolute;
        z-index: 800;
        top: 74.2vw;
        right: -9.0vw;
        width: 25vw;
    }
	#maincontents .fvrb02 img {
        width: 98%;
    }



	#maincontents #sec01 {
		display: block;
		position: relative;
        z-index: 499;
        top: 0vw;
        /*background: url(../images/sec01/bg.webp) no-repeat top center;*/
        background-size: 100%;
        background-color: #f8f5ee;
		overflow: hidden;
        width: 100%;
		max-width: 787px;
        height: 105vw;
		margin: 0vw auto 0 auto;
	}
	#maincontents #sec01 .pcfv_capt{
        padding-top: 7vw;
    }
	#maincontents #sec01 .pcfv_capt img {
        width: 95%;
    }
	#maincontents #sec01 .icons {
        padding-top: 9vw;
    }
	#maincontents #sec01 .icons img {
        width: 98%;
    }
	#maincontents #sec01 .boy {
        padding-top: 3vw;
    }
	#maincontents #sec01 .boy img {
        width: 55%;
    }
	#maincontents #sec01 .sec01rb01 {
		position: absolute;
        z-index: 800;
        top: 50.2vw;
        left: -7.0vw;
        width: 17vw;
    }
	#maincontents #sec01 .sec01rb01 img {
        width: 78%;
    }
	#maincontents #sec01 .sec01rb02 {
		position: absolute;
        z-index: 800;
        top: 56.2vw;
        right: -5.0vw;
        width: 15vw;
    }
	#maincontents #sec01 .sec01rb02 img {
        width: 78%;
    }




	#maincontents #sec01 .md {
        padding-top: 23vw;
        padding-bottom: 5%;
        /*
        */
    }
	#maincontents #sec01 .md img {
        width: 90%;
    }
	#maincontents #sec01 .cta_btn__ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background: url(../images/cta/btnframe_Pre.webp) no-repeat top center;
        background-image: url(../images/cta/btnframe_Pre.webp);
        background-image: image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-size: 100%;
        padding-top: 80%;
		width: 100%;
        height: auto;
	}
	#maincontents #sec01 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 17.0%;
        margin: 0 auto;
		width: 100%;
        height: auto;
	}
	#maincontents #sec01 ul li {
        margin-left: 6px;
        margin-right: 6px;
        margin-bottom: 12px;
        width: 48%;
        padding: 5px;
    }
	#maincontents #sec01 ul li:first-child {
        width: 40%;
    }
	#maincontents #sec01 ul img {
        width: 100%;
        height: auto;
        max-height: 106px;
        /*
        */
	}

	#maincontents #sec01 .btn_homerare {
		position: absolute;
		z-index: 5;
        top: 77.0%;
        margin: 0 auto;
		width: 98%;
        padding-top: 0.1%;
    }
	#maincontents #sec01 .btn_homerare img {
        width: 85%;
    }


    
    

	#maincontents #sec07 {
		display: block;
		position: relative;
        z-index: 599;
        top: 0vw;
        background: url(../images/sec07/mdbg.webp) no-repeat top center;
        background-image: url(../images/sec07/mdbg.webp);
        background-image: image-set(url(../images/sec07/mdbg.webp) 1x, url(../images/2x/sec07/mdbg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec07/mdbg.webp) 1x, url(../images/2x/sec07/mdbg@2x.webp) 2x);
        background-size: 100%;
        /*
        padding-top: 80%;
        background: none;
        */
		overflow: hidden;
		max-width: 836px;
        height: 440vw;
        max-height: 3670px;
	}

	#maincontents #sec07 #cam {
		display: block;
		position: relative;
        z-index: 499;
        top: 16.6vw;
        height: 207vw;
        /*
        max-height: 2520px;
        */
    }
	#maincontents #sec07 #cam .md {
		position: relative;
        z-index: 499;
        padding-top: 1vw;
        /*
        */
    }
	#maincontents #sec07 #cam .md img {
        width: 90%;
    }

	#maincontents #sec07 #cam .sec07rb71 {
		position: absolute;
        z-index: 800;
        top: 4.8%;
        left: -6.3vw;
        width: 15.6vw;
    }
	#maincontents #sec07 #cam .sec07rb71 img {
        width: 100%;
    }
	#maincontents #sec07 #cam .sec07rb72 {
		position: absolute;
        z-index: 800;
        top: 5.2%;
        right: -5.5vw;
        width: 16vw;
    }
	#maincontents #sec07 #cam .sec07rb72 img {
        width: 100%;
    }

    
	#maincontents #sec07 #cam .txt {
		position: relative;
        z-index: 499;
		width: 85%;
        height: auto;
        padding-top: 2vw;
        /*
        */
    }
	#maincontents #sec07 #cam .txt img {
        width: 100%;
    }



	#maincontents #sec07 #cam .lef01 {
		position: relative;
		z-index: 5;
        top: -10.0vw;
        left: 2.0%;
        margin: 0 auto;
		width: 35%;
        padding-top: 0.1%;
    }
	#maincontents #sec07 #cam .lef01 img {
        width: 65%;
    }
    #maincontents #sec07 #cam .lef01 {
        transform-origin: center bottom;
        animation: yurayura 2s linear infinite;
    }

    @keyframes yurayura {
        0% , 100%{
            transform: rotate(10deg);
        }
        50%{
            transform: rotate(-10deg);
        }
    }

	#maincontents #sec07 #cam .campaign__ul {
		z-index: 4;
		position: absolute;
        text-align: center;
        top: 120vw;
        background-image: url(../images/sec07/bg.webp);
        background-image: image-set(url(../images/sec07/bg.webp) 1x, url(../images/2x/sec07/bg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec07/bg.webp) 1x, url(../images/2x/sec07/bg@2x.webp) 2x);
        background-repeat: no-repeat;
        background-position: top center;
        background-size: 100% 100%;
		width: 100%;
        height: 165vw;
        max-height: 1500px;
	}
	#maincontents #sec07 #cam .campaign__ul ul {
		z-index: 4;
		position: absolute;
        text-align: center;
        background-size: cover;
        top: -8.5vw;
        margin: 0 auto;
		width: 100%;
        height: auto;
	}
	#maincontents #sec07 #cam .campaign__ul ul li {
        margin-left: 5px;
        margin-right: 5px;
        margin-bottom: 2.1vw;
        margin: 0 auto 0.3vw auto;
        width: 100%;
        height: auto;
        max-height: 522px;
        padding: 5px 0 0.1vw 0;
    }
	#maincontents #sec07 #cam .campaign__ul ul img {
        width: auto;
        height: 100%;
        max-height: 522px;
        /*
        */
	}
	#maincontents #sec07 #cam .campaign__ul ul li.cam01 {
        margin: 5vw auto 0.3vw auto;
        width: 100%;
        height: auto;
    }
	#maincontents #sec07 #cam .lef02 {
        display: none;
		position: absolute;
		z-index: 5;
        top: 35.0vw;
        right: 1.0vw;
        margin: 0 auto;
		width: 25%;
        padding-top: 1.1%;
    }
	#maincontents #sec07 #cam .lef02 img {
        width: 75%;
    }
    #maincontents #sec07 #cam .lef02 {
        transform-origin: center bottom;
        animation: yurayura 2s linear infinite;
    }

    @keyframes yurayura {
        0% , 100%{
            transform: rotate(10deg);
        }
        50%{
            transform: rotate(-10deg);
        }
    }

	#maincontents #sec07 #cam .attention {
		position: relative;
		z-index: 5;
        top: 160vw;
        margin: 2vw auto;
		width: 94%;
        padding-top: 0%;
        text-align: left;
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        font-weight: 800;
		font-size: 0.8em;
		letter-spacing: 0.64px;
		line-height: 2.1em;
    }
	#maincontents #sec07 #cam .attention img {
        width: 100%;
    }
	#maincontents #sec07 .ctamd {
        position: relative;
        top: 113vw;
        width: 90%;
    }
	#maincontents #sec07 .ctamd img {
        width: 100%;
    }


	#maincontents #sec07 .registmd {
		position: relative;
        top: 1.2%;
        /*
        */
    }
	#maincontents #sec07 .registmd img {
        width: 90%;
    }
	#maincontents #sec07 .cta_btn__ul {
		z-index: 4;
		position: relative;
        top: 117vw;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-image: url(../images/cta/btnframe_Pre.webp);
        background-image: image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-repeat: no-repeat;
        background-position: top center;
        background-size: 100% 90%;
        padding-top: 85%;
		width: 100%;
        height: auto;
	}
	#maincontents #sec07 .cta_btn__ul ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 9.8%;
        margin: 0 auto;
		width: 100%;
        height: auto;
	}
	#maincontents #sec07 .cta_btn__ul ul li {
        margin-left: 6px;
        margin-right: 6px;
        margin-bottom: 12px;
        width: 49%;
        padding: 5px;
    } 
    #maincontents #sec07 .cta_btn__ul ul li:first-child {
        width: 41.5%;
    }
    #maincontents #sec07 .cta_btn__ul ul li:nth-of-type(3) {
        width: 55%;
    }
	#maincontents #sec07 .cta_btn__ul ul img {
        width: 100%;
        height: auto;
        max-height: 106px;
        /*
        */
	}

    

    #maincontents .ntg-rule-box-area {
      position: relative;
      width: 65vw;
      right: 0;
      top: -36.5vw;
      transform: translateX(-0%);
      margin: 0 auto;
  }

  
  #maincontents .ntg-rule-box {
      position: relative;
      clear: both;
      width: 65vw;
      max-width: 800px;
      /*
      background: rgba(0, 0, 0, 0.4);
      padding: 7px 14px 5px 14px;
      */
      box-sizing: border-box;
      display: block;
      margin: 0 auto 10px auto;
      line-height: 1.8 !important;
      color: #fff;
      overflow: hidden;
  }
  
  #maincontents .ntg-rule-info {
      float: left;
      text-align: left;
      font-size: 1.0em;
      line-height: 2.2;
      padding-right: 2vw;
  }
  
  #maincontents .ntg-rule-prof {
      float: left;
      text-align: left;
      font-size: 1.0em;
      line-height: 2.2;
      padding-right: 5px;
  }
  
  #maincontents .ntg-rule-comname {
      clear: both;
      float:inherit;
      text-align: center;
      font-size: 0.9em;
      line-height: 2.2;
  }
  
  #maincontents .ntg-rule-box,
  #maincontents .ntg-rule-box a,
  #maincontents .ntg-rule-box a:hover,
  #maincontents .ntg-rule-box label,
  #maincontents .ntg-rule-box strong {
      color: #5f473a !important;
      text-align: left !important;
      text-decoration: none !important;
      font-size: 0.9em !important;
      font-weight: 600 !important;
      font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif !important;
      line-height: inherit !important;
  }
  
  #maincontents .ntg-rule-box a {
      text-decoration: underline !important;
      cursor: pointer !important;
  }
  
  #maincontents .ntg-rule-box strong {
      font-weight: bold !important;
      font-size: inherit !important;
  }
  
  #maincontents .ntg-rule-box input {
      display: inline !important;
  }
  
  #maincontents .ntg-rule-info label, #maincontents .ntg-rule-prof label {
    display: flex;          /* 横並びにする */
    align-items: center;    /* 上下中央揃えにする */
    gap: 6px;               /* チェックボックスと文字の間隔 */
    cursor: pointer;        /* クリックできることを分かりやすく */
    }
    #maincontents .skipDetail_notification, #maincontents .skipDetail_myapp {
      width: 14px;  /* 幅 */
      height: 14px; /* 高さ */
      cursor: pointer; /* マウスを乗せた時に指マークにする */
      accent-color: #fcba03; /* チェック時の色も変更可能（任意） */
    }



	#maincontents #sec07 .cta_btn__ul .btn_homerare {
		position: absolute;
		z-index: 5;
        top: 72.0%;
        margin: 0 auto;
		width: 98%;
        padding-top: 0.1%;
    }
	#maincontents #sec07 .cta_btn__ul .btn_homerare img {
        width: 85%;
        height: auto;
    }
    










	#maincontents .sec02rb01 {
		position: absolute;
        z-index: 800;
        top: 26.8%;
        right: -4.5vw;
        width: 14vw;
    }
	#maincontents .sec02rb01 img {
        width: 78%;
    }
    [data-aos=HorizontalOpen]{ clip-path:inset(0 1000px); }
    [data-aos=HorizontalOpen].aos-animate{ clip-path:inset(0 0); }
    [data-aos=HorizontalOpenT]{ clip-path:inset(1000px 0); }
    [data-aos=HorizontalOpenT].aos-animate{ clip-path:inset(0 0); }

	#maincontents #sec02 {
		display: block;
		position: relative;
        z-index: 499;
		overflow: hidden;
        top: 5vw;
		max-width: 836px;
        
        height: 760vw;
		margin: 0vw auto 0.0vw auto;
	}


	#maincontents #sec02 .md {
		position: relative;
        top: 0vw;
        padding-bottom: 2vw;
    }
	#maincontents #sec02 .md img {
        width: 88%;
    }

    
	#maincontents #sec02 .point01 {
		position: relative;
        height: 100%;
        max-height: 185vw;
		/*
        */
    }

	#maincontents .sec02rb02 {
		position: absolute;
        z-index: 800;
        top: 38.2vw;
        left: -7.8vw;
        width: 17vw;
    }
	#maincontents .sec02rb02 img {
        width: 98%;
    }

	#maincontents #sec02 .point01 .bg {
		position: absolute;
        width: 100%;
        top: 10%;
        left: -7.7%;
    }
	#maincontents #sec02 .point01 .pointbase {
		position: absolute;
        padding-top: 0vw;
        width: 14vw;
        top: 5.8%;
        left: 4.7vw;
        animation: rotateAnimation 6s linear infinite;
    }
    @keyframes rotateAnimation {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }
	#maincontents #sec02 .point01 .pt {
		position: absolute;
        width: 7.8vw;
        top: 8.2%;
        left: 7.7vw;
    }
	#maincontents #sec02 .point01 .txt {
		position: absolute;
        top: 8.5%;
        right: 3vw;
        width: 20.5vw;
    }
	#maincontents #sec02 .point01 .txt img {
        width: 100%;
    }
	#maincontents #sec02 .point01 .support_ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
		bottom: 0;
        top: 0.0%;
        margin: 5px auto;
		width: 99.5%;
        height: auto;
	}
	#maincontents #sec02 .point01 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 130.0vw;
        margin: 0 auto;
		width: 99%;
        height: 100%;
	}
	#maincontents #sec02 .point01 ul li {
        margin-left: 5px;
        margin-right: 5px;
        width: 47%;
        padding: 5px;
    }
	#maincontents #sec02 .point01 ul img {
        height: auto;
	}
	#maincontents #sec02 .point01 .ss01 {
		position: absolute;
		left: 3.5%;
		bottom: 0;
        top: -28.5%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point01 .ss01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec02 .point01 .ss02 {
		position: absolute;
		right: 3.5%;
		bottom: 0;
        top: -28.3%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point01 .ss02.aos-animate {
        filter: blur(0px);
    }
    

	#maincontents #sec02 .point02 {
		position: relative;
        height: 100%;
		max-height: 180vw;
    }
	#maincontents #sec02 .point02 .bg {
		position: absolute;
        width: 95%;
        top: 4%;
        right: -5.2vw;
    }
	#maincontents #sec02 .point02 .pointbase {
		position: absolute;
        padding-top: 0vw;
        width: 14vw;
        top: -0.0%;
        right: 4.7vw;
        animation: rotateAnimation 6s linear infinite;
    }
    @keyframes rotateAnimation {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }
	#maincontents #sec02 .point02 .pt {
		position: absolute;
        width: 7.8vw;
        top: 2.1%;
        right: 7.7vw;
    }
	#maincontents #sec02 .point02 .txt {
		position: absolute;
        top: 7.8vw;
        left: 4vw;
        width: 20.5vw;
    }
	#maincontents #sec02 .point02 .txt img {
        width: 100%;
    }
	
	#maincontents #sec02 .point02 .support_ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
		bottom: 0;
        top: 0.0%;
        margin: 5px auto;
		width: 99.5%;
        height: 100%;
	}
	#maincontents #sec02 .point02 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 115.0vw;
        margin: 0 auto;
		width: 99%;
        height: 100%;
	}
	#maincontents #sec02 .point02 ul li {
        margin-left: 5px;
        margin-right: 5px;
        width: 47%;
        padding: 5px;
    }
	#maincontents #sec02 .point02 ul img {
        height: auto;
	}
	#maincontents #sec02 .point02 .ss01 {
		position: absolute;
		left: 3.5%;
		bottom: 0;
        top: -26.5%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point02 .ss01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec02 .point02 .ss02 {
		position: absolute;
		right: 3.5%;
		bottom: 0;
        top: -26.7%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point02 .ss02.aos-animate {
        filter: blur(0px);
    }



	#maincontents .sec02rb03 {
		position: absolute;
        z-index: 800;
        top: 280.9vw;
        left: -7.8vw;
        width: 17vw;
    }
	#maincontents .sec02rb03 img {
        width: 78%;
    }


	#maincontents #sec02 .point03 {
		position: relative;
        height: 100%;
		max-height: 180vw;
    }

	#maincontents #sec02 .point03 .bg {
		position: absolute;
        width: 92%;
        top: 5%;
        left: -6.7%;
    }
	#maincontents #sec02 .point03 .pointbase {
		position: absolute;
        padding-top: 0vw;
        width: 14vw;
        top: 0.8%;
        left: 4.7vw;
        animation: rotateAnimation 6s linear infinite;
    }
    @keyframes rotateAnimation {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }
	#maincontents #sec02 .point03 .pt {
		position: absolute;
        width: 7.8vw;
        top: 3.1%;
        left: 7.8vw;
    }
	#maincontents #sec02 .point03 .txt {
		position: absolute;
        top: 3.5%;
        right: 5vw;
        width: 17.5vw;
    }
	#maincontents #sec02 .point03 .txt img {
        width: 100%;
    }
	#maincontents #sec02 .point03 .support_ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
		bottom: 0;
        top: 0.0%;
        margin: 5px auto;
		width: 99.5%;
        height: 100%;
	}
	#maincontents #sec02 .point03 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 115.0vw;
        margin: 0 auto;
		width: 99%;
        height: 100%;
	}
	#maincontents #sec02 .point03 ul li {
        margin-left: 5px;
        margin-right: 5px;
        width: 47%;
        padding: 5px;
    }
	#maincontents #sec02 .point03 ul img {
        height: auto;
	}
	#maincontents #sec02 .point03 .ss01 {
		position: absolute;
		left: 3.5%;
		bottom: 0;
        top: -26.5%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point03 .ss01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec02 .point03 .ss02 {
		position: absolute;
		right: 3.5%;
		bottom: 0;
        top: -26.2%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point03 .ss02.aos-animate {
        filter: blur(0px);
    }



	#maincontents .sec02rb04 {
		position: absolute;
        z-index: 800;
        top: 490.9vw;
        right: -6.0vw;
        width: 16vw;
    }
	#maincontents .sec02rb04 img {
        width: 78%;
    }



	#maincontents #sec02 .point04 {
		position: relative;
        height: 100%;
		max-height: 175vw;
    }
	#maincontents #sec02 .point04 .bg {
		position: absolute;
        width: 95%;
        top: 3%;
        right: -5.3vw;
    }
	#maincontents #sec02 .point04 .pointbase {
		position: absolute;
        padding-top: 0vw;
        width: 14vw;
        top: 0.2%;
        right: 4.2vw;
        animation: rotateAnimation 6s linear infinite;
    }
    @keyframes rotateAnimation {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }
	#maincontents #sec02 .point04 .pt {
		position: absolute;
        width: 7.8vw;
        top: 2.6%;
        right: 7.0vw;
    }
	#maincontents #sec02 .point04 .txt {
		position: absolute;
        top: 5.8vw;
        left: 6vw;
        width: 14.5vw;
    }
	#maincontents #sec02 .point04 .txt img {
        width: 100%;
    }
	
	#maincontents #sec02 .point04 .support_ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
		bottom: 0;
        top: 0.0%;
        margin: 5px auto;
		width: 99.5%;
        height: 100%;
	}
	#maincontents #sec02 .point04 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 115.0vw;
        margin: 0 auto;
		width: 99%;
        height: 100%;
	}
	#maincontents #sec02 .point04 ul li {
        margin-left: 5px;
        margin-right: 5px;
        width: 47%;
        padding: 5px;
    }
	#maincontents #sec02 .point04 ul img {
        height: auto;
	}
	#maincontents #sec02 .point04 .ss01 {
		position: absolute;
		left: 3.5%;
		bottom: 0;
        top: -28.5%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point04 .ss01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec02 .point04 .ss02 {
		position: absolute;
		right: 3.5%;
		bottom: 0;
        top: -28.7%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point04 .ss02.aos-animate {
        filter: blur(0px);
    }


	#maincontents .sec02rb05 {
		position: absolute;
        z-index: 800;
        top: 642.0vw;
        left: -5.8vw;
        width: 13vw;
    }
	#maincontents .sec02rb05 img {
        width: 80%;
    }



	#maincontents #sec03 {
		display: block;
		position: relative;
        z-index: 499;
        background: url(../images/sec03/bg.webp) no-repeat top center;
        background-image: url(../images/sec03/bg.webp);
        background-image: image-set(url(../images/sec03/bg.webp) 1x, url(../images/2x/sec03/bg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec03/bg.webp) 1x, url(../images/2x/sec03/bg@2x.webp) 2x);
        background-size: 100%;
		overflow: hidden;
		max-width: 836px;
        height: 255vw;
	}
	#maincontents #sec03 .sec03_capt {
		position: relative;
        top: 2%;
    }
	#maincontents #sec03 .sec03_capt img {
        width: 90%;
    }
	#maincontents #sec03 .voice_sample {
		position: relative;
        top: 8vw;
        width: 100%;
        height: 27vw;
        background: url(../images/sec03/btnbg.webp) repeat-y top center;
        background-image: url(../images/sec03/btnbg.webp);
        background-image: image-set(url(../images/sec03/btnbg.webp) 1x, url(../images/2x/sec03/btnbg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec03/btnbg.webp) 1x, url(../images/2x/sec03/btnbg@2x.webp) 2x);
    }
	#maincontents #sec03 .voice_sample .catch {
		position: relative;
        top: 3vw;
        width: 90%;
    }
	#maincontents #sec03 .voice_sample .btn {
		position: relative;
        top: 4vw;
        width: 70%;
    }
	#maincontents #sec03 .voice_sample .starl {
		position: relative;
        top: -5vw;
        left: -42vw;
        width: 10%;
    }
	#maincontents #sec03 .voice_sample .starr {
		position: relative;
        top: -17vw;
        right: -42vw;
        width: 10%;
    }
	#maincontents #sec03 .voice_slider {
		position: relative;
        top: 12vw;
		width: 100%;
        /*
        */
    }
	#maincontents #sec03 .voice_slider img {
        width: 90%;
    }
    
    /* スライド内の画像を中央寄せにする */
    .voice_slider .slick-slide img {
        display: block;
        margin: 0 auto;
    }


    /* --- スライドショーの矢印カスタマイズ --- */

    /* 矢印画像の共通設定 */
    #maincontents #sec03 .voice_slider .slide-arrow {
        position: absolute;
        top: 50%;             /* 垂直方向の中央 */
        transform: translateY(-50%); /* 中央位置の補正 */
        cursor: pointer;      /* カーソルを指の形に */
        z-index: 10;          /* 画像より手前に表示 */
        width: 60px;          /* ★矢印の大きさ（お好みで調整してください） */
        height: auto;
    }
    
    /* 左矢印の位置 */
    #maincontents #sec03 .voice_slider .prev-arrow {
        left: 10px;           /* 左端から少し内側へ */
    }
    
    /* 右矢印の位置 */
    #maincontents #sec03 .voice_slider .next-arrow {
        right: 10px;          /* 右端から少し内側へ */
    }
    #maincontents #sec03 .voice_slider .slick-dots {
        bottom: -35px;
    }
    #maincontents #sec03 .voice_slider .slick-dots li button:before {
        width: 30px;
        height: 30px;
        font-size: 10px;
    }








	#maincontents #sec03 .md {
		position: relative;
        top: 6.5%;
        /*
        */
    }
	#maincontents #sec03 .md img {
        width: 90%;
    }
	#maincontents #sec03 .cta_btn__ul {
		z-index: 4;
		position: relative;
        top: 8%;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background: url(../images/cta/btnframe_Pre.webp) no-repeat top center;
        background-image: url(../images/cta/btnframe_Pre.webp);
        background-image: image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-size: 100% 90%;
        padding-top: 85%;
		width: 100%;
        height: auto;
	}
	#maincontents #sec03 .cta_btn__ul ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 9.8%;
        margin: 0 auto;
		width: 100%;
        height: auto;
	}
	#maincontents #sec03 .cta_btn__ul ul li {
        margin-left: 6px;
        margin-right: 6px;
        margin-bottom: 12px;
        width: 48%;
        padding: 5px;
    } 
    #maincontents #sec03 .cta_btn__ul ul li:first-child {
        width: 40%;
    }
	#maincontents #sec03 .cta_btn__ul ul img {
        width: 100%;
        height: auto;
        max-height: 106px;
        /*
        */
	}

	#maincontents #sec03 .cta_btn__ul .btn_homerare {
		position: absolute;
		z-index: 5;
        top: 72.0%;
        margin: 0 auto;
		width: 98%;
        padding-top: 0.1%;
    }
	#maincontents #sec03 .cta_btn__ul .btn_homerare img {
        width: 85%;
        height: auto;
    }



	#maincontents #sec04 {
		display: block;
		position: relative;
        z-index: 899;
        background-size: 105%;
		overflow: hidden;
		max-width: 836px;
        height: 220vw;
	}
	#maincontents #sec04 .md {
        padding-top: 5.5%;
        padding-bottom: 4%;
        /*
        */
    }
	#maincontents #sec04 .md img {
        width: 90%;
    }
	

    #sec04 .container {
        margin: 5% auto 10% auto;
        flex-direction: column;
        align-items: center;
    }
    #sec04 .box {
        width: 100%;
        height: auto;
        opacity: 1;
        transition: opacity 0.5s ease-in-out;	
    }
    #sec04 .background-image {
        width: 100%;
        height: auto;
        opacity: 1;
        transition: opacity 0.5s ease-in-out;
    }	
    #sec04 .background-image.hidden {
        opacity: 0;
    }
    #sec04 .audio-buttons {
        display: none;
        position: relative;
        top: -590px;
        left: -148px;
        width: 200x;
    }
    #sec04 .audio-btn {
        margin: 0% 4px 0% 4px;
        padding: 0 3px;
        border: none;
        cursor: pointer;
        width: 55px;
    }
    #sec04 .voice_capt	{
        top: 20%;
        left: 71%;
        width: 26%;
        height: auto;
        position: absolute;
        display: flex;
        animation: float 3s ease-in-out infinite;
    }
    @keyframes float {
        0%, 100% {
            transform: translateY(0); /* 初期位置 */
        }
        50% {
            transform: translateY(-5px); /* 上に移動 */
        }
    }	
    #sec04 .thumbnails {
        position: relative;
        top: -27vw;
        flex-wrap: wrap;
        justify-content: center;
    }
    #sec04 .thumbnail {
        width: 20%;
        height: auto;
        margin: 5px 7px;
    }
    .thumbnail.active {
        filter: brightness(0.5);
    }  	
	#sec04 .left-arrow, .right-arrow {
        font-size: 1.5em;
        position: absolute;
    z-index:10;
    }
    #sec04 .left-arrow {
        display:none;
        margin: 50% 0% 0% 0%;
        width: 8%;}
    #sec04 .right-arrow {
        display: none;
        margin: -68% 0% 0% 0%;
        right: 0%;
        width:8%;
    }	
    #sec04 .thumbnail.active {
        filter: brightness(1.2);
    }	


    
    /* 親要素（キャラ表示エリア） */
.character_display_area {
    position: relative;
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
}

/* ボイスユニット全体の位置 */
.voice_unit {
    display: none;
    position: absolute;
    /* 位置調整：立ち絵の左側、いい感じの高さに配置 */
    top: 32%; 
    left: 4%; 
    width: 40%; /* 立ち絵に対する幅の比率。スマホで小さすぎないよう調整 */
    z-index: 10;
}

/* ベース画像（黄色や青の画像） */
.voice_base_img {
    width: 100%;
    height: auto;
    display: block;
}

/* 透明ボタンを配置するエリア */
.voice_hit_zones {
    position: absolute;
    /* 画像の下部（カプセル部分）に合わせるための調整 */
    /* "VOICE"の文字が画像に含まれている場合、少し下げる必要があります */
    bottom: 10%; 
    left: 24%; /* 左側のアイコン部分（約1/4）を避ける */
    width: 74%; /* 残りの右側部分 */
    height: 42%; /* 高さ調整："VOICE"の文字を除いたカプセルの高さに合わせる */
    display: flex; /* 横並びにする */
}

/* 個別の透明ボタン */
.v-zone {
    flex: 1; /* 3つのボタンを均等な幅にする */
    background-color: transparent; /* 透明 */
    border: none;
    cursor: pointer;
    /* タップしたかわかるように少しだけハイライト（お好みで削除可） */
    transition: background-color 0.2s;
    border-radius: 5px;
}

/* ホバー時やタップ時に薄く白く光らせる（操作感のため） */
.v-zone:hover, .v-zone:active {
    background-color: rgba(255, 255, 255, 0.3);
}

/* スマホ用の微調整 */
@media screen and (max-width: 768px) {
    .voice_unit {
        width: 45%; /* スマホでは少し大きめに表示 */
        top: 30%;
        left: 2%;
    }
}

/* --- ZOOMボタンの配置 --- */
.zoom_btn_container {
    display: none;
    position: absolute;
    /* デザイン画像の位置に合わせて調整 */
    top: 54%; 
    right: 1.5%; 
    width: 13%; /* ボタンの大きさ */
    z-index: 20;
    cursor: pointer;
    transition: transform 0.2s;
}
.zoom_btn_container:hover {
    transform: scale(1.1); /* ホバー時に少し大きくなる */
}
.zoom_btn_container img {
    width: 100%;
    display: block;
    /* ドロップシャドウをつけると浮いて見えて押しやすくなります（お好みで） */
    filter: drop-shadow(0px 2px 3px rgba(0,0,0,0.2));
}

/* --- スマホ時のZOOMボタン調整 --- */
@media screen and (max-width: 768px) {
    .zoom_btn_container {
        width: 13%; /* スマホでは指で押しやすいように少し大きく */
        top: 54%;
        right: 2%;
    }
}

/* --- ポップアップ（モーダル）全体のスタイル --- */
.popup_overlay {
    display: none; /* 初期状態は非表示 */
    position: fixed;
    z-index: 9999; /* 最前面 */
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.85); /* 背景を暗く */
    opacity: 0;
    transition: opacity 0.3s ease;
    justify-content: center;
    align-items: center;
    padding: 20px; /* 画面端の余白 */
    box-sizing: border-box;
}

/* 表示時のクラス */
.popup_overlay.show {
    display: flex;
    opacity: 1;
}

/* ポップアップの中身 */
.popup_content {
    position: relative;
    z-index: 899;
    top: 20px;
    max-width: 80%;
    max-height: 80%;
    text-align: center;
    background: #fff;
}

/* 拡大画像の設定 */
.popup_content img {
    width: 80%;
    height: 80%;
    /* 画面の高さいっぱいに表示しつつ、横幅も画面に収める */
    max-height: 90vh; 
    max-width: 100%; 
    border-radius: 8px;
    box-shadow: 0 0 20px rgba(255, 255, 255, 0.2);
}

/* 閉じるボタン（×） */
.popup_close {
    position: absolute;
    top: -45px;
    right: -10px;
    color: #fff;
    font-size: 40px;
    font-weight: bold;
    cursor: pointer;
    line-height: 1;
    text-shadow: 0 0 5px rgba(0,0,0,0.5);
}

/* スマホの場合、閉じるボタンを少し内側に */
@media screen and (max-width: 768px) {
    .popup_close {
        top: -45px;
        right: 0;
    }
}









	#maincontents #sec05 .sec05rb51 {
		position: absolute;
        z-index: 800;
        top: -0.7%;
        right: -2.5%;
        width: 14vw;
    }
	#maincontents #sec05 .sec05rb51 img {
        width: 88%;
    }
	#maincontents #sec05 .sec05rb52 {
		position: absolute;
        z-index: 800;
        top: -3.4%;
        left: -7.1%;
        width: 17vw;
    }
	#maincontents #sec05 .sec05rb52 img {
        width: 88%;
    }

	#maincontents #sec05 {
		display: block;
		position: relative;
        z-index: 499;
        background: url(../images/sec05/bg.webp) no-repeat top center;
        background-image: url(../images/sec05/bg.webp);
        background-image: image-set(url(../images/sec05/bg.webp) 1x, url(../images/2x/sec05/bg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec05/bg.webp) 1x, url(../images/2x/sec05/bg@2x.webp) 2x);
        background-size: 105%;
		overflow: hidden;
		max-width: 836px;
        height: 213vw;
	}
	#maincontents #sec05 .md {
        padding-top: 2.5%;
        padding-bottom: 4%;
        margin-top: 10%;
        /*
        */
    }
	#maincontents #sec05 .md img {
        width: 90%;
    }
	#maincontents #sec05 .story01 {
		position: relative;
		position: relative;
        margin-top: 10%;
        /*
        */
    }
	#maincontents #sec05 .story01 .you {
		position: absolute;
        z-index: 10;
        left: 0%;
        width: 37%;
    }
	#maincontents #sec05 .story01 .capt01 {
		position: absolute;
        z-index: 11;
        right: 3%;
        width: 60%;
    }
	#maincontents #sec05 .story01 .txt01 {
		position: absolute;
        z-index: 11;
        right: 3%;
        width: 56%;
        padding-top: 9%;
        filter: blur(5px); /* ぼかしの強さを指定 */
        transition: filter 2s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec05 .story01 .txt01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec05 .story02 {
		position: relative;
        margin-top: 65%;
        /*
        */
    }
	#maincontents #sec05 .story02 .capt02 {
		position: absolute;
        z-index: 11;
        left: 3%;
        width: 57%;
    }
	#maincontents #sec05 .story02 .txt02 {
		position: absolute;
        z-index: 11;
        left: 3%;
        width: 56%;
        padding-top: 19%;
        filter: blur(5px); /* ぼかしの強さを指定 */
        transition: filter 2s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec05 .story02 .txt02.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec05 .story02 .apartment {
		position: absolute;
        z-index: 10;
        right: -5.7vw;
        width: 40vw;
    }
	#maincontents #sec05 .story03 {
		position: relative;
        margin-top: 58%;
        /*
        */
    }
	#maincontents #sec05 .story03 .txt03 {
		position: relative;
        z-index: 11;
        width: 86%;
        padding-top: 60%;
    }


	#maincontents .sec06rb61 {
		position: absolute;
        z-index: 800;
        top: 2085.2vw;
        left: -12.0%;
        width: 23vw;
    }
	#maincontents .sec06rb61 img {
        width: 88%;
    }
	#maincontents .sec06rb62 {
		position: absolute;
        z-index: 800;
        top: 2100.2vw;
        right: -5.4%;
        width: 17vw;
    }
	#maincontents .sec06rb62 img {
        width: 88%;
    }

	#maincontents #sec06 {
		display: block;
		position: relative;
        z-index: 499;
        background-size: 100%;
		overflow: hidden;
		max-width: 836px;
        height: 155vw;
        max-height: 1000px;
	}
	#maincontents #sec06 .ai {
		position: relative;
        margin-top: 0%;
        /*
        */
    }
	#maincontents #sec06 .ai img {
        width: 45%;
    }
	#maincontents #sec06 .md {
        padding-top: 1.5%;
        margin-top: 0%;
        /*
        */
    }
	#maincontents #sec06 .md img {
        width: 55%;
    }
	#maincontents #sec06 .lef {
		position: relative;
        z-index: 20;
        margin-top: 10%;
        right: -45vw;
        transform-origin: right bottom;
    }
    [data-aos=lef]{ transform:rotate(60deg) }
    [data-aos=lef].aos-animate{ transform:rotate(-7deg) }

	#maincontents #sec06 .lef img {
        width: 45%;
        height: auto;
    }
	#maincontents #sec06 .framebox {
		position: absolute;
        z-index: 20;
        background: #ffffff;
        top: 60vw;
        left: 3%;
        width: 65%;
        height: 450px;
        border: 2px solid #222222;
        border-radius: 15px;
        overflow-y: scroll;
        -ms-overflow-style: none; /*IE(Internet Explorer)・Microsoft Edgeへの対応*/
        scrollbar-width: none; /*Firefoxへの対応*/
    }
     /*Google Chrome、Safariへの対応*/
    #maincontents #sec06 .framebox::-webkit-scrollbar {
		display: none;
    }
	#maincontents #sec06 .framebox p {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        font-weight: 800;
		font-size: 46px;
		letter-spacing: 0.64px;
		line-height: 2.0em;
    }
	#maincontents #sec06 .framebox img {
        width: 100%;
        height: auto;
    }

	#maincontents #sec06 .framebox .exbox{
		position: absolute;
        z-index: 20;
        background: #ffffff;
        width: 100%;
        height: 450px;
        padding: 2.5%;
    }
	#maincontents #sec06 .framebox .ex01{
		position: relative;
        z-index: 20;
        background: url(../images/sec06/ex01bg.webp) no-repeat top center;
        background-size: cover;
        border: 1px solid #ffffff;
        border-radius: 15px;
        width: 99%;
        height: auto;
        padding: 0%;
        margin-bottom: 1.5vw
    }
    #maincontents #sec06 .framebox .ex01 .title {
        padding: 4% 4% 2% 2%;
        width: 95%;
    }
    #maincontents #sec06 .framebox .ex01 .txt {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        padding: 4% 4% 5% 7%;
        text-align: left;
        font-weight: 800;
		font-size: 1em;
		letter-spacing: 1.64px;
		line-height: 1.7em;
    }
	#maincontents #sec06 .framebox .ex02{
		position: relative;
        z-index: 20;
        background: url(../images/sec06/ex02bg.webp) no-repeat top center;
        background-size: cover;
        border: 1px solid #ffffff;
        border-radius: 15px;
        width: 99%;
        height: auto;
        padding: 0%;
        margin-bottom: 1.5vw
    }
    #maincontents #sec06 .framebox .ex02 .title {
        padding: 4% 4% 2% 2%;
        width: 95%;
    }
    #maincontents #sec06 .framebox .ex02 .txt {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        padding: 4% 4% 5% 7%;
        text-align: left;
        font-weight: 800;
		font-size: 1em;
		letter-spacing: 1.64px;
		line-height: 1.7em;
    }
	#maincontents #sec06 .framebox .ex03{
		position: relative;
        z-index: 20;
        background: url(../images/sec06/ex03bg.webp) no-repeat top center;
        background-size: cover;
        border: 1px solid #ffffff;
        border-radius: 15px;
        width: 99%;
        height: auto;
        padding: 0%;
        margin-bottom: 1.5vw
    }
    #maincontents #sec06 .framebox .ex03 .title {
        padding: 4% 4% 2% 2%;
        width: 95%;
    }
    #maincontents #sec06 .framebox .ex03 .txt {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        padding: 4% 4% 5% 7%;
        text-align: left;
        font-weight: 800;
		font-size: 1em;
		letter-spacing: 1.64px;
		line-height: 1.7em;
    }
	#maincontents #sec06 .framebox .ex04{
		position: relative;
        z-index: 20;
        background: url(../images/sec06/ex04bg.webp) no-repeat top center;
        background-size: cover;
        border: 1px solid #ffffff;
        border-radius: 15px;
        width: 99%;
        height: auto;
        padding: 0%;
        margin-bottom: 1.5vw
    }
    #maincontents #sec06 .framebox .ex04 .title {
        padding: 4% 4% 2% 0%;
        width: 95%;
    }
    #maincontents #sec06 .framebox .ex04 .txt {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        padding: 4% 4% 6% 7%;
        text-align: left;
        font-weight: 800;
		font-size: 1em;
		letter-spacing: 1.64px;
		line-height: 1.7em;
    }




	#maincontents #foot {
		display: block;
		position: relative;
        z-index: 499;
        background-color: #ebc84a;
        background-size: 100%;
		overflow: hidden;
		max-width: 836px;
        height: 92vw;
        height: 100%;
        padding-bottom: 30.0vw;
    }
	#maincontents #foot .icon {
		position: relative;
		z-index: 5;
        top: 5.0%;
        margin: 0 auto;
		width: 35%;
        padding-top: 7.1%;
    }
	#maincontents #foot .icon img {
        width: 100%;
    }
    #maincontents #foot .foot__spec {
		position: relative;
		z-index: 4;
        text-align: center;
        padding-top: 3%;
        padding-bottom: 3%;
        margin-top: 7%;
		width: 97%;
        height: 13.6805555556vw;
        height: auto;
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        top: 0.1vw;
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        font-weight: 800;
		font-size: 0.9em;
		letter-spacing: 0.64px;
		line-height: 1.8em;
    }
    #maincontents #foot .foot__spec dl {
	    float: left;
	    padding-right: 2px;
	    text-align: center;
    }

    #maincontents #foot .foot__spec dt {
	    float: left;
	    clear: left;
	    width: 29%;
	    height: 1em;
        height: auto;
        margin-right: 2%;
        padding-top: 1%;
        padding-bottom: 1%;
	    font-weight: bold;
        text-align: right;
    }

    #maincontents #foot .foot__spec dd {
	    margin-left: 0px;
	    width: 65%;
	    height: 1em;
        height: auto;
        margin-right: 2%;
        padding-top: 1%;
        padding-bottom: 1%;
	    font-weight: 100;
        text-align: left;
    }
    #maincontents #foot .foot__spec dd span {
		font-size: 0.8em;
    }
    
    
	#maincontents #foot .foot__btn {
		z-index: 4;
		position: relative;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        top: 1%;
        padding-bottom: 1%;
		width: 77%;
        height: 30.5805555556vw;
        /*
        max-height: 95px;
        */
        margin: 0 auto;
	}
	#maincontents #foot .foot__btn ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 5.0%;
        margin: 0vw auto;
		width: 100%;
        height: 12.5805555556vw;
        max-height: 95px;
	}
	#maincontents #foot .foot__btn ul li {
        margin-left: 5px;
        margin-right: 5px;
        margin-bottom: 5px;
        width: 44%;
        height: 12.5805555556vw;
        padding: 5px;
    }
	#maincontents #foot .foot__btn ul img {
        width: auto;
        height: 10.5805555556vw;
        max-height: 95px;
        /*
        */
	}
	#maincontents #foot .foot__links {
		z-index: 4;
		position: relative;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-color: #5f473a;
        top: 13%;
        bottom: 0;
		width: 100%;
        height: 10.0805555556vw;
        min-height: 155px;
        margin: 1vw auto 0 auto;
		font-family: 'M PLUS 1p', sans-serif;
		color: #ffffff;
	}
	#maincontents #foot .foot__links ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 0.0%;
        margin: 0 auto;
		width: 90%;
        height: auto;
	}
	#maincontents #foot .foot__links ul li {
        margin-left: 5px;
        margin-right: 5px;
        margin-bottom: 10px;
        padding: 15px 5px;
        width: 47%;
        height: 100%;
        letter-spacing: 1.0px;
		font-size: 1.2em;
        padding-bottom: 10vw;
    }
    #maincontents #foot .foot__links .foot__atten {
        padding-top: 60px;
        width: 95vw;
    }
	#maincontents #foot .foot__links .txt {
		position: relative;
        padding-top: 5px;
		width: 95%;
		font-size: 0.9em;
    }

	#maincontents #foot .foot__copy {
		z-index: 4;
		position: relative;
        text-align: center;
        background-color: #000;
        top: 15%;
        bottom: 0;
		width: 100%;
        height: auto;
        margin: 0vw auto 0 auto;
		font-family: 'M PLUS 1p', sans-serif;
		color: #ffffff;
        letter-spacing: 1.0px;
		font-size: 0.6em;
	}
	#maincontents #foot .foot__copy .copy {
		position: relative;
        padding-top: 1.5vw;
        padding-bottom: 1.7vw;
		width: 70%;
    }


}



@media screen and (max-width: 530px){
    .fv_homerare  {
		display: none;
	}
	#maincontents .fv {
		position: relative;
		overflow: hidden;
		height: 115vw;
        max-height: 950px;
	}
	#maincontents .fv_con {
		position: absolute;
		width: 100%;
		top: 0
	}
	#maincontents .fv_con .sp_fv {
		display: block;
		position: absolute;
		left: 0;
		right: 0;
		top: 3%;
		bottom: 0;
		margin: auto;
		width: 54.9305555556vw;
		z-index: 3;
	}
	
	#maincontents .fv_con .capt {
		display: none;
		pointer-events: none;
		position: absolute;
		left: 0;
		right: 3.0%;
		top: 2.0%;
		bottom: 0;
		margin: auto;
		left: auto;
		z-index: 3;
		width: 17%;
	}
	#maincontents .fv_con .capt02 {
        display: block;
		pointer-events: none;
		position: absolute;
		left: 0;
		right: 2vw;
		top: 3vw;
		bottom: 0;
		margin: auto;
		left: auto;
		z-index: 3;
		width: 12%;
    }
	#maincontents .fv_con .capt03 {
        display: block;
		pointer-events: none;
		position: absolute;
		left: 4vw;
		/*
		right: 0;
        padding-top: 60%;
		bottom: 8vw;
        */
        top: 27vw;
		margin: auto;
		z-index: 3;
		width: 12%;
    }


	#maincontents #pcfv {
		display: block;
		position: relative;
        z-index: 499;
        background: url(../images/fv/wrapper.webp) no-repeat center;
        background-size: contain;
		overflow: hidden;
		max-width: 815px;
        height: 130lvh;
		max-height: 925px;
		margin: 0 auto;
        margin-top: 0vw;
	}
	#maincontents #pcfv .pcfv_capt{
        padding-top: 11vw;
        padding-bottom: 20vw;
    }
	#maincontents #pcfv .pcfv_capt img {
        width: 90%;
    }

	#maincontents .shopping__content__heading {
		position: relative;
		z-index: 4;
		padding-top: 0.001538vw
	}
	#wrapper {
		position: relative;
		background-color: #efe8d0;
		overflow: hidden;
		max-width: 100vw;
		margin: 0 auto
	}
	#maincontents .fv {
		position: relative;
		overflow: hidden;
        z-index: 599;
        background: #f8f5ee;
	}
	#maincontents .fv_cta02 {
		display: none;
		position: absolute;
        right: 2.0%;
        top: 80vw;
		width: 90%;
        max-width: 480px;
        height: auto;
	}
	#maincontents .fv_cta02 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        left: 0%;
		right: -2.8%;
		bottom: 8.4%;
		width: 89%;
        max-width: 450px;
        height: auto;
	}
	#maincontents .fv_cta02 ul li {
        width: 34.5%;
        height: auto;
        margin-left: 10px;
        margin-right: 25px;
    }
	#maincontents .fv_cta02 ul li:first-child {
        width: 31.5%;
        height: auto;
        margin-left: 0px;
        margin-right: 20px;
    }
	#maincontents .fv_cta02 ul li img {
        height: 100%;
        max-height: 36px;
	}
	#maincontents .fv .fluer_logo {
		position: relative;
        z-index: 200;
        top: 98vw;
        width: 60vw;
	}
	#maincontents .fv .fvrb01 {
		position: absolute;
        z-index: 800;
        top: 68.2vw;
        left: -22.0vw;
        width: 35vw;
    }
	#maincontents .fvrb01 img {
        width: 98%;
    }
	#maincontents .fv .fvrb02 {
		position: absolute;
        z-index: 800;
        top: 74.2vw;
        right: -9.0vw;
        width: 25vw;
    }
	#maincontents .fvrb02 img {
        width: 98%;
    }


	#maincontents #sec01 {
		display: block;
		position: relative;
        z-index: 499;
        /*background: url(../images/sec01/bg.webp) no-repeat top center;*/
        background-size: 100%;
		overflow: hidden;
        width: 100%;
		max-width: 787px;
        height: 115vw;
		margin: 0vw auto 0 auto;
	}
	#maincontents #sec01 .pcfv_capt{
        padding-top: 7vw;
    }
	#maincontents #sec01 .pcfv_capt img {
        width: 95%;
    }
	#maincontents #sec01 .icons {
        padding-top: 9vw;
    }
	#maincontents #sec01 .icons img {
        width: 98%;
    }
	#maincontents #sec01 .boy {
        padding-top: 3vw;
    }
	#maincontents #sec01 .boy img {
        width: 55%;
    }
	#maincontents #sec01 .sec01rb01 {
		position: absolute;
        z-index: 800;
        top: 50.2vw;
        left: -7.0vw;
        width: 17vw;
    }
	#maincontents #sec01 .sec01rb01 img {
        width: 98%;
    }
	#maincontents #sec01 .sec01rb02 {
		position: absolute;
        z-index: 800;
        top: 56.2vw;
        right: -5.0vw;
        width: 15vw;
    }
	#maincontents #sec01 .sec01rb02 img {
        width: 98%;
    }



	#maincontents #sec01 .md {
        padding-top: 23.5%;
        padding-bottom: 5%;
        /*
        */
    }
	#maincontents #sec01 .md img {
        width: 90%;
    }
	#maincontents #sec01 .cta_btn__ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background: url(../images/cta/btnframe_Pre.webp) no-repeat top center;
        background-image: url(../images/cta/btnframe_Pre.webp);
        background-image: image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-size: 100%;
        padding-top: 80%;
		width: 100%;
        height: auto;
	}
	#maincontents #sec01 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 17.0%;
        margin: 0 auto;
		width: 100%;
        height: auto;
	}
	#maincontents #sec01 ul li {
        margin-left: 6px;
        margin-right: 6px;
        margin-bottom: 12px;
        width: 48%;
        padding: 5px;
    }
	#maincontents #sec01 ul li:first-child {
        width: 40%;
    }
	#maincontents #sec01 ul img {
        width: 100%;
        height: auto;
        max-height: 106px;
        /*
        */
	}

	#maincontents #sec01 .btn_homerare {
		position: absolute;
		z-index: 5;
        top: 75.0%;
        margin: 0 auto;
		width: 98%;
        padding-top: 0.1%;
    }
	#maincontents #sec01 .btn_homerare img {
        width: 85%;
    }

    
    
    

	#maincontents #sec07 {
		display: block;
		position: relative;
        z-index: 599;
        top: 0vw;
        background: url(../images/sec07/mdbg.webp) no-repeat top center;
        background-image: url(../images/sec07/mdbg.webp);
        background-image: image-set(url(../images/sec07/mdbg.webp) 1x, url(../images/2x/sec07/mdbg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec07/mdbg.webp) 1x, url(../images/2x/sec07/mdbg@2x.webp) 2x);
        background-size: 100%;
        /*
        padding-top: 80%;
        background: none;
        */
		overflow: hidden;
		max-width: 836px;
        height: 460vw;
        max-height: 3670px;
	}

	#maincontents #sec07 #cam {
		display: block;
		position: relative;
        z-index: 499;
        top: 16.6vw;
        height: 207vw;
        /*
        max-height: 2520px;
        */
    }
	#maincontents #sec07 #cam .md {
		position: relative;
        z-index: 499;
        padding-top: 1vw;
        /*
        */
    }
	#maincontents #sec07 #cam .md img {
        width: 90%;
    }

	#maincontents #sec07 #cam .sec07rb71 {
		position: absolute;
        z-index: 800;
        top: 2.8%;
        left: -8.3vw;
        width: 17.6vw;
    }
	#maincontents #sec07 #cam .sec07rb71 img {
        width: 100%;
    }
	#maincontents #sec07 #cam .sec07rb72 {
		position: absolute;
        z-index: 800;
        top: 5.2%;
        right: -5.5vw;
        width: 18vw;
    }
	#maincontents #sec07 #cam .sec07rb72 img {
        width: 100%;
    }

    
	#maincontents #sec07 #cam .txt {
		position: relative;
        z-index: 499;
		width: 85%;
        height: auto;
        padding-top: 2vw;
        /*
        */
    }
	#maincontents #sec07 #cam .txt img {
        width: 100%;
    }



	#maincontents #sec07 #cam .lef01 {
		position: relative;
		z-index: 5;
        top: -10.0vw;
        left: 2.0%;
        margin: 0 auto;
		width: 35%;
        padding-top: 0.1%;
    }
	#maincontents #sec07 #cam .lef01 img {
        width: 65%;
    }
    #maincontents #sec07 #cam .lef01 {
        transform-origin: center bottom;
        animation: yurayura 2s linear infinite;
    }

    @keyframes yurayura {
        0% , 100%{
            transform: rotate(10deg);
        }
        50%{
            transform: rotate(-10deg);
        }
    }

	#maincontents #sec07 #cam .campaign__ul {
		z-index: 4;
		position: absolute;
        text-align: center;
        top: 120vw;
        background-image: url(../images/sec07/bg.webp);
        background-image: image-set(url(../images/sec07/bg.webp) 1x, url(../images/2x/sec07/bg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec07/bg.webp) 1x, url(../images/2x/sec07/bg@2x.webp) 2x);
        background-repeat: no-repeat;
        background-position: top center;
        background-size: 100% 100%;
		width: 100%;
        height: 175vw;
        max-height: 1500px;
	}
	#maincontents #sec07 #cam .campaign__ul ul {
		z-index: 4;
		position: absolute;
        text-align: center;
        background-size: cover;
        top: -8.5vw;
        margin: 0 auto;
		width: 100%;
        height: auto;
	}
	#maincontents #sec07 #cam .campaign__ul ul li {
        margin-left: 5px;
        margin-right: 5px;
        margin-bottom: 2.1vw;
        margin: 0 auto 0.3vw auto;
        width: 100%;
        height: auto;
        max-height: 522px;
        padding: 5px 0 0.1vw 0;
    }
	#maincontents #sec07 #cam .campaign__ul ul li img {
        width: 100%;
        height: auto;
        max-height: 300px;
        /*
        */
	}
	#maincontents #sec07 #cam .campaign__ul ul li.cam01 {
        margin: 5vw auto 0.3vw auto;
        width: 100%;
        height: auto;
    }
	#maincontents #sec07 #cam .lef02 {
        display: none;
		position: absolute;
		z-index: 5;
        top: 35.0vw;
        right: 1.0vw;
        margin: 0 auto;
		width: 25%;
        padding-top: 1.1%;
    }
	#maincontents #sec07 #cam .lef02 img {
        width: 75%;
    }
    #maincontents #sec07 #cam .lef02 {
        transform-origin: center bottom;
        animation: yurayura 2s linear infinite;
    }

    @keyframes yurayura {
        0% , 100%{
            transform: rotate(10deg);
        }
        50%{
            transform: rotate(-10deg);
        }
    }

	#maincontents #sec07 #cam .attention {
		position: relative;
		z-index: 5;
        top: 160vw;
        margin: 2vw auto;
		width: 94%;
        padding-top: 0%;
        text-align: left;
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        font-weight: 800;
		font-size: 0.6em;
		letter-spacing: 0.64px;
		line-height: 2.1em;
    }
	#maincontents #sec07 #cam .attention img {
        width: 100%;
    }
	#maincontents #sec07 .ctamd {
        position: relative;
        top: 122vw;
        width: 90%;
    }
	#maincontents #sec07 .ctamd img {
        width: 100%;
    }


	#maincontents #sec07 .registmd {
		position: relative;
        top: 1.2%;
        /*
        */
    }
	#maincontents #sec07 .registmd img {
        width: 90%;
    }
	#maincontents #sec07 .cta_btn__ul {
		z-index: 4;
		position: relative;
        top: 124vw;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-image: url(../images/cta/btnframe_Pre.webp);
        background-image: image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-repeat: no-repeat;
        background-position: top center;
        background-size: 100% 90%;
        padding-top: 85%;
		width: 100%;
        height: auto;
	}
	#maincontents #sec07 .cta_btn__ul ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 8.8%;
        margin: 0 auto;
		width: 100%;
        height: auto;
	}
	#maincontents #sec07 .cta_btn__ul ul li {
        margin-left: 6px;
        margin-right: 6px;
        margin-bottom: 8px;
        width: 49%;
        padding: 4px;
    } 
    #maincontents #sec07 .cta_btn__ul ul li:first-child {
        width: 41.5%;
    }
    #maincontents #sec07 .cta_btn__ul ul li:nth-of-type(3) {
        width: 55%;
    }
	#maincontents #sec07 .cta_btn__ul ul img {
        width: 100%;
        height: auto;
        max-height: 106px;
        /*
        */
	}

    

    #maincontents .ntg-rule-box-area {
      position: relative;
      width: 77vw;
      right: 0;
      top: -36.5vw;
      transform: translateX(-0%);
      margin: 0 auto;
  }

  
  #maincontents .ntg-rule-box {
      position: relative;
      clear: both;
      width: 77vw;
      max-width: 800px;
      /*
      background: rgba(0, 0, 0, 0.4);
      padding: 7px 14px 5px 14px;
      */
      box-sizing: border-box;
      display: block;
      margin: 0 auto 10px auto;
      line-height: 1.8 !important;
      color: #fff;
      overflow: hidden;
  }
  
  #maincontents .ntg-rule-info {
      float: left;
      text-align: left;
      font-size: 1.0em;
      line-height: 2.2;
      padding-right: 2vw;
  }
  
  #maincontents .ntg-rule-prof {
      float: left;
      text-align: left;
      font-size: 1.0em;
      line-height: 2.2;
      padding-right: 5px;
  }
  
  #maincontents .ntg-rule-comname {
      clear: both;
      float:inherit;
      text-align: center;
      font-size: 0.8em;
      line-height: 2.2;
  }
  
  #maincontents .ntg-rule-box,
  #maincontents .ntg-rule-box a,
  #maincontents .ntg-rule-box a:hover,
  #maincontents .ntg-rule-box label,
  #maincontents .ntg-rule-box strong {
      color: #5f473a !important;
      text-align: left !important;
      text-decoration: none !important;
      font-size: 0.8em !important;
      font-weight: 600 !important;
      font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif !important;
      line-height: inherit !important;
  }
  
  #maincontents .ntg-rule-box a {
      text-decoration: underline !important;
      cursor: pointer !important;
  }
  
  #maincontents .ntg-rule-box strong {
      font-weight: bold !important;
      font-size: inherit !important;
  }
  
  #maincontents .ntg-rule-box input {
      display: inline !important;
  }
  
  #maincontents .ntg-rule-info label, #maincontents .ntg-rule-prof label {
    display: flex;          /* 横並びにする */
    align-items: center;    /* 上下中央揃えにする */
    gap: 6px;               /* チェックボックスと文字の間隔 */
    cursor: pointer;        /* クリックできることを分かりやすく */
    }
    #maincontents .skipDetail_notification, #maincontents .skipDetail_myapp {
      width: 14px;  /* 幅 */
      height: 14px; /* 高さ */
      cursor: pointer; /* マウスを乗せた時に指マークにする */
      accent-color: #fcba03; /* チェック時の色も変更可能（任意） */
    }



	#maincontents #sec07 .cta_btn__ul .btn_homerare {
		position: absolute;
		z-index: 5;
        top: 72.0%;
        margin: 0 auto;
		width: 98%;
        padding-top: 0.1%;
    }
	#maincontents #sec07 .cta_btn__ul .btn_homerare img {
        width: 85%;
        height: auto;
    }
    









	#maincontents .sec02rb01 {
		position: absolute;
        z-index: 800;
        top: 27.1%;
        right: -3.5vw;
        width: 15vw;
    }
	#maincontents .sec02rb01 img {
        width: 88%;
    }
    [data-aos=HorizontalOpen]{ clip-path:inset(0 1000px); }
    [data-aos=HorizontalOpen].aos-animate{ clip-path:inset(0 0); }
    [data-aos=HorizontalOpenT]{ clip-path:inset(1000px 0); }
    [data-aos=HorizontalOpenT].aos-animate{ clip-path:inset(0 0); }



	#maincontents #sec02 {
		display: block;
		position: relative;
        z-index: 499;
		overflow: hidden;
		max-width: 836px;
        
        height: 760vw;
        /*
		max-height: 6400px;
        */
		margin: 0vw auto 0.0vw auto;
	}


	#maincontents #sec02 .md {
		position: relative;
        top: 0vw;
        padding-bottom: 2vw;
    }
	#maincontents #sec02 .md img {
        width: 88%;
    }

    
	#maincontents #sec02 .point01 {
		position: relative;
        height: 100%;
        max-height: 180vw;
        margin: 0 auto 5vw auto;
		/*
        */
    }

	#maincontents .sec02rb02 {
		position: absolute;
        z-index: 800;
        top: 38.2vw;
        left: -7.8vw;
        width: 17vw;
    }
	#maincontents .sec02rb02 img {
        width: 98%;
    }

	#maincontents #sec02 .point01 .bg {
		position: absolute;
        width: 100%;
        top: 10%;
        left: -7.7%;
    }
	#maincontents #sec02 .point01 .pointbase {
		position: absolute;
        padding-top: 0vw;
        width: 14vw;
        top: 5.8%;
        left: 4.7vw;
        animation: rotateAnimation 6s linear infinite;
    }
    @keyframes rotateAnimation {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }
	#maincontents #sec02 .point01 .pt {
		position: absolute;
        width: 7.8vw;
        top: 8.2%;
        left: 7.7vw;
    }
	#maincontents #sec02 .point01 .txt {
		position: absolute;
        top: 8.5%;
        right: 3vw;
        width: 20.5vw;
    }
	#maincontents #sec02 .point01 .txt img {
        width: 100%;
    }
	#maincontents #sec02 .point01 .support_ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
		bottom: 0;
        top: 0.0%;
        margin: 5px auto;
		width: 99.5%;
        height: auto;
	}
	#maincontents #sec02 .point01 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 130.0vw;
        margin: 0 auto;
		width: 99%;
        height: 100%;
	}
	#maincontents #sec02 .point01 ul li {
        margin-left: 5px;
        margin-right: 5px;
        width: 47%;
        padding: 5px;
    }
	#maincontents #sec02 .point01 ul img {
        height: auto;
	}
	#maincontents #sec02 .point01 .ss01 {
		position: absolute;
		left: 3.5%;
		bottom: 0;
        top: -28.5%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point01 .ss01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec02 .point01 .ss02 {
		position: absolute;
		right: 3.5%;
		bottom: 0;
        top: -28.3%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point01 .ss02.aos-animate {
        filter: blur(0px);
    }
    

	#maincontents #sec02 .point02 {
		position: relative;
        height: 100%;
		max-height: 180vw;
    }
	#maincontents #sec02 .point02 .bg {
		position: absolute;
        width: 95%;
        top: 4%;
        right: -5.2vw;
    }
	#maincontents #sec02 .point02 .pointbase {
		position: absolute;
        padding-top: 0vw;
        width: 14vw;
        top: -0.0%;
        right: 4.7vw;
        animation: rotateAnimation 6s linear infinite;
    }
    @keyframes rotateAnimation {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }
	#maincontents #sec02 .point02 .pt {
		position: absolute;
        width: 7.8vw;
        top: 2.1%;
        right: 7.7vw;
    }
	#maincontents #sec02 .point02 .txt {
		position: absolute;
        top: 7.8vw;
        left: 4vw;
        width: 20.5vw;
    }
	#maincontents #sec02 .point02 .txt img {
        width: 100%;
    }
	
	#maincontents #sec02 .point02 .support_ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
		bottom: 0;
        top: 0.0%;
        margin: 5px auto;
		width: 99.5%;
        height: 100%;
	}
	#maincontents #sec02 .point02 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 115.0vw;
        margin: 0 auto;
		width: 99%;
        height: 100%;
	}
	#maincontents #sec02 .point02 ul li {
        margin-left: 5px;
        margin-right: 5px;
        width: 47%;
        padding: 5px;
    }
	#maincontents #sec02 .point02 ul img {
        height: auto;
	}
	#maincontents #sec02 .point02 .ss01 {
		position: absolute;
		left: 3.5%;
		bottom: 0;
        top: -26.5%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point02 .ss01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec02 .point02 .ss02 {
		position: absolute;
		right: 3.5%;
		bottom: 0;
        top: -26.7%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point02 .ss02.aos-animate {
        filter: blur(0px);
    }



	#maincontents .sec02rb03 {
		position: absolute;
        z-index: 800;
        top: 280.9vw;
        left: -7.8vw;
        width: 17vw;
    }
	#maincontents .sec02rb03 img {
        width: 88%;
    }


	#maincontents #sec02 .point03 {
		position: relative;
        height: 100%;
		max-height: 180vw;
    }

	#maincontents #sec02 .point03 .bg {
		position: absolute;
        width: 92%;
        top: 5%;
        left: -6.7%;
    }
	#maincontents #sec02 .point03 .pointbase {
		position: absolute;
        padding-top: 0vw;
        width: 14vw;
        top: 0.8%;
        left: 4.7vw;
        animation: rotateAnimation 6s linear infinite;
    }
    @keyframes rotateAnimation {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }
	#maincontents #sec02 .point03 .pt {
		position: absolute;
        width: 7.8vw;
        top: 3.1%;
        left: 7.8vw;
    }
	#maincontents #sec02 .point03 .txt {
		position: absolute;
        top: 3.5%;
        right: 5vw;
        width: 17.5vw;
    }
	#maincontents #sec02 .point03 .txt img {
        width: 100%;
    }
	#maincontents #sec02 .point03 .support_ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
		bottom: 0;
        top: 0.0%;
        margin: 5px auto;
		width: 99.5%;
        height: 100%;
	}
	#maincontents #sec02 .point03 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 115.0vw;
        margin: 0 auto;
		width: 99%;
        height: 100%;
	}
	#maincontents #sec02 .point03 ul li {
        margin-left: 5px;
        margin-right: 5px;
        width: 47%;
        padding: 5px;
    }
	#maincontents #sec02 .point03 ul img {
        height: auto;
	}
	#maincontents #sec02 .point03 .ss01 {
		position: absolute;
		left: 3.5%;
		bottom: 0;
        top: -26.5%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point03 .ss01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec02 .point03 .ss02 {
		position: absolute;
		right: 3.5%;
		bottom: 0;
        top: -26.2%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point03 .ss02.aos-animate {
        filter: blur(0px);
    }



	#maincontents .sec02rb04 {
		position: absolute;
        z-index: 800;
        top: 490.9vw;
        right: -7.0vw;
        width: 17vw;
    }
	#maincontents .sec02rb04 img {
        width: 78%;
    }



	#maincontents #sec02 .point04 {
		position: relative;
        height: 100%;
		max-height: 175vw;
    }
	#maincontents #sec02 .point04 .bg {
		position: absolute;
        width: 95%;
        top: 3%;
        right: -5.3vw;
    }
	#maincontents #sec02 .point04 .pointbase {
		position: absolute;
        padding-top: 0vw;
        width: 14vw;
        top: 0.2%;
        right: 4.2vw;
        animation: rotateAnimation 6s linear infinite;
    }
    @keyframes rotateAnimation {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }
	#maincontents #sec02 .point04 .pt {
		position: absolute;
        width: 7.8vw;
        top: 2.6%;
        right: 7.0vw;
    }
	#maincontents #sec02 .point04 .txt {
		position: absolute;
        top: 5.8vw;
        left: 6vw;
        width: 14.5vw;
    }
	#maincontents #sec02 .point04 .txt img {
        width: 100%;
    }
	
	#maincontents #sec02 .point04 .support_ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
		bottom: 0;
        top: 0.0%;
        margin: 5px auto;
		width: 99.5%;
        height: 100%;
	}
	#maincontents #sec02 .point04 ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 115.0vw;
        margin: 0 auto;
		width: 99%;
        height: 100%;
	}
	#maincontents #sec02 .point04 ul li {
        margin-left: 5px;
        margin-right: 5px;
        width: 47%;
        padding: 5px;
    }
	#maincontents #sec02 .point04 ul img {
        height: auto;
	}
	#maincontents #sec02 .point04 .ss01 {
		position: absolute;
		left: 3.5%;
		bottom: 0;
        top: -28.5%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point04 .ss01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec02 .point04 .ss02 {
		position: absolute;
		right: 3.5%;
		bottom: 0;
        top: -28.7%;
        width: 45%;
        height: auto;
        filter: blur(50px); /* ぼかしの強さを指定 */
        transition: filter 1.5s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec02 .point04 .ss02.aos-animate {
        filter: blur(0px);
    }


	#maincontents .sec02rb05 {
		position: absolute;
        z-index: 800;
        top: 642.0vw;
        left: -5.8vw;
        width: 14vw;
    }
	#maincontents .sec02rb05 img {
        width: 90%;
    }



	#maincontents #sec03 {
		display: block;
		position: relative;
        z-index: 499;
        background: url(../images/sec03/bg.webp) no-repeat top center;
        background-image: url(../images/sec03/bg.webp);
        background-image: image-set(url(../images/sec03/bg.webp) 1x, url(../images/2x/sec03/bg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec03/bg.webp) 1x, url(../images/2x/sec03/bg@2x.webp) 2x);
        background-size: 100%;
		overflow: hidden;
		max-width: 836px;
        height: 265vw;
	}
	#maincontents #sec03 .sec03_capt {
		position: relative;
        top: 2%;
    }
	#maincontents #sec03 .sec03_capt img {
        width: 90%;
    }
	#maincontents #sec03 .voice_sample {
		position: relative;
        top: 8vw;
        width: 100%;
        height: 27vw;
        background: url(../images/sec03/btnbg.webp) repeat-y top center;
        background-image: url(../images/sec03/btnbg.webp);
        background-image: image-set(url(../images/sec03/btnbg.webp) 1x, url(../images/2x/sec03/btnbg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec03/btnbg.webp) 1x, url(../images/2x/sec03/btnbg@2x.webp) 2x);
    }
	#maincontents #sec03 .voice_sample .catch {
		position: relative;
        top: 3vw;
        width: 90%;
    }
	#maincontents #sec03 .voice_sample .btn {
		position: relative;
        top: 4vw;
        width: 70%;
    }
	#maincontents #sec03 .voice_sample .starl {
		position: relative;
        top: -5vw;
        left: -42vw;
        width: 10%;
    }
	#maincontents #sec03 .voice_sample .starr {
		position: relative;
        top: -17vw;
        right: -42vw;
        width: 10%;
    }
	#maincontents #sec03 .voice_slider {
		position: relative;
        top: 10vw;
		width: 100%;
        padding-top: 1%;
        /*
        */
    }
	#maincontents #sec03 .voice_slider img {
        width: 90%;
    }
    /* スライド内の画像を中央寄せにする */
    .voice_slider .slick-slide img {
        display: block;
        margin: 0 auto;
    }


    /* --- スライドショーの矢印カスタマイズ --- */

    /* 矢印画像の共通設定 */
    #maincontents #sec03 .voice_slider .slide-arrow {
        position: absolute;
        top: 50%;             /* 垂直方向の中央 */
        transform: translateY(-50%); /* 中央位置の補正 */
        cursor: pointer;      /* カーソルを指の形に */
        z-index: 10;          /* 画像より手前に表示 */
        width: 35px;          /* ★矢印の大きさ（お好みで調整してください） */
        height: auto;
    }
    
    /* 左矢印の位置 */
    #maincontents #sec03 .voice_slider .prev-arrow {
        left: 5px;           /* 左端から少し内側へ */
    }
    
    /* 右矢印の位置 */
    #maincontents #sec03 .voice_slider .next-arrow {
        right: 5px;          /* 右端から少し内側へ */
    }
    #maincontents #sec03 .voice_slider .slick-dots {
        bottom: -25px;
    }
    #maincontents #sec03 .voice_slider .slick-dots li button:before {
        width: 30px;
        height: 30px;
        font-size: 10px;
    }





	#maincontents #sec03 .md {
		position: relative;
        top: 6.5%;
        /*
        */
    }
	#maincontents #sec03 .md img {
        width: 90%;
    }
	#maincontents #sec03 .cta_btn__ul {
		z-index: 4;
		position: relative;
        top: 8%;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background: url(../images/cta/btnframe_Pre.webp) no-repeat top center;
        background-image: url(../images/cta/btnframe_Pre.webp);
        background-image: image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/cta/btnframe_Pre.webp) 1x, url(../images/2x/cta/btnframe_Pre@2x.webp) 2x);
        background-size: 100% 90%;
        padding-top: 85%;
		width: 100%;
        height: auto;
	}
	#maincontents #sec03 .cta_btn__ul ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 9.8%;
        margin: 0 auto;
		width: 100%;
        height: auto;
	}
	#maincontents #sec03 .cta_btn__ul ul li {
        margin-left: 6px;
        margin-right: 6px;
        margin-bottom: 12px;
        width: 48%;
        padding: 5px;
    } 
    #maincontents #sec03 .cta_btn__ul ul li:first-child {
        width: 40%;
    }
	#maincontents #sec03 .cta_btn__ul ul img {
        width: 100%;
        height: auto;
        max-height: 106px;
        /*
        */
	}

	#maincontents #sec03 .cta_btn__ul .btn_homerare {
		position: absolute;
		z-index: 5;
        top: 72.5%;
        margin: 0 auto;
		width: 98%;
        padding-top: 0.1%;
    }
	#maincontents #sec03 .cta_btn__ul .btn_homerare img {
        width: 85%;
        height: auto;
    }



	#maincontents #sec04 {
		display: block;
		position: relative;
        z-index: 899;
        background-size: 105%;
		overflow: hidden;
		max-width: 836px;
        height: 220vw;
	}
	#maincontents #sec04 .md {
        padding-top: 5.5%;
        padding-bottom: 4%;
        /*
        */
    }
	#maincontents #sec04 .md img {
        width: 90%;
    }
	

    #sec04 .container {
        margin: 5% auto 10% auto;
        flex-direction: column;
        align-items: center;
    }
    #sec04 .box {
        width: 100%;
        height: auto;
        opacity: 1;
        transition: opacity 0.5s ease-in-out;	
    }
    #sec04 .background-image {
        width: 100%;
        height: auto;
        opacity: 1;
        transition: opacity 0.5s ease-in-out;
    }	
    #sec04 .background-image.hidden {
        opacity: 0;
    }
    #sec04 .audio-buttons {
        display: none;
        position: relative;
        top: -346px;
        left: -85px;
        width: 200x;
    }
    #sec04 .audio-btn {
        margin: 0% 2px 0% 2px;
        padding: 0 3px;
        border: none;
        cursor: pointer;
        width: 31px;
    }
    #sec04 .voice_capt	{
        top: 20%;
        left: 71%;
        width: 26%;
        height: auto;
        position: absolute;
        display: flex;
        animation: float 3s ease-in-out infinite;
    }
    @keyframes float {
        0%, 100% {
            transform: translateY(0); /* 初期位置 */
        }
        50% {
            transform: translateY(-5px); /* 上に移動 */
        }
    }	
    #sec04 .thumbnails {
        position: relative;
        top: -23vw;
        flex-wrap: wrap;
        justify-content: center;
    }
    #sec04 .thumbnail {
        width: 20%;
        height: auto;
        margin: 5px;
    }
    .thumbnail.active {
        filter: brightness(0.5);
    }  	
	#sec04 .left-arrow, .right-arrow {
        font-size: 1.5em;
        position: absolute;
    z-index:10;
    }
    #sec04 .left-arrow {
        display:none;
        margin: 50% 0% 0% 0%;
        width: 8%;}
    #sec04 .right-arrow {
        display: none;
        margin: -68% 0% 0% 0%;
        right: 0%;
        width:8%;
    }	
    #sec04 .thumbnail.active {
        filter: brightness(1.2);
    }	
    
    
    /* 親要素（キャラ表示エリア） */
.character_display_area {
    position: relative;
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
}

/* ボイスユニット全体の位置 */
.voice_unit {
    display: none;
    position: absolute;
    /* 位置調整：立ち絵の左側、いい感じの高さに配置 */
    top: 32%; 
    left: 4%; 
    width: 40%; /* 立ち絵に対する幅の比率。スマホで小さすぎないよう調整 */
    z-index: 10;
}

/* ベース画像（黄色や青の画像） */
.voice_base_img {
    width: 100%;
    height: auto;
    display: block;
}

/* 透明ボタンを配置するエリア */
.voice_hit_zones {
    position: absolute;
    /* 画像の下部（カプセル部分）に合わせるための調整 */
    /* "VOICE"の文字が画像に含まれている場合、少し下げる必要があります */
    bottom: 10%; 
    left: 24%; /* 左側のアイコン部分（約1/4）を避ける */
    width: 74%; /* 残りの右側部分 */
    height: 42%; /* 高さ調整："VOICE"の文字を除いたカプセルの高さに合わせる */
    display: flex; /* 横並びにする */
}

/* 個別の透明ボタン */
.v-zone {
    flex: 1; /* 3つのボタンを均等な幅にする */
    background-color: transparent; /* 透明 */
    border: none;
    cursor: pointer;
    /* タップしたかわかるように少しだけハイライト（お好みで削除可） */
    transition: background-color 0.2s;
    border-radius: 5px;
}

/* ホバー時やタップ時に薄く白く光らせる（操作感のため） */
.v-zone:hover, .v-zone:active {
    background-color: rgba(255, 255, 255, 0.3);
}

/* スマホ用の微調整 */
@media screen and (max-width: 768px) {
    .voice_unit {
        width: 45%; /* スマホでは少し大きめに表示 */
        top: 30%;
        left: 2%;
    }
}


    
    /* 親要素（キャラ表示エリア） */
.character_display_area {
    position: relative;
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
}

/* ボイスユニット全体の位置 */
.voice_unit {
    display: none;
    position: absolute;
    /* 位置調整：立ち絵の左側、いい感じの高さに配置 */
    top: 32%; 
    left: 4%; 
    width: 40%; /* 立ち絵に対する幅の比率。スマホで小さすぎないよう調整 */
    z-index: 10;
}

/* ベース画像（黄色や青の画像） */
.voice_base_img {
    width: 100%;
    height: auto;
    display: block;
}

/* 透明ボタンを配置するエリア */
.voice_hit_zones {
    position: absolute;
    /* 画像の下部（カプセル部分）に合わせるための調整 */
    /* "VOICE"の文字が画像に含まれている場合、少し下げる必要があります */
    bottom: 10%; 
    left: 24%; /* 左側のアイコン部分（約1/4）を避ける */
    width: 74%; /* 残りの右側部分 */
    height: 42%; /* 高さ調整："VOICE"の文字を除いたカプセルの高さに合わせる */
    display: flex; /* 横並びにする */
}

/* 個別の透明ボタン */
.v-zone {
    flex: 1; /* 3つのボタンを均等な幅にする */
    background-color: transparent; /* 透明 */
    border: none;
    cursor: pointer;
    /* タップしたかわかるように少しだけハイライト（お好みで削除可） */
    transition: background-color 0.2s;
    border-radius: 5px;
}

/* ホバー時やタップ時に薄く白く光らせる（操作感のため） */
.v-zone:hover, .v-zone:active {
    background-color: rgba(255, 255, 255, 0.3);
}

/* スマホ用の微調整 */
@media screen and (max-width: 768px) {
    .voice_unit {
        width: 45%; /* スマホでは少し大きめに表示 */
        top: 30%;
        left: 2%;
    }
}

/* --- ZOOMボタンの配置 --- */
.zoom_btn_container {
    display: none;
    position: absolute;
    /* デザイン画像の位置に合わせて調整 */
    top: 54%; 
    right: 1.5%; 
    width: 13%; /* ボタンの大きさ */
    z-index: 20;
    cursor: pointer;
    transition: transform 0.2s;
}
.zoom_btn_container:hover {
    transform: scale(1.1); /* ホバー時に少し大きくなる */
}
.zoom_btn_container img {
    width: 100%;
    display: block;
    /* ドロップシャドウをつけると浮いて見えて押しやすくなります（お好みで） */
    filter: drop-shadow(0px 2px 3px rgba(0,0,0,0.2));
}

/* --- スマホ時のZOOMボタン調整 --- */
@media screen and (max-width: 768px) {
    .zoom_btn_container {
        width: 13%; /* スマホでは指で押しやすいように少し大きく */
        top: 54%;
        right: 2%;
    }
}

/* --- ポップアップ（モーダル）全体のスタイル --- */
.popup_overlay {
    display: none; /* 初期状態は非表示 */
    position: fixed;
    z-index: 9999; /* 最前面 */
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.85); /* 背景を暗く */
    opacity: 0;
    transition: opacity 0.3s ease;
    justify-content: center;
    align-items: center;
    padding: 20px; /* 画面端の余白 */
    box-sizing: border-box;
}

/* 表示時のクラス */
.popup_overlay.show {
    display: flex;
    opacity: 1;
}

/* ポップアップの中身 */
.popup_content {
    position: relative;
    top: 20px;
    max-width: 90%;
    max-height: 90%;
    text-align: center;
    background: #fff;
}

/* 拡大画像の設定 */
.popup_content img {
    width: 90%;
    height: 90%;
    /* 画面の高さいっぱいに表示しつつ、横幅も画面に収める */
    max-height: 90vh; 
    max-width: 100%; 
    border-radius: 8px;
    box-shadow: 0 0 20px rgba(255, 255, 255, 0.2);
}

/* 閉じるボタン（×） */
.popup_close {
    position: absolute;
    top: -45px;
    right: -10px;
    color: #fff;
    font-size: 40px;
    font-weight: bold;
    cursor: pointer;
    line-height: 1;
    text-shadow: 0 0 5px rgba(0,0,0,0.5);
}

/* スマホの場合、閉じるボタンを少し内側に */
@media screen and (max-width: 768px) {
    .popup_close {
        top: -45px;
        right: 0;
    }
}







    

	#maincontents #sec05 .sec05rb51 {
		position: absolute;
        z-index: 800;
        top: -0.7%;
        right: -2.5%;
        width: 14vw;
    }
	#maincontents #sec05 .sec05rb51 img {
        width: 88%;
    }
	#maincontents #sec05 .sec05rb52 {
		position: absolute;
        z-index: 800;
        top: -3.4%;
        left: -7.1%;
        width: 17vw;
    }
	#maincontents #sec05 .sec05rb52 img {
        width: 88%;
    }

	#maincontents #sec05 {
		display: block;
		position: relative;
        z-index: 499;
        background: url(../images/sec05/bg.webp) no-repeat top center;
        background-image: url(../images/sec05/bg.webp);
        background-image: image-set(url(../images/sec05/bg.webp) 1x, url(../images/2x/sec05/bg@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/sec05/bg.webp) 1x, url(../images/2x/sec05/bg@2x.webp) 2x);
        background-size: 105%;
		overflow: hidden;
		max-width: 836px;
        height: 213vw;
	}
	#maincontents #sec05 .md {
        padding-top: 2.5%;
        padding-bottom: 4%;
        margin-top: 10%;
        /*
        */
    }
	#maincontents #sec05 .md img {
        width: 90%;
    }
	#maincontents #sec05 .story01 {
		position: relative;
		position: relative;
        margin-top: 10%;
        /*
        */
    }
	#maincontents #sec05 .story01 .you {
		position: absolute;
        z-index: 10;
        left: 0%;
        width: 37%;
    }
	#maincontents #sec05 .story01 .capt01 {
		position: absolute;
        z-index: 11;
        right: 3%;
        width: 60%;
    }
	#maincontents #sec05 .story01 .txt01 {
		position: absolute;
        z-index: 11;
        right: 3%;
        width: 56%;
        padding-top: 9%;
        filter: blur(5px); /* ぼかしの強さを指定 */
        transition: filter 2s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec05 .story01 .txt01.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec05 .story02 {
		position: relative;
        margin-top: 65%;
        /*
        */
    }
	#maincontents #sec05 .story02 .capt02 {
		position: absolute;
        z-index: 11;
        left: 3%;
        width: 57%;
    }
	#maincontents #sec05 .story02 .txt02 {
		position: absolute;
        z-index: 11;
        left: 3%;
        width: 56%;
        padding-top: 19%;
        filter: blur(5px); /* ぼかしの強さを指定 */
        transition: filter 2s ease; /* アニメーションの速度や変化の仕方を調整 */
    }
    #maincontents #sec05 .story02 .txt02.aos-animate {
        filter: blur(0px);
    }
	#maincontents #sec05 .story02 .apartment {
		position: absolute;
        z-index: 10;
        right: -6.3vw;
        width: 44%;
    }
	#maincontents #sec05 .story03 {
		position: relative;
        margin-top: 58%;
        /*
        */
    }
	#maincontents #sec05 .story03 .txt03 {
		position: relative;
        z-index: 11;
        width: 86%;
        padding-top: 65%;
    }

    
	#maincontents .sec06rb61 {
		position: absolute;
        z-index: 800;
        top: 2105.2vw;
        left: -12.0%;
        width: 23vw;
    }
	#maincontents .sec06rb61 img {
        width: 88%;
    }
	#maincontents .sec06rb62 {
		position: absolute;
        z-index: 800;
        top: 2115.2vw;
        right: -5.4%;
        width: 17vw;
    }
	#maincontents .sec06rb62 img {
        width: 88%;
    }


	#maincontents #sec06 {
		display: block;
		position: relative;
        background-size: 100%;
		overflow: hidden;
		max-width: 836px;
        height: 150vw;
	}
	#maincontents #sec06 .ai {
		position: relative;
        margin-top: 0%;
        /*
        */
    }
	#maincontents #sec06 .ai img {
        width: 45%;
    }
	#maincontents #sec06 .md {
        padding-top: 1.5%;
        margin-top: 0%;
        /*
        */
    }
	#maincontents #sec06 .md img {
        width: 55%;
    }
	#maincontents #sec06 .lef {
		position: relative;
        z-index: 20;
        margin-top: 10%;
        right: -44vw;
        transform-origin: right bottom;
    }
    [data-aos=lef]{ transform:rotate(60deg) }
    [data-aos=lef].aos-animate{ transform:rotate(-7deg) }

	#maincontents #sec06 .lef img {
        width: 45%;
        height: auto;
    }
	#maincontents #sec06 .framebox {
		position: absolute;
        z-index: 20;
        background: #ffffff;
        top: 60vw;
        left: 3%;
        width: 65%;
        height: 80vw;
        border: 2px solid #222222;
        border-radius: 15px;
        overflow-y: scroll;
        -ms-overflow-style: none; /*IE(Internet Explorer)・Microsoft Edgeへの対応*/
        scrollbar-width: none; /*Firefoxへの対応*/
    }
     /*Google Chrome、Safariへの対応*/
    #maincontents #sec06 .framebox::-webkit-scrollbar {
		display: none;
    }
	#maincontents #sec06 .framebox p {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        font-weight: 800;
		font-size: 46px;
		letter-spacing: 0.64px;
		line-height: 2.0em;
    }
	#maincontents #sec06 .framebox img {
        width: 100%;
        height: auto;
    }

	#maincontents #sec06 .framebox .exbox{
		position: absolute;
        z-index: 20;
        background: #ffffff;
        width: 100%;
        height: 450px;
        padding: 2.5%;
    }
	#maincontents #sec06 .framebox .ex01{
		position: relative;
        z-index: 20;
        background: url(../images/sec06/ex01bg.webp) no-repeat top center;
        background-size: cover;
        border: 1px solid #ffffff;
        border-radius: 15px;
        width: 99%;
        height: auto;
        padding: 0%;
        margin-bottom: 1.5vw
    }
    #maincontents #sec06 .framebox .ex01 .title {
        padding: 4% 4% 2% 2%;
        width: 95%;
    }
    #maincontents #sec06 .framebox .ex01 .txt {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        padding: 4% 4% 5% 7%;
        text-align: left;
        font-weight: 800;
		font-size: 2.88vw;
		letter-spacing: 1.64px;
		line-height: 1.5em;
    }
	#maincontents #sec06 .framebox .ex02{
		position: relative;
        z-index: 20;
        background: url(../images/sec06/ex02bg.webp) no-repeat top center;
        background-size: cover;
        border: 1px solid #ffffff;
        border-radius: 15px;
        width: 99%;
        height: auto;
        padding: 0%;
        margin-bottom: 1.5vw
    }
    #maincontents #sec06 .framebox .ex02 .title {
        padding: 4% 4% 2% 2%;
        width: 95%;
    }
    #maincontents #sec06 .framebox .ex02 .txt {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        padding: 4% 4% 5% 7%;
        text-align: left;
        font-weight: 800;
		font-size: 2.88vw;
		letter-spacing: 1.64px;
		line-height: 1.5em;
    }
	#maincontents #sec06 .framebox .ex03{
		position: relative;
        z-index: 20;
        background: url(../images/sec06/ex03bg.webp) no-repeat top center;
        background-size: cover;
        border: 1px solid #ffffff;
        border-radius: 15px;
        width: 99%;
        height: auto;
        padding: 0%;
        margin-bottom: 1.5vw
    }
    #maincontents #sec06 .framebox .ex03 .title {
        padding: 4% 4% 2% 2%;
        width: 95%;
    }
    #maincontents #sec06 .framebox .ex03 .txt {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        padding: 4% 4% 5% 7%;
        text-align: left;
        font-weight: 800;
		font-size: 2.88vw;
		letter-spacing: 1.64px;
		line-height: 1.5em;
    }
	#maincontents #sec06 .framebox .ex04{
		position: relative;
        z-index: 20;
        background: url(../images/sec06/ex04bg.webp) no-repeat top center;
        background-size: cover;
        border: 1px solid #ffffff;
        border-radius: 15px;
        width: 99%;
        height: auto;
        padding: 0%;
        margin-bottom: 1.5vw
    }
    #maincontents #sec06 .framebox .ex04 .title {
        padding: 4% 4% 2% 0%;
        width: 95%;
    }
    #maincontents #sec06 .framebox .ex04 .txt {
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        padding: 4% 4% 6% 7%;
        text-align: left;
        font-weight: 800;
		font-size: 2.88vw;
		letter-spacing: 1.64px;
		line-height: 1.5em;
    }





	#maincontents #foot {
		display: block;
		position: relative;
        z-index: 499;
        background-color: #ebc84a;
        background-size: 100%;
		overflow: hidden;
		max-width: 836px;
        height: 92vw;
        height: 100%;
        padding-bottom: 30.0vw;
    }
	#maincontents #foot .icon {
		position: relative;
		z-index: 5;
        top: 5.0%;
        margin: 0 auto;
		width: 35%;
        padding-top: 7.1%;
    }
	#maincontents #foot .icon img {
        width: 100%;
    }
    #maincontents #foot .foot__spec {
		position: relative;
		z-index: 4;
        text-align: center;
        padding-top: 3%;
        padding-bottom: 3%;
        margin-top: 7%;
		width: 97%;
        height: 13.6805555556vw;
        height: auto;
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        top: 0.1vw;
		font-family: 'M PLUS 3p', sans-serif;
		color: #846a5c;
        font-weight: 800;
		font-size: 0.6em;
		letter-spacing: 0.64px;
		line-height: 1.6em;
    }
    #maincontents #foot .foot__spec dl {
	    float: left;
	    padding-right: 2px;
	    text-align: center;
    }

    #maincontents #foot .foot__spec dt {
	    float: left;
	    clear: left;
	    width: 33%;
	    height: 1em;
        height: auto;
        margin-right: 2%;
        padding-top: 1%;
        padding-bottom: 1%;
	    font-weight: bold;
        text-align: right;
    }

    #maincontents #foot .foot__spec dd {
	    margin-left: 0px;
	    width: 62%;
	    height: 1em;
        height: auto;
        margin-right: 2%;
        padding-top: 1%;
        padding-bottom: 1%;
	    font-weight: 100;
        text-align: left;
    }
    #maincontents #foot .foot__spec dd span {
		font-size: 0.5em;
    }
    
    
	#maincontents #foot .foot__btn {
		z-index: 4;
		position: relative;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        top: 1%;
        padding-bottom: 1%;
		width: 77%;
        height: 30.5805555556vw;
        /*
        max-height: 95px;
        */
        margin: 0 auto;
	}
	#maincontents #foot .foot__btn ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 5.0%;
        margin: 0vw auto;
		width: 100%;
        height: 12.5805555556vw;
        max-height: 95px;
	}
	#maincontents #foot .foot__btn ul li {
        margin-left: 5px;
        margin-right: 5px;
        margin-bottom: 5px;
        width: 44%;
        height: 12.5805555556vw;
        padding: 5px;
    }
	#maincontents #foot .foot__btn ul img {
        width: auto;
        height: 10.5805555556vw;
        max-height: 95px;
        /*
        */
	}
	#maincontents #foot .foot__links {
		z-index: 4;
		position: relative;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-color: #5f473a;
        top: 13%;
        bottom: 0;
		width: 100%;
        height: 14.5805555556vw;
        min-height: 110px;
        margin: 1vw auto 0 auto;
		font-family: 'M PLUS 1p', sans-serif;
		color: #ffffff;
	}
	#maincontents #foot .foot__links ul {
		z-index: 4;
		position: absolute;
		display: flex;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        background-size: cover;
        top: 0.0%;
        margin: 0 auto;
		width: 90%;
        height: 100%;
	}
	#maincontents #foot .foot__links ul li {
        margin-left: 5px;
        margin-right: 5px;
        margin-bottom: 10px;
        padding: 15px 5px;
        width: 47%;
        height: 100%;
        letter-spacing: 1.0px;
		font-size: 0.8em;
        padding-bottom: 10vw;
    }
    #maincontents #foot .foot__links .foot__atten {
        padding-top: 40px;
        width: 95vw;
    }
	#maincontents #foot .foot__links .txt {
		position: relative;
        padding-top: 5px;
		width: 95%;
		font-size: 0.6em;
    }

	#maincontents #foot .foot__copy {
		z-index: 4;
		position: relative;
        text-align: center;
        background-color: #000;
        top: 15%;
        bottom: 0;
		width: 100%;
        height: auto;
        margin: 0vw auto 0 auto;
		font-family: 'M PLUS 1p', sans-serif;
		color: #ffffff;
        letter-spacing: 1.0px;
		font-size: 0.6em;
	}
	#maincontents #foot .foot__copy .copy {
		position: relative;
        padding-top: 1.5vw;
        padding-bottom: 1.5vw;
		width: 70%;
    }

}





@media (max-height: 880px) {
    #pc_dis.pc_dis_left {
		/*height: 93lvh;
		min-height: 550px;*/
        height: calc(100vh - 72px);
		position: fixed;
		right: auto;
		top: 0;
		bottom: 0;
		margin: auto 0;
		transition: left .3s ease-in-out;
		margin: 56px 0 16px 16px;
        background: url(../images/fv/kvpc.webp) no-repeat center 20%;
        background-image: url(../images/fv/kvpc.webp);
        background-image: image-set(url(../images/fv/kvpc.webp) 1x, url(../images/2x/fv/kvpc@2x.webp) 2x);
        background-image: -webkit-image-set(url(../images/fv/kvpc.webp) 1x, url(../images/2x/fv/kvpc@2x.webp) 2x);
        background-size: cover;
	}
    
	#pc_dis.pc_dis_left .fv_con .capt02 {
		position: absolute;
		left: 0;
		right: 2.5vw;
		top: 2vw;
		bottom: 0;
		margin: auto;
		left: auto;
		z-index: 3;
		width: 3.5vw;
    }
	#pc_dis.pc_dis_left .fv_con .capt03 {
        display: block;
		pointer-events: none;
		position: absolute;
		left: 1.5vw;
		/*
		right: 0;
        padding-top: 60%;
		bottom: 10vw;
        */
        top: 10vw;
		margin: auto;
		z-index: 3;
		width: 3.5vw;
    }
    

	#pc_dis02.pc_dis_right .rightmenu_con_ul_li {
		position: relative;
		margin-bottom: 5px;
		cursor: pointer;
		transition: all .6s cubic-bezier(0.22, 1, 0.36, 1);
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li::before {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		margin: auto;
		top: auto;
		bottom: 0;
		display: block;
		width: 100%;
		height: 1px;
		pointer-events: none;
		background-color: #f3c200;
		z-index: 0;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li_a {
		display: inline-block;
		margin-bottom: 0px;
        padding-top: 1.5vw;
        padding-bottom: 1.5vw;
        padding-left: 30px;
		overflow: visible;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li_a .rmenu span {
		display: block;
		margin-right: 20px;
        margin-top: 7px;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li_a .rmenu span img {
		width: 15px;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_logo {
		width: 320px;
		margin: 0 auto 40px;
        padding-left: 30px;
	}
    
	#pc_dis02.pc_dis_right .frame01 {
		position: absolute;
        top: 10px;
	}
	#pc_dis02.pc_dis_right .frame01 img {
		width: 95%;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_logo {
		width: 225px;
		margin: 0 auto 5px;
        padding-left: 30px;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li_a {
		display: inline-block;
		margin-bottom: 0px;
        padding-top: 0.3vw;
        padding-bottom: 0.3vw;
        padding-left: 20px;
		overflow: visible;
	}
	#pc_dis02.pc_dis_right .rightmenu_con_ul_li_a .rmenu {
		margin-bottom: 1px;
	}

	#pc_dis02.pc_dis_right .rightmenu_con_ul_li_a .rmenu p {
		font-family: 'M PLUS 2p', sans-serif;
		color: #846a5c;
        font-weight: 800;
		font-size: 0.7em;
		letter-spacing: 0.44em;
		line-height: 0.9em;
	}



}




/* お問い合わせポップアップ用CSS */
.modal-overlay {
  display: none; /* 最初は非表示 */
  position: fixed;
  z-index: 9999; /* 最前面に表示 */
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6); /* 背景：暗めの透過 */
}

.modal-content {
  background-color: #fff; /* コンテンツ背景：白 */
  margin: 10% auto; /* 画面中央寄りに配置 */
  padding: 3vw;
  border-radius: 10px; /* 角丸 */
  width: 90%;
  max-width: 800px; /* 最大幅 */
  position: relative;
  box-shadow: 0 4px 8px rgba(0,0,0,0.2);
  /* 名前を modalFadeIn に変更して衝突を回避 */
  animation: modalFadeIn 0.3s; 
}

/* 閉じるボタン（×） */
.close-modal {
    position: absolute;
    top: -75px;         /* ボタンが大きくなった分、位置を少し上に調整 */
    right: 0;
    color: #fff;
    font-size: 80px;    /* 40px → 60px に変更（大きく） */
    font-weight: 100;   /* normal → 100 に変更（極細） */
    font-family: "Helvetica Neue", Arial, sans-serif; /* 細い線が綺麗に出るフォントを指定 */
    cursor: pointer;
    line-height: 1;
    text-decoration: none;
    text-shadow: 0 0 5px rgba(0,0,0,0.5);
  }
  
  .close-modal:hover,
  .close-modal:focus {
    color: #ddd; /* ホバー時は少しグレーに */
    text-decoration: none;
    cursor: pointer;
  }

/* ポップアップ内のテキストスタイル */
.modal-body h3 {
  margin-top: 0;
  color: #333;
  border-bottom: 2px solid #ff99cc; /* サイトの雰囲気に合わせたピンクの下線 */
  padding-bottom: 10px;
  margin-bottom: 20px;
  font-family: "M PLUS 1p", sans-serif;
}

.modal-body p {
  color: #333;
  line-height: 2.1em;
  font-size: 1.2em;
}
.modal-body p a {
    text-decoration: underline;
}
.modal-body p.tomail {
  color: #333;
  line-height: 2.6em;
  font-size: 2.2em;
}
.modal-body p.sma {
  color: #333;
  line-height: 1.5em;
  font-size: 1.0em;
}

/* アニメーション定義（名前を変更：modalFadeIn） */
@keyframes modalFadeIn {
  from {opacity: 0; transform: translateY(-20px);}
  to {opacity: 1; transform: translateY(0);}
}





@media screen and (max-width: 530px){

/* お問い合わせポップアップ用CSS */
.modal-overlay {
  display: none; /* 最初は非表示 */
  position: fixed;
  z-index: 9999; /* 最前面に表示 */
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6); /* 背景：暗めの透過 */
}

.modal-content {
  background-color: #fff; /* コンテンツ背景：白 */
  margin: 20% auto 10% auto; /* 画面中央寄りに配置 */
  padding: 10vw;
  border-radius: 10px; /* 角丸 */
  width: 90%;
  max-width: 800px; /* 最大幅 */
  position: relative;
  box-shadow: 0 4px 8px rgba(0,0,0,0.2);
  /* 名前を modalFadeIn に変更して衝突を回避 */
  animation: modalFadeIn 0.3s; 
}

/* 閉じるボタン（×） */
.close-modal {
    position: absolute;
    top: -75px;         /* ボタンが大きくなった分、位置を少し上に調整 */
    right: 0;
    color: #fff;
    font-size: 80px;    /* 40px → 60px に変更（大きく） */
    font-weight: 100;   /* normal → 100 に変更（極細） */
    font-family: "Helvetica Neue", Arial, sans-serif; /* 細い線が綺麗に出るフォントを指定 */
    cursor: pointer;
    line-height: 1;
    text-decoration: none;
    text-shadow: 0 0 5px rgba(0,0,0,0.5);
  }
  
  .close-modal:hover,
  .close-modal:focus {
    color: #ddd; /* ホバー時は少しグレーに */
    text-decoration: none;
    cursor: pointer;
  }

/* ポップアップ内のテキストスタイル */
.modal-body h3 {
  margin-top: 0;
  color: #333;
  border-bottom: 2px solid #ff99cc; /* サイトの雰囲気に合わせたピンクの下線 */
  padding-bottom: 10px;
  margin-bottom: 20px;
  font-family: "M PLUS 1p", sans-serif;
}

.modal-body p {
  color: #333;
  line-height: 2.1em;
  font-size: 0.8em;
}
.modal-body p a {
    text-decoration: underline;
}
.modal-body p.tomail {
  color: #333;
  line-height: 2.6em;
  font-size: 1.8em;
}
.modal-body p.sma {
  color: #333;
  line-height: 1.5em;
  font-size: 0.7em;
}

/* アニメーション定義（名前を変更：modalFadeIn） */
@keyframes modalFadeIn {
  from {opacity: 0; transform: translateY(-20px);}
  to {opacity: 1; transform: translateY(0);}
}

}