@charset "utf-8";

body{
width: 100%;
max-width: 1280px;
margin: auto;
}

.main {
margin-top: auto;
margin-left: auto;
margin-right: auto;
width: auto;
height: auto;
text-align: center;
}

/* 共通要素 */
.menu-container {
position: relative;
width: 1280px;
height: 120px;
display: inline-block;
}

.top_border {
position: absolute;
top: 0px;
left: 0px;
width: 1280px;
height: 30px;
}

.menu_top {
position: absolute;
top: 30px;
left: 0px;
width: 260px;
height: 80px;
}

.menu_world {
position: absolute;
top: 30px;
left: 260px;
width: 170px;
height: 80px;
}

.menu_chara {
position: absolute;
top: 30px;
left: 430px;
width: 170px;
height: 80px;
}

.menu_gallery {
position: absolute;
top: 30px;
left: 600px;
width: 170px;
height: 80px;
}

.menu_dl {
position: absolute;
top: 30px;
left: 770px;
width: 170px;
height: 80px;
}

.menu_shop {
position: absolute;
top: 30px;
left: 940px;
width: 170px;
height: 80px;
}

.menu_event {
position: absolute;
top: 30px;
left: 1110px;
width: 170px;
height: 80px;
}

.header_index-container {
position: relative;
margin-top: -17px;
width: 1280px;
height: 200px;
display: inline-block;
}

.header_index {
position: absolute;
top: 0px;
left: 0px;
width: 1280px;
height: 200px;
}

.header_index_title {
position: absolute;
top: 110px;
left: 35px;
}

.header_deco-container {
position: relative;
margin-top: 0px;
width: 1280px;
height: 246px;
display: inline-block;
}

.header_deco {
position: absolute;
top: -7px;
left: 0px;
width: 1280px;
height: 246px;
}

.footer_deco-container {
position: relative;
margin-top: 0px;
width: 1280px;
height: 317px;
display: inline-block;
}

.footer_deco {
position: absolute;
top: 8px;
left: 0px;
width: 1280px;
height: 317px;
}

.footer-container {
position: relative;
margin-top: 0px;
width: 1280px;
height: 400px;
display: inline-block;
}

.footer {
position: absolute;
top: 0px;
left: 0px;
width: 1280px;
height: 400px;
}

.triangle_logo {
position: absolute;
top: 200px;
left: 526px;
width: 228px;
height: 128px;
}

/* トップページ */
.mv-container {
position: relative;
width: 1280px;
height: 1530px;
display: inline-block;
}

.mv-border {
position: absolute;
top: 0px;
left: 0px;
width: 1280px;
height: 30px;
}

.mv {
position: absolute;
top: 30px;
left: 0px;
width: 1280px;
height: 1500px;
}

.mv_logo {
position: absolute;
top: 10px;
left: 98px;
width: 1084px;
height: 633px;
}

.mv_release {
position: absolute;
top: 580px;
left: 379px;
width: 522px;
height: 150px;
}

.dl_release {
position: absolute;
top: 1150px;
right: 25px;
width: 492px;
height: 50px;
}

.dl_fanza {
position: absolute;
top: 1070px;
right: 265px;
width: 226px;
height: 63px;
transition: filter 0.5s, transform 0.5s;
}

.dl_fanza:hover {
filter: brightness(1.2);
transform: scale(1.1);
}

.dl_dlsite {
position: absolute;
top: 1070px;
right: 35px;
width: 206px;
height: 63px;
transition: filter 0.5s, transform 0.5s;
}

.dl_dlsite:hover {
filter: brightness(1.2);
transform: scale(1.1);
}

.mv_deco {
position: absolute;
top: 29px;
left: 0px;
width: 1280px;
height: 246px;
}

.mv_topic01 {
position: absolute;
top: 1260px;
left: 400px;
width: 314.55px;
height: 243.64px;
transition: filter 0.5s, transform 0.5s;
}

.mv_topic01:hover {
filter: brightness(1.2);
transform: scale(1.1);
}

.mv_topic02 {
position: absolute;
top: 1240px;
left: 30px;
width: 332px;
height: 253px;
transition: filter 0.5s, transform 0.5s;
}

