@charset "UTF-8";

/* =========================================================
TZ / TOP
=========================================================== */

.p-main__tz{
position:relative;
margin:0 auto 20px;
display:block;
overflow:hidden;
}

.p-main__tz-l{
position:absolute;
top:0;
left:0;
width:100px;
height:880px;
background:url(../../../../img/common/main__tz-l.png) repeat-y center top;
background-size:100px 8px;
display:block;
z-index:3;
}
.p-main__tz-r{
position:absolute;
top:0;
right:0;
width:100px;
height:880px;
background:url(../../../../img/common/main__tz-r.png) repeat-y center top;
background-size:100px 8px;
display:block;
z-index:3;
}

.p-main-logo{
position:relative;
margin:0 auto 15px;
padding:30px 0 0;
width:88%;
height:auto;
z-index:4;
opacity:0;
}
.p-catch{
position:relative;
margin:0 0 5px 6%;
width:80%;
height:auto;
z-index:4;
opacity:0;
}
.p-esa{
position:absolute;
top:50%;
right:0;
margin:-5px 0 0;
width:100%;
height:10px;
background:url(../../../../img/common/tz/bg_esa.png) repeat-x right top;
background-size:40px 10px;
}
.p-packman__box{
position:absolute;
left:0;
right:0;
top50%;
margin:-35px 0 0;
width:100%;
height:70px;
}
.p-packman{
position:absolute;
top:0;
left:-100%;
width:70px;
height:70px;
}
.p-monster{
position:absolute;
top:0;
left:-100%;
width:310px;
height:70px;
}
.p-weak__box{
position:relative;
z-index:4;
}
.p-weak__box-inner{
margin:0 0 0 13%;
padding:15px 0 0;
width:28%;
float:left;
}
.p-weak{
position:absolute;
top:19%;
right:-10%;
width:35px;
height:32px;
opacity:0;
}

.p-movie{
margin:0 0 8px;
opacity:0;
}
.p-potal{
margin:0 0 8px;
opacity:0;
}
.p-packman__main{
position:relative;
margin:0 4% 0 0;
padding:10px 0 0;
width:50%;
z-index:50;
opacity:0;
float:right;
}

.p-no01{
width:10%;
float:left;
}
.pac_home .l-content{
background:url(../../../../img/top/bg_maze.png) center top repeat-y;
background-size:40%;
}

.p-ubsf{
margin:0 4% 10px;
}

.p-no01 img,
.p-main img,
.p-famislo img,
.p-score img,
.p-catch img,
.p-main-logo img,
.p-soon img,
.p-movie img,
.p-potal img,
.p-packman__main img,
.p-packman img,
.p-monster img,
.p-weak img,
.p-ubsf img{
width:100%;
height:auto;
display:block;
}

/* =========================================================
Iwakan
=========================================================== */

.iwakan .p-page-catch{
position:relative;
margin:0 2% 30px;
z-index:4;
}
.p-iwakan__section{
position:relative;
margin:0 2%;
display:inline-block;
}
.p-iwakan__oudou{
margin:20px 10% 4px;
padding:5px 0 5px;
background:rgba(255,0,0,0.5);
border-radius:16px;
}
.p-iwakan__iwakan{
margin:0 10% 4px;
border-radius:16px;
}
.p-iwakan__oudou-title{
position:relative;
margin:-20px auto 0;
width:90%;
height:auto;
z-index:3;
}
.p-page-catch img,
.p-iwakan__section img,
.p-iwakan__oudou-title img{
width:100%;
height:auto;
display:block;
}

/* =========================================================
Bonus
=========================================================== */

.bonus .p-page-catch{
position:relative;
margin:10px 2% 0;
z-index:4;
}
.p-kokuchi{
position:relative;
margin:-70px 0 0;
background:url(../../../../img/bonus/bg_kokuchisp.png) center top no-repeat;
background-size:100%;
}
.p-kokuchi__light{
opacity:0;
}
.p-bonus1{
position:relative;
margin:-20px 10% 25px;
padding:12px 12px 10px;
background:rgba(255,160,0,0.6);
border-radius:16px;
z-index:2;
}
.p-bonus2{
position:relative;
margin:0 10% 20px;
padding:12px 12px 10px;
background:rgba(0,160,255,0.6);
border-radius:16px;
z-index:2;
}
.p-bonus1 img,
.p-bonus2 img{
position:relative;
margin:-20px 0 0;
width:100%;
height:auto;
display:block;
}
.p-bonus__note1{
position:relative;
margin:10px 15% 15px;
z-index:2;
}
.p-kokuchi__light img,
.p-bonus__note1 img{
width:100%;
height:auto;
display:block;
}

