@media (max-width: 600px) {
 body {
min-width: 0; /* PC用のmin-widthを解除 */
width: 100%;
margin: 0;
overflow-x: hidden;

}

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;
}		

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

.container {
margin:0% 0%; 
width: 100%;
padding: 0 15px;
position: relative;
}
	
.container02 {
margin:0% 0%; 
width: 100%;
padding: 0 0px;
position: relative;
}

 .ntg-top {
text-decoration: none;
margin: 8px 0;
color: #333;
background: url(../images/bg_bt_olgtop.gif) no-repeat left center;
background-size: 14px 13px;
padding-left: 17px;
font-size: 14px;
}

#dmm_ntgnavi {
background: url(../images/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;
position: relative;
z-index:2;
}

#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;
font-size: 3vw;
}

 #dmm_ntgnavi .navi_left li.ntg_top span {
background: url(../images/bg_bt_olgtop.gif) 0 center no-repeat;
}

#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/arrow_common.gif) no-repeat left center;
}

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

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

#dmm_ntgnavi .clear {
clear: both;
}


#fv {
margin: 0 auto 0 auto;
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
}

.fv-bg-scroll-wrapper {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 0;
}

 /* 修正: object-positionを使用した安全なスクロールアニメーション */
    .fv-bg-scroll-img {
        height: 100%; 
        width: 100%; /* 幅を100%にしてコンテナに合わせる */
        object-fit: cover; /* 画像をトリミングして表示 */
        object-position: 0% 50%; /* 初期位置 */
        animation: bgPan 20s linear infinite alternate; /* ゆっくりスクロール */
    }
    @keyframes bgPan {
        0% { object-position: 0% 50%; }   /* 左端 */
        100% { object-position: 100% 50%; } /* 右端 */
    }

#fv .fv-logo-top {
margin:3% 0% 0% 0%;
left:3%;
float:left;
width: 53%;
position: relative;
z-index: 1;
}
	
#fv .fv-catch {
margin:90% auto 0% auto;
width:70%;
position: relative;
z-index: 1;
}
	
#fv .fv-catch02 {
margin:-2% auto 2% auto;
left:1%;
width:98%;
position: relative;
z-index: 1;
}


.sp-section-divider-chara {
position: relative;
width: 100%;
height: 0;
z-index: 10;
}
.sp-chara-img {
position: absolute;
top: 0px;
right: 8%;
width: 70%;
filter: drop-shadow(0 5px 10px rgba(0,0,0,0.3));
animation: floatUpDown 3s ease-in-out infinite;
}
	




.gold-frame-box {
                /* 角丸なしでOK */
                border: 3px solid transparent;
                border-image: linear-gradient(135deg, #e69413, #ffe246, #fff4ce, #ffe246, #e69413) 1;
                margin-bottom: 0px;
                background: transparent;
            }
            .gold-frame-inner {
                 background-color: rgba(34, 34, 34, 0.8);
                color: #fff;
                padding: 0;
            }

            /* --- 修正: ボックス内の赤帯タイトル (SP) --- */
            .box-title {
				
                background-color: #9a0000; /* 赤帯 */
                font-family: 'Kaisei Opti', serif;
                font-size: 6.5vw;
                color: #fff;
                text-align: center;
                margin: 0;
                padding: 10px 0;
                width: 100%;
                font-weight: bold;
                letter-spacing: -0.5em;
                border-bottom: 1px solid rgba(255, 226, 70, 0.3);
				background-image:url("../images/bg_ptarne.webp");
            }

            /* コンテンツエリア (SP) */
            .box-content-area {
                padding: 0px 10px;
				margin:0 auto 0 auto;
                flex-direction: column;
                align-items: center;
                justify-content: center;
            }
	
	
			    /* コンテンツエリア (SP) */
            .box-content-area02 {
                padding: 0% 0%;
				margin:0% auto 0% auto;
                flex-direction: column;
                align-items: center;
                justify-content: center;
            }
		
	

            .text-area {
                background-color: #9a0000;
                background-image: radial-gradient(#a50000 10%, transparent 10%), radial-gradient(#a50000 10%, transparent 10%);
                background-size: 15px 15px;
                background-position: 0 0, 7.5px 7.5px;
                padding: 20px;
                text-align: center;
                border: 2px solid #520303;
                margin-bottom: 15px;
            }
            .text-area h2 {
                font-size: 24px;
                margin: 0;
            }

            .date-area {
                background-color: #000000;
                color: #fff;
                padding: 10px;
                text-align: center;
                font-size: 14px;
                margin-bottom: 30px;
            }
	
#section1 .sec01_pic01{
margin:15% auto 10% auto;
width:85%;
text-align: center;
position: relative;
z-index:1;
}	
	

	

#event{
margin:0% auto 0% auto;
width:95%;
position: relative;
}	
	
	
#event .container{
margin:0% auto 5% auto;
padding:0% 0% 2% 0%;
position: relative;
}	
	