.mv_topic02:hover {
filter: brightness(1.2);
transform: scale(1.1);
}

.masterup {
position: absolute;
top: 1020px;
left: 50px;
width: 210px;
height: 189px;
transition: filter 0.5s, transform 0.5s;
}

.masterup:hover {
filter: brightness(1.2);
transform: scale(1.1);
}

.youtube {
position: absolute;
top: 1230px;
left: 780px;
box-shadow: 2px 2px 5px 0px #362e2b;
}

.topic-container {
position: relative;
margin-top: 30px;
width: 1280px;
height: 500px;
display: inline-block;
}

.topic_base {
position: absolute;
top: 0px;
left: 0px;
width: 1280px;
height: 500px;
}

.topic_text {
position: absolute;
top: 280px;
left: 25px;
width: 768px;
height: 199px;
}

.copy-container {
position: relative;
margin-top: 30px;
width: 1280px;
display: inline-block;
}

.copy {
position: absolute;
top: 0px;
left: 99px;
width: 1082px;
height: 56px;
}

.series-container {
position: relative;
margin-top: 85px;
width: 1280px;
height: 770px;
display: inline-block;
}

.series_bg {
position: absolute;
top: 0px;
left: 0px;
width: 1280px;
height: 770px;
}

.series_01_bg {
position: absolute;
top: 70px;
left: calc((1280px - (400px * 3)) / 4);
width: 400px;
height: 675px;
}

.series_01_mv {
position: absolute;
top: 134px;
left: 46px;
width: 350px;
height: 450px;
box-shadow: 2px 2px 5px 0px #362e2b;
transition-property: opacity;
transition-duration: 0.5s;
}

.series_01_mv:hover {
opacity: 0.5;
}

.series_01_fanza {
position: absolute;
top: 670px;
left: 46px;
width: 175px;
height: 60px;
}

.series_01_dlsite {
position: absolute;
top: 670px;
left: 221px;
width: 175px;
height: 60px;
}

.series_02_bg {
position: absolute;
top: 70px;
left: calc(((1280px - (400px * 3)) / 4) * 2 + 400px);
width: 400px;
height: 675px;
}

.series_02_mv {
position: absolute;
top: 134px;
left: 465px;
width: 350px;
height: 450px;
box-shadow: 2px 2px 5px 0px #362e2b;
transition-property: opacity;
transition-duration: 0.5s;
}

.series_02_mv:hover {
opacity: 0.5;
}

.series_02_fanza {
position: absolute;
top: 670px;
left: 465px;
width: 175px;
height: 60px;
}

.series_02_dlsite {
position: absolute;
top: 670px;
left: 640px;
width: 175px;
height: 60px;
}

.series_03_bg {
position: absolute;
top: 70px;
left: calc(((1280px - (400px * 3)) / 4) * 3 + 800px);
width: 400px;
height: 675px;
}

.series_03_mv {
position: absolute;
top: 134px;
left: 885px;
width: 350px;
height: 450px;
box-shadow: 2px 2px 5px 0px #362e2b;
transition-property: opacity;
transition-duration: 0.5s;
}

.series_03_mv:hover {
opacity: 0.5;
}

.series_03_fanza {
position: absolute;
top: 670px;
left: 885px;
width: 175px;
height: 60px;
}

.series_03_dlsite {
position: absolute;
top: 670px;
left: 1060px;
width: 175px;
height: 60px;
}

.log_title-container {
position: relative;
margin-top: 50px;
width: 1280px;
display: inline-block;
}

.log_title {
position: absolute;
top: 0px;
left: 472.5px;
width: 335px;
height: 22px;
}

.log-container {
position: relative;
margin-top: 25px;
width: 1280px;
height: 322px;
display: inline-block;
}

.log-base {
position: absolute;
top: 0px;
left: 0px;
width: 1280px;
height: 300px;
}

.log_deco {
position: absolute;
top: 16px;
left: 1150px;
width: 60px;
height: 268px;
}

.update_log {
position: absolute;
border: solid 3px #ffffff00;
background-color: #ffffff;
top: 16px;
left: 175px;
width: 930px;
height: 265px;
box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.274) inset;
}

