@charset "UTF-8";

#container {
overflow: hidden; }

blockquote {font-size: 100%; }
embed,
iframe,
object {
max-width: 100%; }
.section {
padding-top: 50px;
padding-bottom: 50px; }
.section .section {
padding-top: 0;
padding-bottom: 0; }
body {
-webkit-font-smoothing: antialiased; }
img {
height: auto;
max-width: 100%; }
a {
transition: color 0.4s, background-color 0.4s, border-color 0.4s, text-decoratin 0.4s; }

ul.iconButton{
top: 18rem;
left: 0;
width: 60px;
font-size: 3.2rem;
font-weight: 800;
position: fixed;
transition: all 0.3s;
z-index: 500;
text-align: center;
margin-bottom: 0;
}
ul.iconButton li{
display: inline-block;
}
ul.iconButton li a{
width: 60px;
height: 60px;
background: #A40B5D;
display: block;
color: #fff;
opacity: 0.7;
padding-top: 0.8rem;
margin-bottom: 1rem;
}
ul.iconButton li:nth-child(2) a{
background: #00C7EB;
top: 25rem;
}
ul.iconButton li a:hover {
opacity: 1;
transition: all 0.3s;
}

#loading {
position: fixed;
top: 0;
left: 0;
bottom: 0;
z-index: 99999;
width: 100%;
height: 100%;
background: #e61874;
}
#loading_box {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 100%;
text-align: center;
}
.loading-one {
display: inline-block;
border-top: 1px solid #ffffff;
border-bottom: 1px solid #ffffff;
}
.loading-one p.loading-txt {
color: #fff;
font-size: 2rem;
letter-spacing: 0.25rem;
line-height: 2.0;
padding: 2rem 0;
font-family: "Poller One", sans-serif;
}
.animation_loading {
animation: equalizer_loading 7000ms infinite;
animation-iteration-count: 10;
}
@keyframes equalizer_loading {
0% {width: 70%;}
10% {width: 50%;}
20% {width: 100%;}
30% {width: 30%;}
40% {width: 50%;}
50% {width: 70%;}
60% {width: 50%;}
70% {width: 30%;}
80% {width: 100%;}
90% {width: 30%;}
100% {width: 70%;}
}

#pagetop {
position: fixed;
bottom: 1rem;
right: 1rem;
z-index: 100;
width: 6rem;
height: 6rem;
display: inline-flex;
justify-content: center;
align-items: center;
background: #e61874;
}
#pagetop a {
color: #fff;
font-size: 3rem;
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
}
.al_c {
text-align: center !important;
}
.al_l {
text-align: left;
}
.mg_auto {
margin: 0 auto;
text-align: center;
}
.po_r {
position: relative;
}
.flex {
display: flex;
}
.fd_re {
flex-direction: row-reverse;
}
.jc_c {
justify-content: center;
}
.jc_sb {
justify-content: space-between;
}
.jc_sa {
justify-content: space-around;
}
.ai_c {
align-items: center;
}
.ai_fe {
align-items:flex-end;
}
.as_fs {
align-self: flex-start;
}
.mb_s {
margin-bottom: 5rem !important;
}
.mb_m {
margin-bottom: 8rem !important;
}
.mb_l {
margin-bottom: 12rem !important;
}
.mt_m {
margin-top: 8rem !important;
}
.pt_m {
padding-top: 5rem;
}
.mr_3 {
margin-right: 3rem;
}
.mb_-2 {
margin-bottom: -2rem;
}
.mr_-2 {
margin-right: -2rem;
}
.mr_-3 {
margin-right: -3rem;
}
.ml_-2 {
margin-left: -2rem;
}
.ml_-3 {
margin-left: -3rem;
}
.mt_-3{
margin-top: -3rem;
}
.mt_-6{
margin-top: -6rem;
}
.txt_l {
font-size: 2.6rem;
}
.txt_s {
font-size: 2rem !important;
}
.note {
font-size: 1.25rem !important;
font-weight: 300 !important;
line-height: 1.3 !important;
text-align: left;
}
.di_b {
display: block;
}
.di_ib {
display: inline-block
}
.z-1 {
z-index: -1;
}
.z10 {
z-index: 10;
position: relative;
}
br.nopc {
display: none;
}
.only_sp{
display: none;
}

.index .firstmovie{
display: none;
}

/* .container.header {
position:absolute;
display: flex;
align-items: center;
z-index: 10;
width: 100%;
} */
.header {
height: 100px;
position: relative;
z-index: 3;
}
.sub .header {
    position: fixed;
}

