/************************************************************************
  #introduction
************************************************************************/

/* ============ smart phone ============ */
@media screen and (max-width:750px){

#movie a { width:calc(286/750*100vw); }

}
/************************************************************************
  #introduction
************************************************************************/
#introduction { margin:0 auto; padding:150px 0 200px; }
#introduction h3 { width:398px; height:96px; }


/* ============ smart phone ============ */
@media screen and (max-width:750px){

#introduction h2 { width:calc(362/750*100vw); height:calc(182/750*100vw); }
#introduction h3 { width:calc(519/750*100vw); height:calc(100/750*100vw); }

}
/************************************************************************
  #character
************************************************************************/
#character h2 { width:265px; height:146px; }
#other-character h2 { width:372px; height:140px; }

/* ====== #cless ====== */
#cless h3 { width:228px; height:75px; top:612px; left:47px; }
#cless h4 { width:310px; height:67px; top:518px; left:47px; }
#cless p.lines { width:525px; height:176px; top:234px; left:0; }
#cless .chara-cv { top:684px; left:47px; }
#cless .chara-cv a { width:210px; height:46px; }

/* ====== #yuri ====== */
#yuri h3 { width:150px; height:78px; top:612px; left:47px; }
#yuri h4 { width:333px; height:69px; top:518px; left:47px; }
#yuri p.lines { width:576px; height:113px; top:295px; left:0; }
#yuri .chara-cv { top:684px; left:47px; }
#yuri .chara-cv a { width:229px; height:46px; }

/* ====== #milla ====== */
#milla h3 { width:161px; height:75px; top:612px; left:47px; }
#milla h4 { width:291px; height:68px; top:518px; left:47px; }
#milla p.lines { width:620px; height:176px; top:234px; left:0; }
#milla .chara-cv { width:174px; height:46px; top:684px; left:47px; }
#milla .chara-cv a { width:228px; height:46px; }

/* ====== #velvet ====== */
#velvet h3 { width:157px; height:77px; top:612px; left:47px; }
#velvet h4 { width:339px; height:67px; top:518px; left:47px; }
#velvet p.lines { width:445px; height:113px; top:295px; left:0; }
#velvet .chara-cv { top:684px; left:47px; }
#velvet .chara-cv a { width:175px; height:46px; }

/* ============ smart phone ============ */
@media screen and (max-width:750px){

#character h2 { width:calc(291/750*100vw); height:calc(182/750*100vw); background-size:100% auto; }
#other-character h2 { width:calc(388/750*100vw); height:calc(138/750*100vw); }

/* .item */
.slick-slide .item { height:calc(1070/750*100vw); }

/* ====== #cless ====== */
#cless h3 { width:calc(249/750*100vw); height:calc(86/750*100vw); top:calc(919/750*100vw); left:calc(87/750*100vw); }
#cless h4 { width:calc(328/750*100vw); height:calc(71/750*100vw); background-image:url('../img/cless_h4.png'); top:calc(834/750*100vw); left:calc(87/750*100vw); }
#cless p.lines { width:calc(436/750*100vw); height:calc(173/750*100vw); top:calc(546/750*100vw); left:0; }
#cless .chara-cv { top:calc(1020/750*100vw); left:calc(87/750*100vw); }
#cless .chara-cv a { width:calc(217/750*100vw); height:calc(46/750*100vw); background-size:100% auto; }

/* ====== #yuri ====== */
#yuri h3 { width:calc(156/750*100vw); height:calc(87/750*100vw); top:calc(919/750*100vw); left:calc(87/750*100vw); }
#yuri h4 { width:calc(353/750*100vw); height:calc(71/750*100vw); background-image:url('../img/yuri_h4.png'); top:calc(834/750*100vw); left:calc(87/750*100vw); }
#yuri p.lines { width:calc(436/750*100vw); height:calc(173/750*100vw); top:calc(609/750*100vw); left:0; }
#yuri .chara-cv { top:calc(1020/750*100vw); left:calc(87/750*100vw); }
#yuri .chara-cv a { width:calc(237/750*100vw); height:calc(46/750*100vw); background-size:100% auto; }

/* ====== #milla ====== */
#milla h3 { width:calc(166/750*100vw); height:calc(86/750*100vw); top:calc(919/750*100vw); left:calc(87/750*100vw); }
#milla h4 { width:calc(309/750*100vw); height:calc(71/750*100vw); background-image:url('../img/milla_h4.png'); top:calc(834/750*100vw); left:calc(87/750*100vw); }
#milla p.lines { width:calc(569/750*100vw); height:calc(171/750*100vw); top:calc(546/750*100vw); left:0; }
#milla .chara-cv { top:calc(1020/750*100vw); left:calc(87/750*100vw); }
#milla .chara-cv a { width:calc(237/750*100vw); height:calc(46/750*100vw); background-size:100% auto; }

/* ====== #velvet ====== */
#velvet h3 { width:calc(163/750*100vw); height:calc(86/750*100vw); top:calc(919/750*100vw); left:calc(87/750*100vw); }
#velvet h4 { width:calc(360/750*100vw); height:calc(71/750*100vw); background-image:url('../img/velvet_h4.png'); top:calc(834/750*100vw); left:calc(87/750*100vw); }
#velvet p.lines { width:calc(455/750*100vw); height:calc(109/750*100vw); top:calc(609/750*100vw); left:0; }
#velvet .chara-cv { top:calc(1020/750*100vw); left:calc(87/750*100vw); }
#velvet .chara-cv a { width:calc(180/750*100vw); height:calc(46/750*100vw); background-size:100% auto; }

}
/************************************************************************
  #new-feature
************************************************************************/
#new-feature-01 h3 { width:111px; height:56px; }
#new-feature-02 h3 { width:73px; height:53px; }
#new-feature-03 h3 { width:78px; height:59px; }

/* ====== #special-skit ====== */
#special-skit h3 { width:899px; height:60px; }

/* ============ smart phone ============ */
@media screen and (max-width:750px){

#new-feature-01 h3 { width:calc(137/750*100vw); height:calc(76/750*100vw); }
#new-feature-02 h3 { width:calc(90/750*100vw); height:calc(72/750*100vw); }
#new-feature-03 h3 { width:calc(90/750*100vw); height:calc(81/750*100vw); }

/* ====== #special-skit ====== */
#special-skit h3 { width:100%; height:auto; }

}
/************************************************************************
  #requirements
************************************************************************/
#requirements ul.icon li:nth-child(2) { order: 2; }
#requirements ul.icon li:nth-child(3) { order: 3; }

/* ============ smart phone ============ */
@media screen and (max-width:750px){

#requirements h2 { width:calc(411/750*100vw); height:calc(176/750*100vw); }

}
/************************************************************************
  #artist
************************************************************************/
#artist h2 { width:355px; height:112px; }

/* ============ smart phone ============ */
@media screen and (max-width:750px){

#artist h2 { width:calc(369/750*100vw); height:calc(117/750*100vw); background-repeat:no-repeat; }
#artist h3 span { display:inline-block; }

}