/* =========================================================
Howto
=========================================================== */

.howto .p-page-catch{
margin:10px 2% 15px;
z-index:4;
}
.p-howto__main{
margin:0 3% 20px;
}
.p-howto1{
position:relative;
margin:0 0 15px;
padding:8px 2% 12px;
background:rgba(0,160,255,0.6);
border-radius:12px;
}
.p-howto1__box{
position:relative;
margin:0 auto;
line-height:1;
}
.p-howto2{
position:relative;
margin:0 0 15px;
padding:8px 2% 12px;
background:rgba(0,128,0,0.6);
border-radius:12px;
}
.p-howto2__box{
position:relative;
margin:0 auto;
line-height:1;
}
.p-howto3{
position:relative;
margin:0 0 15px;
padding:8px 2% 12px;
background:rgba(160,0,160,0.6);
border-radius:12px;
}
.p-howto3__box{
position:relative;
margin:0 auto;
line-height:1;
}
.p-howto__reel{
position:relative;
margin:0 auto 10px;
width:30%;
}
.p-howto__note1{
position:relative;
margin:10px 15% 15px;
z-index:2;
}
.howto .p-page-catch img,
.p-howto1 img,
.p-howto2 img,
.p-howto3 img,
.p-howto__reel img,
.p-howto__note1 img{
width:100%;
height:auto;
display:block;
}


/* =========================================================
Spec
=========================================================== */

.p-spec__main{
position:relative;
margin:0 10% 10px;
}
.spec .p-page-catch img,
.p-spec1 img,
.p-spec2 img,
.p-spec3 img,
.p-spec5 img{
width:100%;
height:auto;
display:block;
}


.p-spec1{
position:relative;
margin:0 auto 10px;
width:50%;
}
.p-spec2{
position:relative;
}
.p-spec3{
position:relative;
margin:0 10% 3px;
}
.p-spec5{
position:relative;
margin:0 12% 20px;
text-align:center;
line-height:1;
}
.p-spec1 img,
.p-spec2 img,
.p-spec3 img,
.p-spec5 img{
width:100%;
height:auto;
display:block;
}


/* =========================================================
Point
=========================================================== */

.p-point__main{
position:relative;
margin:0 20px 10px;
padding:15px 0 0;
overflow:hidden;
}
.p-point1,
.p-point2,
.p-point3,
.p-point4,
.p-point5,
.p-point6{
position:relative;
margin:0 0 20px;
padding:0 0 0 20px;
z-index:2;
}
.p-point1 img,
.p-point2 img,
.p-point3 img,
.p-point4 img,
.p-point5 img,
.p-point6 img,
.p-point7 img{
width:100%;
height:auto;
display:block;
}
.p-point__pack{
position:absolute;
top:0;
left:0;
width:10%;
height:100%;
background:url(../../../../img/point/listhead.png) left center no-repeat;
background-size:18px 18px;
}
.p-point4 .p-point__pack,
.p-point5 .p-point__pack,
.p-point6 .p-point__pack{
background:url(../../../../img/point/listhead.png) left 15% no-repeat;
background-size:18px 18px;
}
.p-point7{
margin:0 auto;
width:26%;
}

/* =========================================================
Shop Search
=========================================================== */

.p-shop{
opacity:0;
}
#p-shop-search{
position:relative;
margin:0 auto;
padding:2% 0 3%;
width:320px;
background:rgba(255,128,0,0.2);
border-radius:12px;
}
.p-shop-search__logo{
margin:0 auto;
width:80%;
text-align:center;
}
.p-shop-search__form{
margin:0 auto;
width:65%;
line-height:1;
display:block;
}
.p-shop-search__select{
width:100%;
height:32px;
line-height:32px;
font-size:15px !important;
outline:none;
margin-bottom:25px;
}
#p-shop-search__btn{
margin:0 auto;
width:40%;
height:auto;
line-height:1;
display:block;
}
.p-shop img,
.p-shop-search__logo img{
width:100%;
height:auto;
display:block;
}