header {
width: 100%;
display: block;
padding: 0;
}
header .inner {
width: 100%;
height: 100px;
display: flex;
justify-content: space-between;
align-items: center;
/* background: linear-gradient(180deg, #A40B5D 0%, rgba(164, 11, 93, 0.8) 100%); */
padding: 0 2rem;
}
header .logo {
width: 220px;
position: fixed;
}
header nav ul{
width: 100%;
/* display: flex; */
align-items: center;
justify-content: space-around;
margin-bottom: 0;
}
.gnavi li::before,
.gnavi li::after {
position: absolute;
z-index: -1;
display: block;
content: '';
}
.gnavi li,
.gnavi li::before,
.gnavi li::after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: all .3s;
transition: all .3s;
}
.gnavi li{
display: block;
margin: 0;
padding: 1.5rem 0;
font-size: 3rem;
text-align: center;
position: relative;
z-index: 2;
color: #fff;
line-height: 50px;
line-height: 1.2;
}
.gnavi li.cs{
opacity: 0.6;
}
.gnavi li a {
color: #ffffff;
display:block;
font-family:"Poller One", sans-serif;
font-weight: 500;
font-size: 1.95rem;
white-space:nowrap;
transition: all .3s;
line-height: 1;
}
.gnavi li a:hover{
transform: translate(3px,3px);
}
.gnavi li span {
margin-top: 0.5rem;
display: block;
font-size: 1.5rem;
font-weight: 700;
font-family:"Noto Sans JP", serif;
}
header nav{
width: 20rem;
top:100px;
right: 0;
display: none;
position: fixed;
background: rgba(230, 24, 116, 0.9);

}
header nav ul{
display: block;
margin: 0 auto;
width: 100%;
}
header nav ul li{
margin: 0 auto;
text-align: center;
border-bottom: 1px #fff dashed;
}
header nav ul li:last-child{
border: none;
}
header nav ul li a{
display: block;
color: #fff !important;
}
#nav_toggle{
right: 1rem;
top: auto;
padding: 0 8px 0 8px;
display: block;
position: fixed;
width: 60px;
height: 60px;
z-index: 100;
zoom: 1;
background: rgba(230, 24, 116, 0.9);
}
#nav_toggle div {
position: relative;
margin-top: 10px;
}
#nav_toggle span{
display: block;
height: 3px;
background: #fff;
position:absolute;
width: 100%;
left: 0;
-webkit-transition: 0.5s ease-in-out;
-moz-transition: 0.5s ease-in-out;
transition: 0.5s ease-in-out;
}
#nav_toggle span:nth-child(1){
top:0;
}
#nav_toggle span:nth-child(2){
top:18px;
}
#nav_toggle span:nth-child(3){
top:37px;
}
.open #nav_toggle span:nth-child(1) {
top: 18px;
-webkit-transform: rotate(135deg);
-moz-transform: rotate(135deg);
transform: rotate(135deg);
}
.open #nav_toggle span:nth-child(2) {
width: 0;
left: 50%;
}
.open #nav_toggle span:nth-child(3) {
top: 18px;
-webkit-transform: rotate(-135deg);
-moz-transform: rotate(-135deg);
transform: rotate(-135deg);
}
.info{
display: flex;
justify-content: center;
align-items: center;
margin-top: 5rem;
}

.info ul{
display: flex;
flex-direction: column;
align-items: center;
margin-bottom: 0;
overflow-x: hidden;
overflow-y: hidden; 
/* overflow-y: scroll;  */
height: 5rem;
}
.info ul li{
display: flex;
align-items: center;
/* border-bottom: dashed 2px rgba(147, 59, 165, 0.2); */
padding: 1rem 1rem;
font-weight: 400;
color: #e84390;
}
.info ul li:last-child{
border-bottom: none;
}
.info ul li time{
display: block;
margin-right: 1rem;
margin-left: 1rem;
font-weight: 600;
}
.info ul li span {
    font-weight: 600;
}
.info ul li span a {
transition: all 0.3s;
color: #e61874;
display: flex;
margin: 0 0.4rem;
}
.info ul li a:hover,.news .info ul li a:after {
background: #F4EBF6;
}