.font_01 {
height: 0px;
width: 680px;
margin: 30px 0px -39px 45px;
color: #000000;
font-size: 26px;
text-shadow: 1px 1px 2px pink;
}

.font_02 {
color: #FF3399;
font-size: 27px;
margin: -6px 0px 0px 44px;
font-family: sans-serif;
text-shadow: 2px 2px 2px pink;
}

.font_03 {
margin: 45px 0px 0px 20px;
text-align: left;
color: #FF3399;
font-size: 26px;
text-shadow: 1px 1px 1px pink;
}

.font_line {
width: 750px;
height: 10px;
margin-left: 34px;
margin-top: -16px;
}

.product-container {
position: relative;
margin-top: 50px;
width: 1280px;
height: 1089px;
display: inline-block;
}

.product_bg {
position: absolute;
top: 380px;
left: 0px;
width: 1280px;
height: 720px;
}

.product_title {
position: absolute;
top: 0px;
left: 40px;
width: 1200px;
height: 29px;
}

.product_deco {
position: absolute;
top: 780px;
left: 0px;
width: 1280px;
height: 317px;
}

.product_staff_01 {
position: absolute;
top: 80px;
left: 440px;
width: 400px;
height: 60px;
}

.product_staff_02 {
position: absolute;
top: 180px;
left: 236px;
width: 808px;
height: 161px;
}

.product_spec_01 {
position: absolute;
top: 400px;
left: 440px;
width: 400px;
height: 60px;
}

.product_spec_02 {
position: absolute;
top: 500px;
left: 20px;
width: 1240px;
height: 435px;
}

.floating-button {
position: fixed;
bottom: 20px;
right: -150px;
width: 120px;
height: 260px;
transition: right 0.5s ease;
}

.floating-button img {
width: 100%;
height: 100%;
transition: opacity 0.3s;
}

.floating-button.visible {
right: 0px;
}

/* ワールドページ */
.story_title {
position: absolute;
top: 125px;
left: 517px;
}

.story_bg-container {
position: relative;
margin-top: 0px;
width: 1280px;
height: 1250px;
display: inline-block;
}

.story_bg {
position: absolute;
top: 0px;
left: 0px;
width: 1280px;
height: 1250px;
}

.rectangle {
position: absolute;
backdrop-filter: blur(4px);
top: 75px;
left: 40px;
width: 1200px;
height: 1100px;
background: rgba(255, 255, 255, 0.7);
box-shadow: 1px 1px 2px 0 rgb(0, 0, 0, 0.4);
border-radius: 20px;
}

.story_text {
position: absolute;
top: 158px;
left: 228px;
width: 824px;
height: 934px;
}

.keyword_title-container {
position: relative;
margin-top: 100px;
width: 1280px;
height: 70px;
display: inline-block;
}

.keyword_title {
position: absolute;
top: 0px;
left: 447px;
width: 386px;
height: 70px;
}

.keyword-container {
position: relative;
margin-top: 50px;
width: 1280px;
height: 1500px;
display: inline-block;
}

.keyword_bg_left {
position: absolute;
top: 0px;
left: 0px;
width: 788px;
height: 1534px;
}

.keyword_bg_right {
position: absolute;
top: 400px;
left: 600px;
width: 640px;
height: 1150px;
}

.keyword_text_01 {
position: absolute;
top: 0px;
left: 62px;
width: 1156px;
height: 552px;
}

.keyword_text_02 {
position: absolute;
top: 652px;
left: 62px;
width: 1120px;
height: 192px;
}

.keyword_text_03 {
position: absolute;
top: 952px;
left: 62px;
width: 996px;
height: 156px;
}

.keyword_text_04 {
position: absolute;
top: 1222px;
left: 62px;
width: 916px;
height: 192px;
}

/* キャラクターページ */
.character_title {
position: absolute;
top: 125px;
left: 517px;
}

.list-container {
position: relative;
margin-top: 0px;
width: 1280px;
height: 150px;
display: inline-block;
}

.list_icon_clair, .list_icon_escatol, .list_icon_noir {
position: absolute;
top: -40px;
width: 252px;
height: 92px;
box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.1);
}