#event .capt01{
margin:0% auto 0% auto;
width:95%;
height:auto;
position: relative;
z-index:1;
}	
	
#event .capt02{
margin:5% auto 5% auto;
width:95%;
height:auto;
position: relative;
}		
	
#event .capt03{
margin:0% 0% 0% 0%;
padding:0% 0% 2% 0%;
font-size:2.8vw;
font-family: "sans-serif";
font-optical-sizing: auto;
position: relative;
}	

	
#event .game{
margin:0% auto 0% auto;
}

	
#event .game_pic01{
width:100%;
height:auto;
}	
	
	
#event .game .box_l .game_capt01{
margin:5% auto 5% auto;
width:90%;
height: auto;
}
	
#event .game .box_l .list{
margin:0% auto 0% auto;
display: inline-block;
white-space: normal; 	
}
	
	
#event .game .box_l li{
margin:3% 1.5% 3% 1.5%;
display: inline-block;
white-space: normal; 
}
	
#event .game .box_l .btn01{
width:52.5%;
height:auto;
}	
	
#event .game .box_l .btn02{
width:40%;
height:auto;
}	
	
#event .game .box_l .btn03{
width:48%;
height:auto;
}	
	
	
	
	
#youtube{
margin:15% auto 0% auto;
position: relative;
z-index:1;
}
	
#youtube .capt01{
margin:0% auto 0% auto;
width:90%;
height:auto;
position: relative;
z-index:1;
}	
	
#youtube .pic01{
margin:0% auto 0% auto;
position: relative;
cursor: pointer;
z-index:1;
}		
	
	
	
	
	
	
#section2 .gacha{
margin:10% auto 10% auto;
}	
	
	
#section2 .gacha .capt01{
margin:0% auto 5% auto;
}	
	
	
#section2 .gacha .gacha-text{
font-family: 'Murecho', sans-serif;
font-weight: 700;
font-size:5.3vw;
margin: 0 auto;
text-align: center;
position: relative;
letter-spacing:0.1vw;
}	
	
	
	
	
#section2 .sec02_capt01{
margin:24% auto -5% auto;
width:90%;
text-align: center;
position: relative;
z-index:1;
}	

#section2 .sec02_capt02{
margin:5% auto 5% auto;
width:95%;
text-align: center;
position: relative;
}	
	
#section2 .sec02_capt03{
margin:5% auto 2% auto;
width:110%;
text-align: center;
position: relative;
}		
	
#section2 .sec02_days{
margin:3% auto 0% auto;
text-align: center;
font-size:4.5vw;
letter-spacing:0.2vw;
background: #000000;
font-family: 'Murecho', sans-serif;
font-weight: 700; 
}		


#section2 .sec02_days02{
padding:0% auto 4% auto;
text-align: center;
font-size:2.7vw;
letter-spacing:0.1vw;
background: #000000;

}	
	
#section2 .goods{
margin:10% auto 0% auto;
position: relative;
}
	


#section2 .goods .goods_capt01{
margin:0% auto 0% auto;
}
	

	
#section2 .goods .box_l .goods_capt02{
margin:4% auto 0% auto;
width:98%;
}
	
#section2 .goods .box_l .goods_tx01{
margin:2% auto 2% auto;
font-family: 'M PLUS 1', sans-serif;
font-weight: 800;
font-size:8vw;
letter-spacing:2px;
}
	

#section2 .goods .box_l .goods_capt03{
margin:4% auto 10% auto;
width:95%;
height: auto;
}	
	
	
	
	
	
	
	
	
#section3{
margin:10% auto 0% auto;
}	
	
	
	
#section3 .list_kaisei-text ul{

}
	
#section3 .list_kaisei-text li{
top:10%;
padding:3% 0% 0% 0%;
left:-5%;
list-style: none;
font-family: 'Kaisei Opti', serif;	
text-align: center;
font-size:5vw;
overflow-x: hidden;
}
	
#section3 .sec03_pic01{
margin:5% auto 0% auto;
width:90%;
}

#section2 .up-text{
margin:0% auto 4% auto;
font-size:5.2vw;
font-family: "M PLUS 1", sans-serif;
font-optical-sizing: auto;
font-weight: 700;
letter-spacing:0.3vw;
}
	
#section3 .sec03_days{
margin:3% auto 0% auto;
padding:1%;
text-align: center;
font-size:4.5vw;
letter-spacing:0.3vw;
background: #000000;
font-family: 'Murecho', sans-serif;
font-weight: 700; 
}	
	
	
	
#section4{
margin:10% auto 0% auto;
}
	
	
	
#section4 .list_kaisei-text li{
top:10%;
padding:3% 0% 0% 0%;
left:-5%;
list-style: none;
font-family: 'Kaisei Opti', serif;	
text-align: center;
font-size:6vw;
overflow-x: hidden;
}