.index .main {
padding-top: 0;
}
section.hero {
width: 100%;
overflow: hidden;
position: relative;
padding-bottom: 0;
text-align: center;
background-color: #fff;
margin-top: -120px;
}
.hero figure.fg_hero {
background-image: url(../images/hero_02.png);
background-size: cover ;
background-position: 45% 15% ; 
background-repeat: no-repeat;
width: 100%;
height: 1400px;
overflow: hidden;
text-indent: -9999px;
}

.hero .row {
    position: relative;
}

.hero .box h1,.hero p{
margin: 0;
}
/* .hero .box {
    position: relative;
} */
.title01 {
    position: absolute;
    top: 3rem;
    right: -35rem;
}
.title02 {
    position: absolute;
    top: 15rem;
    left: 38rem;
}
.title03 {
    display: none;
}
@media screen and (max-width: 600px) {
    .title01,
    .title02 {
        display: none;
    }
    .title03 {
        display: block;
    }
}

.hero .box{
position: absolute;
top: 0rem;
/* left: 40rem; */
right: 36rem;
/* margin: 0 auto; */
width: 100%;
}

.box02 {
    position: absolute;
    bottom: 12rem;
    left: 16rem;
    width: 100%;
}

.hero figure{
animation-delay: 1s;
}
.hero h1{
animation-delay: 1.5s;
}
.hero .vol2{
animation-delay: 3s;
margin-left: 43%;
margin-bottom: -10rem;
}


.main {
    background: #fff4d7;
    background-image: url(../images/bg-product02.jpg); 
    background-size: contain;
    /* background-repeat: no-repeat; */
    background-attachment: fixed;
}
.main-wrap {
    max-width: 1200px;
    margin: 0 auto;
    background-color: #fff;
    box-shadow: 0 0 2rem #886177;
}
.sub .container {
    /* padding-bottom: 5rem; */
}

.index .intro{
background-image: url(../images/bg_dot4.png);
/* background-position: center center; */
/* background-repeat: no-repeat; */
/* background-size:cover; */
background-color: #fff;
}

.index .intro h2{
background: none;
margin: 8rem 0 2rem;
}
.index .intro p{
line-height: 1.65;
font-weight: 800;
letter-spacing: 0.02em;
font-size: 2rem;
margin:3rem 0 ;
color: #574d4d;
}
.concept_wrap {
    position: relative;
    /* background-color: rgba(255, 255, 255, 0.877); */
    padding-top: 2rem;
    padding-bottom: 2rem;
    border-radius: 20px;
}
@media screen and (max-width: 680px) {
    .concept_wrap {
        padding-left: 1rem;
        padding-right: 1rem;
    }
}

.index .intro .box img{
position: absolute;
left: 12rem;
top: -16rem;
}

.index .story{
background: url(../images/bg_story01.png) no-repeat top center/cover;
}
.index .story h2{
color: #ffffff;
}
.index .story p{
padding: 2rem;
font-weight: 800;
font-size: 2rem;
letter-spacing: 0.125em;
line-height: 1.6;
color: #ffffff;
}
@media screen and (max-width:600px) {
    .index .story p {
        padding: 1.2rem;
    }
}


ul.grid2 {
display: flex;
justify-content: center;
flex-wrap: wrap;
margin: 2rem auto 4rem;
}
ul.grid2:after,
ul.grid2:before{
content:"";
display:block;
width: 48%;
height:0;
}
ul.grid2 li {
width: 48%;
}
ul.grid2:before{
order:1;
}

ul.grid3 {
display: flex;
justify-content: space-around;
flex-wrap: wrap;
}
ul.grid3:after,
ul.grid3:before{
content:"";
display:block;
width: 30%;
height:0;
}
ul.grid3 li {
width: 30%;
margin:0 0 4rem;
}
@media screen and (max-width: 600px) {
    .special ul.grid3 li {
        width: 45%;
    }
}
ul.grid3:before{
order:1;
}