.list_icon_clair {
left: calc((1280px - (252px * 3 + 15px * 2)) / 2);
}

.list_icon_escatol {
left: calc((1280px - (252px * 3 + 15px * 2)) / 2 + 252px + 15px);
}

.list_icon_noir {
left: calc((1280px - (252px * 3 + 15px * 2)) / 2 + (252px + 15px) * 2);
}

.list_icon_kalmia, .list_icon_clover, .list_icon_elimos, .list_icon_ferment {
position: absolute;
top: 65px;
width: 252px;
height: 92px;
box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.1)
}

.list_icon_kalmia {
left: calc((1280px - (252px * 4 + 15px * 3)) / 2);
}

.list_icon_clover {
left: calc((1280px - (252px * 4 + 15px * 3)) / 2 + 252px + 15px);
}

.list_icon_elimos {
left: calc((1280px - (252px * 4 + 15px * 3)) / 2 + (252px + 15px) * 2);
}

.list_icon_ferment {
left: calc((1280px - (252px * 4 + 15px * 3)) / 2 + (252px + 15px) * 3);
}

.chara_container {
position: relative;
margin-top: 15px;
width: 1200px;
height: 1000px;
display: inline-block;
}

.chara_img {
position: absolute;
top: 0px;
left: 40px;
width: 1200px;
height: 1000px;
}

.costume_img01 {
position: absolute;
top: 780px;
left: 780px;
width: 138px;
height: 188px;
}

.costume_img02 {
position: absolute;
top: 780px;
left: 915px;
width: 138px;
height: 188px;
}

.costume_img03 {
position: absolute;
top: 780px;
left: 1050px;
width: 138px;
height: 188px;
}

.voice_text {
position: absolute;
top: 800px;
left: 250px;
width: 228px;
height: 19px;
}