#section4 .list_kaisei-text02{
top:0%;
padding:3% 0% 3% 0%;
list-style: none;
font-family: 'Kaisei Opti', serif;	
text-align:left;
font-size:4.1vw;
overflow-x: hidden;
}

	
#section4 .sec04_pic01{
margin:0% 0% 0% 0%;
width:50%;
position:relative;
float: left;
}
	
#section4 .sec04_pic02{
margin:2% 0% 0% 0%;
width:50%;
position:relative;
}	
	
#section4 .sec04_days{
margin:4% auto 0% auto;
padding:1%;
text-align: center;
font-size:4.5vw;
letter-spacing:0.1vw;
background: #000000;
font-family: 'Murecho', sans-serif;
font-weight: 700; 
}		

	
	
	
#pack {
margin: 15% auto 0% auto;
text-align: center;
position: relative;			
}	
	
	
#pack .capt01{
margin:0% auto 0% auto;
width:95%;
height: auto;
}	

#pack .container02{
margin:0% auto 0% auto;
width:90%;
height: auto;
z-index:1;
}	
	
	
	
#pack .container02 .capt02{
margin:5% auto 0% auto;
width:90%;
height: auto;
z-index:1;
}
	
#pack .container02 .plus{
margin:3% auto 0% auto;
width:15%;
height: auto;
}
	
#pack .container02 .capt03{
margin:-3% auto 0% auto;
width:88%;
height: auto;
position: relative;
}
	
#pack .container02 .list{
margin:-56% 0% 0% 0%;
padding:0% 8% 10% 8%;
font-size:3.1vw;
position: relative;
text-align:left;
}	
	

	
#movie {
margin: 20% 0% 15% 0%;
width: 100%;
height: auto;
/* ▼高さを強制せず、動画の比率(16:9)に合わせる設定 */
aspect-ratio: 16 / 9;
position: relative;
border-top: 4px solid transparent;
border-bottom: 4px solid transparent;
border-image: linear-gradient(135deg, #e69413, #ffe246, #fff4ce, #ffe246, #e69413) 1;
}
#movie .movie-bg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
#movie .movie-bg video {
width: 100%;
height: 100%;
/* coverだと切れるので、枠にぴったり収まる設定に変更してもOKですが */
/* aspect-ratioを指定したので cover のままでも綺麗に収まります */
object-fit: cover;
}
#movie .movie-content {
position: absolute;
top: 0%;
left: 0;
width: 100%;
height: 100%;
margin: 0;
/* 上下中央に配置するための設定 */
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
z-index: 2;
}
#movie .capt01 {
width: 60%;
height: auto;
margin-bottom: 10px;
}
#movie .btn {
margin:5% 0% 0% 0%;
width: 100px; /* ボタンも少し小さめに */
height: 100px;
}
#movie .close-btn {
top: -40px;
right: 5px;
}
	
	
	
	
	
	
#illustration {
margin: 0 auto;
text-align: center; /* これで中の ul を中央に寄せます */
position: relative;
}
	
	
#illustration .capt01{
margin: 0% 0% 0% 0%;
width:100%;
height:auto;
position: relative;
z-index:1;
}	
	

#illustration .list{
margin:5% 0% 0% 1%;
}	


#illustration ul {
display: inline-block; /* 幅を中身に合わせて縮める */
text-align: left;      /* 中身（画像）は左揃えにする */
/* ▼ 修正: 邪魔な余白をリセット */
margin: 0; 
padding: 0;
white-space: normal; }

#illustration li {
margin:3% 1.5%;
width:46%;
height: auto;
display: inline-block;
vertical-align: top; /* 画像がガタつくのを防ぐ */
}
		
	

	
	
	
	
#sns {
	margin:10% auto 0% auto;
	width: 100%;
	position: relative;
	overflow: hidden;
	background-image:url("../images/bg_ptarne.webp");
	background-position: center;
	background-color: #322f2f;
}
	
#sns .logo {
margin:2% 0% 0% 0%;
width:70%;
position:relative;
}
	
#sns .list_kaisei-text{
margin:5% auto 0% auto;
font-family: 'Kaisei Opti', serif;	
text-align: center;
font-size:5.1vw;
overflow-x: hidden;
color: #FFFFFF;
letter-spacing:0.5vw;
}
	
#sns .btn{
margin:5% auto 10% auto;
width:130%;
}
	
	
	
	

#footer{
background: #FFFFFF;
border-top:2px solid #969696;
position: relative;
z-index:2;
}

#footer p{
padding:10% 0%;
font-size:15px;
color:#a4a4a4;
}
	

#page_btn {
	width:25%;
    position: fixed;
    right: 10px;
    bottom: 0;
    z-index: 100;
}
	
	
	
	
		
	
	
	
        }