ul.grid3 li a {
position: relative;
}
.index .gallery ul li span {
position: absolute;
top: 0;
left: 0;
z-index: 10;
background: rgba(255, 241, 0, 0.8);
color: #ffffff;
padding: 0.2rem 0.6rem;
font-size: 1.6rem;
font-weight: 500;
}
.index .gallery ul li p {
font-size: 1.8rem;
}
.index .gallery ul li img,
.index .special ul li img {
filter: drop-shadow(0.5rem 0.5rem 0px #e61874);
}

.movie ul.noslider{
margin: 4rem auto 0;
display: flex;
justify-content: center;
text-align: center;
}
.movie ul.noslider li{
margin-right: 2rem;
margin-left: 2rem;
}

.index .special ul {
/* width: 72%; */
}
.index .special ul li {
/* padding: 2rem; */
}

.download ul.slider2 {
width: 80%;
margin: 0 auto;
}
.download dl {
display: flex;
justify-content: space-between;
margin: 1rem auto;
width: 80%;
background-color: #F0F0F0;
padding: 2rem 4rem;
}
.download dt {
font-size: 2.2rem;
}

ul.slider3thumb li,
.slider_movie_thumb li{
padding:0 0.2rem;
}


dl.product_spec{
display: flex;
justify-content: center;
margin: 3rem 0;
width: 100%;
}
dl.product_spec dt{
    width: 16rem;
    height: 4rem;
    color: #fff;
    background-color: #e61874;
    border-radius: 30px;
    font-weight: 800;
    font-size: 1.75rem;
    padding-top: 0.8rem;
    padding-bottom: 0.8rem;
    padding-left: 0.8rem;
    padding-right: 0.8rem;
    text-align: center;
    /* padding-right: 1.5rem; */
}
dl.product_spec dd{
    font-size: 2.4rem;
    width: 64rem;
    font-weight: 800;
    text-align: left;
    margin-left: 2rem;
    letter-spacing: 0.1rem;
    color: #574d4d;
}
dl.product_spec span{
font-size: 1.8rem;
font-weight: 500;
background: linear-gradient(transparent 60%, #FFC701 0%);
display: inline;
padding: 0 2px 0;
}

.modaal-wrapper [tabindex="0"] {
/* width: 1300px;
margin: 0 auto; */
}
.modaal-container{
max-width: 1200px;
}
.modaal-close:focus:after,
.modaal-close:focus:before,
.modaal-close:hover:after,
.modaal-close:hover:before {
background: #A40B5D !important;
}

@media screen and (max-height: 900px){
.modaal-video-container {
max-width: 1200px !important;
max-height:731px !important;
}
}

.youtube {
position: relative;
width: 100%;
padding-top: 56.25%;
}
.youtube iframe {
position: absolute;
top: 0;
right: 0;
width: 100%;
height: 100%;
}

.intro ul.slider{
width: 970px;
margin: 6rem auto 8rem;
display: flex;
justify-content: space-between;
text-align: center;
}
.intro ul.slider .slick-list li{
margin: 0 2rem;
filter: drop-shadow(3px 3px 4px rgba(0, 0, 0, 0.3));
padding-bottom: 1rem;
}

.slick-slide img {
width: 100%;
height: auto;
}

.slick-prev, .slick-next {
z-index: 1;
width: 7rem !important;
height: 7rem !important;
}
.slick-arrow:before{
content:""!important;
width: 100%!important;
height: 100%!important;
position: absolute;
top: 0;
left: 0;
}
.slick-prev:before {
content: "" !important;
background-image: url(../images/ico_arw2.png) !important;
background-size: contain!important;
transform: rotate(-90deg);
}
.slick-next:before {
content: "" !important;
background-image: url(../images/ico_arw2.png) !important;
background-size: contain!important;
transform: rotate(90deg);
}
.slick-prev {
left: -60px !important;
}
.slick-next {
right: -60px !important;
}
.thumb {
margin: 20px 0 0;
}
.thumb .slick-slide {
cursor: pointer;
}
.thumb .slick-slide:hover {
opacity: .7;
}
.slick-prev:before, .slick-next:before{
color: #e84390 !important;
font-size: 5rem !important;
}
.slick-dots{
bottom: -3rem !important;
}
.slick-dots li button:before{
font-size: 1.2rem !important;
color: #e84390 !important;
}

.spec .wrap{
display: flex;
justify-content: space-between;
width: 100%;
margin: 0 auto;
}
.spec .block{
width: 50%;
}
.spec dl{
display: flex;
justify-content: center;
font-size: 1.6rem;
margin-bottom: 2.5rem;
color: #574d4d;
}
.spec dl dt{
width: 30%;
text-align: right;
padding-right: 2rem;
color: #e61874;
}
.spec dl dd{
width: 70%;
text-align: left;
font-weight: 700;
}
footer {
padding: 4rem 0;
width: 100%;
font-weight: 300;
text-align: center;
color: #fff;
background: #ec4f95;
/* filter: drop-shadow(-3px 0 3px rgba(0,0,0,0.1)); */
}
footer ul.foot_nav {
display: none;
justify-content: center;
color: #A40B5D;
margin: 0 auto 3rem;
text-align: center;
}
footer ul.foot_nav li {
border-left: solid 2px #A40B5D;
padding: 0 1.5rem;
}
footer ul.foot_nav li:first-child {
border-left: none;
}
footer ul.foot_nav li.cs {
color: rgba(231, 79, 145, 0.3);
}
footer ul.foot_nav a {
color: #A40B5D;
}
footer ul.imagebanner {
margin-bottom: 4rem;
}
footer ul.imagebanner li {
margin: 0 2rem;
}
footer small {
width: auto;
display: inline-block;
}
/********* pc sub下層ページ *********/
.sub_character .main{
margin-bottom: 20rem;
background-size: cover;
background-position: center top;
background-repeat: no-repeat;
background-attachment: fixed;
background-image: url(../images/bg_c1.jpg);
}

.sub_character.c1 .block{
/* background: linear-gradient(141.68deg, rgba(219, 2, 158, 0.2) 15.89%, rgba(92, 7, 199, 0.2) 51.39%, rgba(242, 131, 0, 0.2) 86.89%); */
}
.sub_character.c1 h3 {
    margin-bottom: 1.5em;
}
.sub_character.c1 p {
    margin: 2em 0 2em;
    line-height: 1.45;
    font-size: 1.65rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: #574d4d;
}
.sub_character.c2 .block{
background: linear-gradient(141.68deg, rgba(242, 131, 0, 0.2) 15.89%, rgba(219, 2, 158, 0.2) 51.39%, rgba(92, 7, 199, 0.2) 86.89%);
}
.sub_character.c3 .block{
background: linear-gradient(141.68deg, rgba(92, 7, 199, 0.2) 15.89%, rgba(242, 131, 0, 0.2) 52.13%, rgba(219, 2, 158, 0.2) 86.89%);
}
.sub_character .box_l{
width: 46%;
}

.sub_character .box_l .copy{
position: absolute;
top: 4rem;
left: -5rem;
z-index: 100;
}
.sub_character.c1 .box_l .copy{
top: 10rem;
}
.sub_character .box_l figure{
margin: -4rem 0 -20rem 4rem;
}
.sub_character.c1 .box_l figure ul#mainimage li:nth-child(2),
.sub_character.c1 .box_l figure ul#mainimage li:nth-child(3){
display: none;
}
.sub_character .box_l ul#btn{
position: absolute;
top: 4rem;
left: 0rem;
}
.sub_character .box_l ul#btn li{
padding: 0.8rem 2rem;
font-size: 1.8rem;
font-weight: 500;
color: #ffffff;
background: rgba(92, 7, 199, 0.6);
border-radius: 8rem;
margin-bottom: 0.5rem;
box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
transition: all 0.3s;
}
.sub_character .box_l ul#btn li:hover{
background: rgba(92, 7, 199, 0.9);
transition: all 0.3s;
}
.sub_character .box_r{
width: 54%;
text-align: left;
padding-left: 2rem;
}