.voice_icon01 {
position: absolute;
top: 840px;
left: 80px;
width: 128px;
height: 125px;
filter: drop-shadow(0px 4px 4px #2d2c2c90);
}

.voice_icon02 {
position: absolute;
top: 840px;
left: 190px;
width: 128px;
height: 125px;
filter: drop-shadow(0px 4px 4px #2d2c2c90);
}

.voice_icon03 {
position: absolute;
top: 840px;
left: 300px;
width: 128px;
height: 125px;
filter: drop-shadow(0px 4px 4px #2d2c2c90);
}

.voice_icon04 {
position: absolute;
top: 840px;
left: 410px;
width: 128px;
height: 125px;
filter: drop-shadow(0px 4px 4px #2d2c2c90);
}

.voice_icon05 {
position: absolute;
top: 840px;
left: 520px;
width: 128px;
height: 125px;
filter: drop-shadow(0px 4px 4px #2d2c2c90);
}

/* ギャラリーページ */
.gallery_title {
position: absolute;
top: 123px;
left: 425px;
}

.cg-container {
position: relative;
margin-top: 0px;
width: 1280px;
height: 229px;
display: inline-block;
}

.cg_01, .cg_02, .cg_03 {
position: absolute;
top: 0px;
width: 404px;
height: 229px;
}

.cg_01 {
left: calc((1280px - (404px * 3 + 15px * 2)) / 2);
border: solid 2px #eb1282;
border-radius: 25px;
}

.cg_02 {
left: calc((1280px - (404px * 3 + 15px * 2)) / 2 + 404px + 15px);
border: solid 2px #eb1282;
border-radius: 25px;
}

.cg_03 {
left: calc((1280px - (404px * 3 + 15px * 2)) / 2 + (404px + 15px) * 2);
border: solid 2px #eb1282;
border-radius: 25px;
}

/* ダウンロードページ */
.download_title {
position: absolute;
top: 122px;
left: 400px;
}

.demo_bg-container {
position: relative;
margin-top: 0px;
width: 1280px;
height: 1025px;
display: inline-block;
}

.demo_bg {
position: absolute;
top: 0px;
left: 40px;
width: 1200px;
height: 1025px;
border-radius: 20px;
box-shadow: 0px 5px 15px 0 rgb(0, 0, 0, 0.4);
}

.demo_title {
position: absolute;
top: 40px;
left: 321.5px;
width: 637px;
height: 37px;
}

.demo_cg {
position: absolute;
top: 140px;
left: 160px;
width: 960px;
height: 540px;
border-radius: 20px;
box-shadow: 0px 5px 15px 0 rgb(0, 0, 0, 0.4);
}

.demo_text {
position: absolute;
top: 770px;
left: 170px;
width: 726px;
height: 56px;
}

.pv_bg-container {
position: relative;
margin-top: 50px;
width: 1280px;
height: 1000px;
display: inline-block;
}

.pv_bg {
position: absolute;
top: 0px;
left: 40px;
width: 1200px;
height: 1000px;
border-radius: 20px;
box-shadow: 0px 5px 15px 0 rgb(0, 0, 0, 0.4);
}

.pv_title {
position: absolute;
top: 40px;
left: 180px;
width: 920px;
height: 36px;
}

.pv_cg {
position: absolute;
top: 140px;
left: 160px;
width: 960px;
height: 540px;
}

.pv_cg_small {
position: absolute;
top: 680px;
width: 240px;
height: 135px;
}

#cg_s01 {
left: calc((1280px - (240px * 4)) / 2);
}

#cg_s02 {
left: calc((1280px - (240px * 4)) / 2 + 240px);
}

#cg_s03 {
left: calc((1280px - (240px * 4)) / 2 + 240px * 2);
}

#cg_s04 {
left: calc((1280px - (240px * 4)) / 2 + 240px * 3);
}

.song_bg-container {
position: relative;
margin-top: 50px;
width: 1280px;
height: 920px;
display: inline-block;
}

.song_bg {
position: absolute;
top: 0px;
left: 40px;
width: 1200px;
height: 920px;
border-radius: 20px;
box-shadow: 0px 5px 15px 0 rgb(0, 0, 0, 0.4);
}

.song_title {
position: absolute;
top: 40px;
left: 321.5px;
width: 637px;
height: 36px;
}

.song_title {
position: absolute;
top: 40px;
left: 321.5px;
width: 637px;
height: 36px;
}

.song_youtube {
position: absolute;
top: 140px;
left: 160px;
width: 960px;
height: 540px;
border-radius: 20px;
box-shadow: 0px 5px 15px 0 rgb(0, 0, 0, 0.4);
}

.song_text {
position: absolute;
top: 760px;
left: 180px;
width: 347px;
height: 109px;
}

.lyric_button {
position: absolute;
top: 765px;
left: 555px;
width: 83px;
height: 100px;
transition: filter 0.5s, transform 0.5s;
}

.lyric_button:hover {
filter: brightness(1.2);
transform: scale(1.1);
}

.rounded-box {
position: absolute;
top: 876px;
left: 441px;
width: 398px;
height: 73px;
background-color: white;
border-radius: 50px;
box-sizing: border-box;
}

.rounded-box2 {
position: absolute;
top: 885px;
left: 440px;
width: 398px;
height: 73px;
background-color: white;
border-radius: 50px;
box-sizing: border-box;
}

.rounded-box3 {
position: absolute;
top: 739px;
left: 721px;
width: 398px;
height: 73px;
background-color: white;
border-radius: 50px;
box-sizing: border-box;
}

.dl_button {
position: absolute;
top: 875px;
left: 440px;
width: 400px;
height: 75px;
border-radius: 50px;
box-shadow: 0px 5px 15px 0 rgb(0, 0, 0, 0.4);
transition-property: opacity;
transition-duration: 0.5s;
}

.dl_button:hover {
opacity: 0.5;
}

.dl_text {
position: absolute;
top: 960px;
left: 50%;
transform: translateX(-50%);
color: #d70159;
font-size: 18px;
text-shadow: 
-1px -1px 0 #fff,  
1px -1px 0 #fff,
-1px  1px 0 #fff,
1px  1px 0 #fff;
}

.dl_button2 {
position: absolute;
top: 885px;
left: 440px;
width: 400px;
height: 75px;
border-radius: 50px;
box-shadow: 0px 5px 15px 0 rgb(0, 0, 0, 0.4);
transition-property: opacity;
transition-duration: 0.5s;
}

.dl_button2:hover {
opacity: 0.5;
}

.dl_text2 {
position: absolute;
top: 975px;
left: 50%;
transform: translateX(-50%);
color: #d70159;
font-size: 18px;
text-shadow: 
-1px -1px 0 #fff,  
1px -1px 0 #fff,
-1px  1px 0 #fff,
1px  1px 0 #fff;
}

.dl_button3 {
position: absolute;
top: 738px;
left: 720px;
width: 400px;
height: 75px;
border-radius: 50px;
box-shadow: 0px 5px 15px 0 rgb(0, 0, 0, 0.4);
transition-property: opacity;
transition-duration: 0.5s;
}

.dl_button3:hover {
opacity: 0.5;
}

.dl_text3 {
position: absolute;
top: 830px;
left: 780px;
color: #d70159;
font-size: 18px;
text-shadow: 
-1px -1px 0 #fff,  
1px -1px 0 #fff,
-1px  1px 0 #fff,
1px  1px 0 #fff;
}

.dl_text3b {
position: absolute;
top: 860px;
left: 710px;
color: #d70159;
font-size: 18px;
text-shadow: 
-1px -1px 0 #fff,  
1px -1px 0 #fff,
-1px  1px 0 #fff,
1px  1px 0 #fff;
}

.talk_bg-container {
position: relative;
margin-top: 50px;
width: 1280px;
height: 650px;
display: inline-block;
}

.talk_bg {
position: absolute;
top: 0px;
left: 40px;
width: 1200px;
height: 650px;
}

.talk_title {
position: absolute;
top: 40px;
left: 457px;
width: 366px;
height: 35px;
}

.talk_base-container {
position: relative;
margin-top: 20px;
width: 1280px;
height: 150px;
display: inline-block;
}

.talk_base_L, .talk_base_R {
position: absolute;
top: 100px;
width: 525px;
height: 150px;
}

.talk_base_L {
left: calc((1280px - (525px * 2 + 35px)) / 2);
}

.talk_base_R {
left: calc((1280px - (525px * 2 + 35px)) / 2 + 525px + 35px);
}

.talk_base {
width: 525px;
height: 150px;
border-radius: 20px;
box-shadow: 0px 5px 15px 0 rgb(0, 0, 0, 0.4);
}

.talk_button01 {
position: absolute;
top: 10px;
left: 310px;
width: 201px;
height: 61px;
z-index: 10;
transition: filter 0.5s, transform 0.5s;
}

.talk_button01:hover {
filter: brightness(1.2);
transform: scale(1.1);
}

.talk_button02 {
position: absolute;
bottom: 10px;
left: 310px;
width: 201px;
height: 61px;
z-index: 10;
transition: filter 0.5s, transform 0.5s;
}

.talk_button02:hover {
filter: brightness(1.2);
transform: scale(1.1);
}

.line {
margin-top: 50px;
width: 1280px;
height: 9px;
}

/* 店舗特典ページ */
.shop_main_title {
position: absolute;
top: 125px;
left: 517px;
}

.shop_list-container {
position: relative;
margin-top: 0px;
width: 1280px;
height: 85px;
display: inline-block;
}

.shop_list01, .shop_list02, .shop_list03 {
position: absolute;
top: 0px;
width: 350px;
height: 85px;
}

.shop_list01 {
left: calc((1280px - (350px * 3 + 15px * 2)) / 2);
transition-property: opacity;
transition-duration: 0.5s;
}

.shop_list01:hover {
opacity: 0.5;
}

.shop_list02 {
left: calc((1280px - (350px * 3 + 15px * 2)) / 2 + 350px + 15px);
transition-property: opacity;
transition-duration: 0.5s;
}

.shop_list02:hover {
opacity: 0.5;
}

.shop_list03 {
left: calc((1280px - (350px * 3 + 15px * 2)) / 2 + (350px + 15px) * 2);
transition-property: opacity;
transition-duration: 0.5s;
}

.shop_list03:hover {
opacity: 0.5;
}

.pre_order_title-container {
position: relative;
margin-top: 50px;
width: 1280px;
height: 95px;
display: inline-block;
}

.pre_order_title {
position: absolute;
top: 0px;
left: 201.5px;
width: 877px;
height: 95px;
}

.pre_order-contents01 {
position: relative;
margin-top: 30px;
width: 1280px;
height: 400px;
display: inline-block;
}

.shop_bg01 {
position: absolute;
top: 0px;
left: 40px;
width: 1200px;
height: 400px;
border-radius: 20px;
box-shadow: 0px 5px 15px 0 rgb(0, 0, 0, 0.4);
}

.shop_cg {
position: absolute;
top: 75.5px;
left: 70px;
width: 439px;
height: 249px;
}

.shop_cg02 {
position: absolute;
top: 200px;
left: 70px;
width: 439px;
height: 249px;
}

.shop_text01 {
position: absolute;
top: 50%;
left: 540px;
transform: translateY(-50%);
}

.pre_order-contents02 {
position: relative;
margin-top: 30px;
width: 1280px;
height: 700px;
display: inline-block;
}

.shop_bg02 {
position: absolute;
top: 0px;
left: 40px;
width: 1200px;
height: 700px;
border-radius: 20px;
box-shadow: 0px 5px 15px 0 rgb(0, 0, 0, 0.4);
}

.pre_order02_title {
position: absolute;
top: 50px;
left: 141px;
width: 998px;
height: 33px;
}

.pre_order02_index01 {
position: absolute;
top: 120px;
left: 82px;
width: 881px;
height: 68px;
}

.pre_order02_text {
position: absolute;
top: 220px;
left: 540px;
width: 663px;
height: 203px;
}

.pre_order02_index02 {
position: absolute;
top: 480px;
left: 82px;
width: 871px;
height: 115px;
}

.pre_order02_item {
position: absolute;
top: 430px;
left: 900px;
width: 332px;
height: 266px;
}

.pre_order02_info {
position: absolute;
top: 620px;
left: 82px;
width: 767px;
height: 60px;
}

.shop_text02 {
position: absolute;
top: 21px;
left: 50%;
transform: translateX(-50%);
}

.shop_base-container01 {
position: relative;
margin-top: 50px;
width: 1280px;
height: 1050px;
display: inline-block;
}

.shop_base01 {
position: absolute;
top: 0px;
left: 0px;
width: 1280px;
height: 1050px;
}

.shop_title {
position: absolute;
top: 40px;
left: 50%;
transform: translateX(-50%);
}

.shop_bg03 {
position: absolute;
top: 180px;
left: 40px;
width: 1200px;
height: 700px;
border-radius: 20px;
box-shadow: 0px 5px 15px 0 rgb(0, 0, 0, 0.4);
}

.dlc_cg01 {
position: absolute;
top: 260px;
left: 70px;
width: 439px;
height: 249px;
}

.dlc_cg02 {
position: absolute;
top: 550px;
left: 70px;
width: 439px;
height: 249px;
}

.shop_text03 {
position: absolute;
top: 550px;
left: 70px;
}

.shop_text04 {
position: absolute;
top: 480px;
left: 807px;
}

.tapestry_cg {
position: absolute;
top: 260px;
left: 850px;
width: 354px;
height: 574px;
}

.shop_button {
position: absolute;
bottom: 40px;
left: 50%;
transform: translateX(-50%);
border-radius: 20px;
box-shadow: 0px 5px 15px 0 rgb(0, 0, 0, 0.4);
}

.shop_button_L, .shop_button_R {
position: absolute;
bottom: 40px;
width: 400px;
height: 100px;
}

.shop_button_L {
left: calc((1280px - (400px * 2 + 50px)) / 2);
}

.shop_button_R {
left: calc((1280px - (400px * 2 + 50px)) / 2 + 400px + 50px);
}

.text_L {
position: absolute;
bottom: -10px;
margin-left: 330px;
color: #d70159;
font-size: 18px;
text-shadow: 
-1px -1px 0 #fff,  
1px -1px 0 #fff,
-1px  1px 0 #fff,
1px  1px 0 #fff;
}

.text_R {
position: absolute;
bottom: -10px;
margin-left: 730px;
color: #d70159;
font-size: 18px;
text-shadow: 
-1px -1px 0 #fff,  
1px -1px 0 #fff,
-1px  1px 0 #fff,
1px  1px 0 #fff;
}

.shop_base-container02 {
position: relative;
margin-top: 50px;
width: 1280px;
height: 750px;
display: inline-block;
}

.shop_base02 {
position: absolute;
top: 0px;
left: 0px;
width: 1280px;
height: 750px;
}

.shop_bg04 {
position: absolute;
top: 180px;
left: 40px;
width: 1200px;
height: 400px;
border-radius: 20px;
box-shadow: 0px 5px 15px 0 rgb(0, 0, 0, 0.4);
}

.shop_cg03 {
position: absolute;
top: 260px;
left: 70px;
width: 439px;
height: 249px;
}

.shop_text05 {
position: absolute;
top: 240px;
left: 540px;
}

.shop_base-container03 {
position: relative;
margin-top: 50px;
width: 1280px;
height: 210px;
display: inline-block;
}

.og_base-container {
position: relative;
margin-top: 20px;
width: 1280px;
height: 400px;
display: inline-block;
}

.og_base_L, .og_base_R {
position: absolute;
top: 50px;
width: 620px;
height: 400px;
}

.og_base_L {
left: calc((1280px - (620px * 2 + 15px)) / 2);
}

.og_base_R {
left: calc((1280px - (620px * 2 + 15px)) / 2 + 620px + 15px);
}

.og_base {
width: 620px;
height: 400px;
}

.shop_original_title {
position: absolute;
top: 20px;
left: 50%;
transform: translateX(-50%);
}

.shop_original_thumb {
position: absolute;
top: 70px;
left: 50%;
transform: translateX(-50%);
border-radius: 20px;
box-shadow: 0px 5px 15px 0 rgb(0, 0, 0, 0.4);
}

.shop_link_button02 {
position: absolute;
top: 330px;
left: 50%;
transform: translateX(-50%);
border-radius: 20px;
box-shadow: 0px 5px 15px 0 rgb(0, 0, 0, 0.4);
}

/* イベントページ */
.event_title {
position: absolute;
top: 122px;
left: 517px;
}

.campain_list-container {
position: relative;
margin-top: 0px;
width: 1280px;
height: 90px;
display: inline-block;
}

.list_campain01, .list_campain02 {
position: absolute;
top: 0px;
width: 510px;
height: 90px;
}

.list_campain01 {
left: calc((1280px - (510px * 2 + 15px)) / 2);
}

.list_campain02 {
left: calc((1280px - (510px * 2 + 15px)) / 2 + 510px + 15px);
}

.campain_container {
position: relative;
margin-top: 15px;
width: 1200px;
height: 700px;
display: inline-block;
}

.campain_img {
position: absolute;
top: 0px;
left: 40px;
width: 1200px;
height: 700px;
border-radius: 20px;
box-shadow: 0px 5px 15px 0 rgb(0, 0, 0, 0.4);
}

.shop_list_button {
position: absolute;
top: 500px;
left: 1023px;
width: 115px;
height: 101px;
}

.lottery_button {
position: absolute;
top: 425px;
left: 880px;
width: 308px;
height: 241px;
transition: filter 0.5s, transform 0.5s;
}

.lottery_button:hover {
filter: brightness(1.2);
transform: scale(1.1);
}

.event01_button {
position: absolute;
top: 425px;
left: 840px;
width: 175px;
height: 248px;
transition: filter 0.5s, transform 0.5s;
}

.event01_button:hover {
filter: brightness(1.2);
transform: scale(1.1);
}

.event02_button {
position: absolute;
top: 425px;
left: 1040px;
width: 175px;
height: 248px;
transition: filter 0.5s, transform 0.5s;
}

.event02_button:hover {
filter: brightness(1.2);
transform: scale(1.1);
}

.clair_as_banner {
position: absolute;
top: 400px;
left: 65px;
width: 312px;
height: 102px;
transition: filter 0.5s, transform 0.5s;
}

.clair_as_banner:hover {
filter: brightness(1.2);
transform: scale(1.1);
}

.clair_as_release {
position: absolute;
top: 390px;
left: 400px;
width: 510px;
height: 116px;
}