/* .bg_chara {
    background-image: url(../images/bg_chara.png);
    background-size: cover;
    background-repeat: no-repeat;
} */
.sub_character dl{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 0;
    }
    .sub_character dl dt{
    font-size: 1.6rem;
    width: 12rem;
    font-weight: 500;
    text-align: center;
    padding-right: 0.8rem;
    padding-left: 0.8rem;
    margin-top: 0.8rem;
    margin-bottom: 0.8rem;
    background-color: #ef8599;
    border-radius: 18px;
    white-space: nowrap;
    line-height: 1.6;
    color: #fff;
    }
    .sub_character dl dd{
    font-size: 2rem;
    font-weight: 500;
    width: 40rem;
    margin-left: 2rem;
    text-align: left;
    }

.sub_character .row {
    padding-bottom: 13rem;
}
@media screen and (max-width:600px) {
    .sub_character .row {
        padding-bottom: 2rem;
    }
}

.sub_character dl dt{
font-size: 1.6rem;
width: 12rem;
text-align: center;
padding-right: 0.8rem;
white-space: nowrap;
}
.sub_character dl dd{
font-size: 1.85rem;
font-weight: 700;
width: 40rem;
text-align: left;
color: #574d4d;
}
.sub_character .box_r .lead{
color:#5C07C7 ;
font-size: 3.6rem;
font-family: 'Zen Maru Gothic', sans-serif;
display: inline-block;
margin: 3rem 0 0;
letter-spacing: 0;
line-height: 1.4;
}
.sub_character.c2 .box_r .lead{
color:#DB029E ;
}
.sub_character.c3 .box_r .lead{
color:#e77b00 ;
}

.sub_character aside ul{
justify-content: center;
width: 70%;
margin-top: 6rem;
}
.sub_character aside ul li{
margin: 0 1rem;
}
.btn.back{
padding: 0 1.5rem 0 1.5rem;
margin-top: 5rem;
margin-bottom: 4rem;
border-bottom: #e61874 solid 3px;
display: inline-block;
}
.btn.back a{
color: #e61874;
font-family: "Poller One", sans-serif;
font-size: 3rem;
line-height: 1;
}

/* .sub_special .main {
    margin-top: -100px;
    margin-bottom: 5rem;
} */

.sub_special.tokuten .box,
.sub_special.tokuten .main ul li,
.sub_special.twitter .box,
.sub_special.twcp .box,
.sub_special.taiken .box{
border: 2px solid #574d4d;
background: rgba(255, 255, 255, 0.5);
}
.sub_special.tokuten .box figure{
margin: 3rem 0;
width: 40%;
}
.sub_special.tokuten .box figure.ac{
margin: 4rem 0 8rem;
}
.sub_special.tokuten .box .box_r{
width: 50%;
margin:3rem 0 ;
}
.sub_special.tokuten .main ul {
flex-wrap: wrap;
}
.sub_special.tokuten .main ul:after,
.sub_special.tokuten .main ul:before{
content: "";
display: block;
width: 48%;
height: 0;
}
.sub_special.tokuten .main ul:before{
order: 1;
}
.sub_special.tokuten .main ul li{
padding: 3rem 0;
width: 48%;
margin-bottom: 5rem;
}
.sub_special.tokuten .main ul.original li{
padding: 3rem 0;
width: 32%;
margin-bottom: 3rem;
}
.sub_special.tokuten .main ul.original li figure{
background-color: #EADFE5;
width: 300px;
height: 300px;
margin: 0 auto 2rem;
display: flex;
align-items: center;
justify-content: center;
}

.sub_special.tokuten .main ul li h4{
font-size: 2.4rem;
letter-spacing: 0.08em;
color: #574d4d;
font-weight: bold;
font-weight: 800;
margin: 1.5rem 0 2rem;
}
.sub_special.tokuten .main ul li h4 span{
font-size: 1.8rem;
font-weight: bold;
}
.sub_special.tokuten p{
font-size: 1.65rem;
letter-spacing: 0.08em;
line-height: 1.5;
font-weight: 700;
margin: 0 0 1.5rem;
}
.sub_special.tokuten figure{
margin-bottom: 2rem;
}
.sub_special.tokuten .btn2{
margin-bottom: 1rem;
}

.sub_special.twitter .box ul {
width: 90%;
display: flex;
flex-wrap: wrap;
margin: 5rem auto;
justify-content: space-between;
}
.sub_special.twitter .box ul.tw_icon li {
width: 33%;
/* border-radius: 50%; */
/* overflow: hidden; */
/* margin: 0 auto 4rem; */
}
.sub_special.twitter .box ul.tw_header li {
margin-bottom: 4rem;
}

.sub_special.twcp .main .box,
.sub_special.taiken .main .box {
padding: 3rem;
}
.sub_special.twcp .main ol li {
margin-bottom: 1rem;
}
.sub_special.twcp .main ol li span {
font-size: 75%;
}
.sub_special.twcp .main .box2 {
border: solid 1px #ddd;
padding: 4rem 3rem 2rem;
}
.sub_special.twcp .main .box1 p,
.sub_special.taiken .main .box1 p  {
font-size:1.15rem ;
text-align: left;
letter-spacing: normal;
color: #6b6767;
}

.sub_special.twitter p {
    font-weight: 700;
    color: #574d4d;
    margin-top: 5rem;
}


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


.title03 {
    display: none;
}
}


/*==================1600==================*/
@media screen and (max-width:1600px){

.hero figure.fg_hero {
background-image: url(../images/hero_02.png);
}
.title03 {
    display: none;
}
}


/*==================1220==================*/
@media screen and (max-width:1220px){

ul.iconButton{
top: auto;
bottom: 0;
left: 0;
}
.container.header {
height: 100px;
}
header .logo {
width: 200px;
}
.gnavi li{
margin: 0 1.2rem;
}
section.hero {
zoom: 0.8;
}
.hero .vol2{
/* margin-left: 54%; */
}
.intro ul.slider{
width: 98%;
}
.index .intro .box img{
zoom: 0.8;
}
.index .gallery ul li {
margin-bottom: 3rem;
}
.title03 {
    display: none;
}
}
/*==================980==================*/
@media screen and (max-width:980px){

header .logo {
width: 150px;
}

.hero .vol2{
/* margin-left: 62%; */
}
.title03 {
    display: none;
}
.info{
font-size: 80%;
}
.index .intro .box img{
left: 0;
}
.sub_character .box_l ul,
.sub_character .box_l .copy,
.sub_character .box_r h3,
.sub_character .box_r p,
.sub_special.tokuten .box{
zoom: 0.6;
}
.sub_character .box_r dl{
zoom: 0.7;
}
.sub_character .box_l figure{
zoom: 0.9;
margin: -2rem 0 -10rem 2rem;
}

.sub_special.tokuten .main ul {
flex-direction: column;
}
.sub_special.tokuten .main ul li{
width: 100%;
}
.sub_special.tokuten .main ul.original li{
padding: 3rem 0;
width: 100%;
margin-bottom: 3rem;
}
.sub_special.tokuten .main ul.original li figure{
background:none ;
width: auto;
height: auto;
zoom: 1;
}
.spec .wrap{
width: auto;
flex-direction: column;
}
.spec .block{
width: auto;
}
.download dl {
flex-direction: column;
width: 100%;
}

.sub_character .main{
margin-bottom: 10rem;
}

}
/*==================600==================*/
@media screen and (max-width:600px){

html{
font-size: 50%;
}
.mr_3 {
margin-right: 0;
}
.mb_-2 {
margin-bottom: 0;
}
.mr_-2 {
margin-right: 0;
}
.mr_-3 {
margin-right: 0;
}
.ml_-2 {
margin-left: 0;
}
.ml_-3 {
margin-left: 0;
}
.mt_-3{
margin-top: 0;
}
.mt_-6{
margin-top: 0;
}
.mb_l {
margin-bottom: 6rem !important;
}

.flex_d_c{
flex-direction:column !important;
margin: 0 !important;
width: 100% !important;
text-align: center;
}
.flex_d_c li{
margin-bottom: 5rem;
}
.only_pc{
display: none;
}
.only_sp{
display: block;
}
.ta_l_onlysp,
.index .intro p,
.index .story p,
.download p,
.sub_special.twcp .main p,
.sub_special.twcp .main ul,
.sub_special.twcp .main ol,
.sub_special.taiken p,
.sub_special.taiken .box ul li,
.sub_special.taiken .box ol li{
text-align: left !important;
}

.download p{
font-size: 2rem;
}

.al_c_onlysp{
text-align: center !important;
}

br.nosp,
p.nosp br,
.index .story p br,
.sub_special.tokuten .box_r p br{
display: none;
}

.sub_special.tokuten .box figure,
.sub_special.tokuten .box .box_r{
width: 90% !important;
}

.box02 {
    
    left: 19rem;

}

.index .intro p span,
.index .story p span{
zoom:0.9;
}

.index .intro p,
.index .story p,
.sub_special.tokuten .box h4{
zoom:0.8;
}
.index .intro h2{
zoom:0.7;
}
.index .intro .box img{
zoom: 0.6;
top: -11rem;
}
.modaal-wrapper [tabindex="0"] {
width: auto;
}
.modaal-video-wrap{
margin: auto 0 !important;
}

.container.header{
height: auto;
background-image: none;
filter: none;
padding: 0;
}
header .inner {
height: 60px;
padding: 0;
}
header .logo {
width: 120px;
margin: 0;
}
.index header .logo {
display: none;
}
header {
padding: 0;
}
header nav{
width: 50%;
top:60px;
}

.header {
height: 60px;
}
.container.header header .inner {
width: 100%;
padding: 0;
justify-content: space-between;
align-items:flex-start;
}

.block.sp100 {
width: 100% !important;
}

.slick-arrow{
display: none !important;
}

#content {
margin: 3em 0 3em;
}
.info{
padding: 0 1rem;
font-size: 70%;
/* margin-top: -53px; */
margin-top: 2rem;
justify-content: flex-start;
}

.hero {
min-width: 0;
}
section.hero,
header .logo {
zoom: 1;
}
.hero .vol2{
zoom: 0.7;
/* margin-left: 80%; */
/* margin-bottom: -5rem; */
}
.hero figure.fg_hero {
background-image: url(../images/hero_sp01.png);
background-position: top center;
height: 96vh;
margin-top: 0;
}
.hero .row {
    position: relative;
}
.hero .box{
top: 34%;  
/* bottom: 2rem; */
left: 0rem;
width: 72%;
}

.hero .box h1{
width: 68%;
/* margin: 0 auto; */
}
.hero .box ul{
margin: 0 -1rem 0 2rem;
}

.box02 {
    width: 70%;
    bottom: 8rem;
    left: 14rem;
    /* top: 40%; */
    bottom: 8rem;
    /* right: 8rem; */
}
.index .intro{
/* background: url(../images/bg_intro_sp.png) no-repeat top center/auto 100%;  */
/* background-color: #f9adcf; */
/* background-size: cover;  */
}
.intro ul.slider{
/* margin: 1rem auto; */
margin: 2rem auto 4rem;
}
.intro ul.slider .slick-list li{
margin: 0 0.5rem;
}
.index .story{
background: url(../images/bg_story_sp.png) no-repeat top center/auto 100%;
background-size: cover;
}

.index .gallery ul li {
width: 78%;
margin:0 auto 4rem;
}
.index .gallery ul li:last-child {
margin-bottom: 10rem;
}
.index .special ul{
width: 100%;
}

dl.product_spec dt,dl.product_spec dd,dl.product_spec span{
zoom: 1;
font-size: 1.6rem;
padding-top: 0;
}

dl.product_spec{
margin: 2rem 0;
}
dl.product_spec:first-child{
margin-top: 3rem;
}
dl.product_spec:last-child{
margin-bottom: 4rem;
}
dl.product_spec dt{
    width: 16%;
    height: 5%;
    padding-right: 0.5rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 0.5rem;
    font-size: 1rem;
    white-space: nowrap;
    }
dl.product_spec dd{
width: 77%;
}
.movie ul li{
width: 90%;
margin: 1rem auto 0;
}

.spec .wrap {
display: flex;
}
.spec .block {
width: 100%;
}
.spec dl{
font-size: 1.5rem;
}
.spec dl dt{
width: 25%;
padding-right: 1rem;
white-space: nowrap;
}
.spec dl dd{
width: 68%;
}
footer {
padding: 4rem 0;
}
/********* sp下層ページ *********/
.sub_character .main{
margin-bottom: 0;
background-size:contain;
background-image: url(../images/bg_c1_sp.jpg);
}
.sub_character .box_l{
width: 100%;
}
.sub_character .box_l ul#btn{
left: 1rem;
}
.sub_character .box_l ul#btn li{
zoom: 1.5;
}
.sub_character .box_l .copy{
top: 6rem;
left: 1rem;
}
.sub_character.c1 .box_l .copy{
top: 20rem;
}
.sub_character .box_l figure{
margin: -2rem 0 0 5rem;
}
.sub_character .box_r{
width: 96%;
text-align: center;
margin-bottom: 4rem;

}
.sub_character .box_r p{
zoom: 0.7;
}
.sub_character .box_r dl{
justify-content: center;
}
.sub_character .box_r dl dt{
width: 40%;
zoom: 0.9;
}
.sub_character .box_r dl dd{
width: 60%;
zoom: 0.9;
}
.sub_character aside ul{
width: 90%;
}
.btn.back{
zoom: 0.8;
}

.sub_special.tokuten .box{
margin-bottom: 5rem !important;
padding-left: 0;
zoom: 1;
}
.sub_special.tokuten .box figure{
margin: 4rem 0 0 ;
width: 80%;
}
.sub_special.tokuten .main ul li{
width: 100%;
}
.sub_special.tokuten .main ul li figure{
zoom: 0.7;
}
.sub_special.twitter .box ul {
width: 90%;
flex-direction: column;
}
.sub_special.twitter .box ul.tw_icon li {
width: 70%;
margin: 1rem auto;
}

/* ------- */

#pagetop.btn::after {
margin: 0 0 0.2em;
}
.gnavi {
zoom: 1;
}
.gnavi li span {
font-size: 1.6rem;
}
.gnavi li a {
width:auto;
height: auto;
background:none;
background-position: 0;
text-indent:0;
white-space:nowrap;
transition: all .3s;
}
.gnavi li a:hover {
background-position: 0;
transition: all .3s;
}

#nav_toggle{
padding: 0 7px 0 8px;
width: 60px;
height: 60px;
zoom: 0.8;
}

}