@charset "utf-8";
/*
	common.css
*/

/* =================================
   @BASE
================================= */

body {
  background-color: #fff1fb;
  color: #563c3c;
  font-size: 1.4rem;
  line-height: 1.5;
  vertical-align: bottom;
}

/* IE10用 フォントサイズ指定 */
@media all and (-ms-high-contrast: none) {
  body {
    font-size: 14px;
  }
}
a {
  color: #563c3c;
  cursor: pointer;
  text-decoration: underline;
}
a:hover {
  text-decoration:none;
}

/* ==========================================================
	PC表示 @media screen and (min-width: 641px)
========================================================== */

@media screen and (min-width:641px) {

  *[class^="sp_"],
  *[id^="sp_"] {
	display: none !important;
  }
  #wrapper {
	width: 100%;
	min-width: 1000px;
	font-family: "メイリオ", Meiryo, sans-serif;
	overflow: hidden;
  }

  /* =================================
    @HEADER
  ================================= */

  header {
    background: url(/tv/precure/images/shared/bg_header_pc.png) repeat-x center top;
    width: 100%;
    min-width: 1000px;
    height: 150px;
    position: relative;
    z-index: 9999;
  }
  #pc_header {
    width: 1030px;
    margin: 0 auto;
    position: relative;
  }
  #pc_header .sns_btn {
    text-align: center;
    margin: 3px 15px 0 0;
    position: absolute;
    right: 0;
  }
  #pc_header .sns_btn li {
    display: inline-block;
    line-height: 0.8;
    margin: 0 0 0 10px;
  }
  #pc_header .navi {
    width: 1030px;
    height: 100px;
    padding: 0;
    margin: 0 auto;
    /* position: relative; */
  }
  #pc_header .navi li {
    float: left;
    position: absolute;
  }
  #pc_header .navi li.navi_top {
    top: 0;
    left: 50%;
    margin: 0 0 0 -70px;
    z-index: 5;
  }
  #pc_header .navi li.navi_news {
    top: 48px;
    left: 50%;
    margin: 0 0 0 -515px;
    z-index: 1;
  }
  #pc_header .navi li.navi_info {
    top: 16px;
    left: 50%;
    margin: 0 0 0 -393px;
    z-index: 2;
  }
  #pc_header .navi li.navi_story {
    top: 28px;
    left: 50%;
    margin: 0 0 0 -287px;
    z-index: 3;
  }
  #pc_header .navi li.navi_character {
    top: 0;
    left: 50%;
    margin: 0 0 0 -188px;
    z-index: 4;
  }
  #pc_header .navi li.navi_episode {
    top: 0;
    right: 50%;
    margin: 0 -195px 0 0;
    z-index: 4;
  }
  #pc_header .navi li.navi_recipe {
    top: 36px;
    right: 50%;
    margin: 0 -296px 0 0;
    z-index: 3;
  }
  #pc_header .navi li.navi_goods {
    top: 25px;
    right: 50%;
    margin: 0 -406px 0 0;
    z-index: 2;
  }
  #pc_header .navi li.navi_special {
    top: 45px;
    right: 50%;
    margin: 0 -515px 0 0;
    z-index: 1;
  }
  #pc_header li a{
    display: block;
  }
  /* トップ */
  #pc_header li.navi_top a{
    background: url(/tv/precure/images/shared/nav_splrite_01.png) no-repeat center top;
    width: 140px;
    height: 130px;
  }
  #pc_header li.navi_top a:hover,
  #top #pc_header li.navi_top a{
    background: url(/tv/precure/images/shared/nav_splrite_01.png) no-repeat center bottom;
  }
  /* ニュース */
  #pc_header li.navi_news a{
    background: url(/tv/precure/images/shared/nav_splrite_02.png) no-repeat center top;
    width: 134px;
    height: 100px;
  }
  #pc_header li.navi_news a:hover,
  #news #pc_header li.navi_news a{
    background: url(/tv/precure/images/shared/nav_splrite_02.png) no-repeat center bottom;
  }
  /* 作品情報 */
  #pc_header li.navi_info a{
    background: url(/tv/precure/images/shared/nav_splrite_03.png) no-repeat center top;
    width: 116px;
    height: 100px;
  }
  #pc_header li.navi_info a:hover,
  #info #pc_header li.navi_info a{
    background: url(/tv/precure/images/shared/nav_splrite_03.png) no-repeat center bottom;
  }
  /* ストーリー */
  #pc_header li.navi_story a{
    background: url(/tv/precure/images/shared/nav_splrite_04.png) no-repeat center top;
    width: 116px;
    height: 100px;
  }
  #pc_header li.navi_story a:hover,
  #story #pc_header li.navi_story a{
    background: url(/tv/precure/images/shared/nav_splrite_04.png) no-repeat center bottom;
  }
  /* キャラクター */
  #pc_header li.navi_character a{
    background: url(/tv/precure/images/shared/nav_splrite_05.png) no-repeat center top;
    width: 124px;
    height: 100px;
  }
  #pc_header li.navi_character a:hover,
  #character #pc_header li.navi_character a{
    background: url(/tv/precure/images/shared/nav_splrite_05.png) no-repeat center bottom;
  }
  /* 各話あらすじ */
  #pc_header li.navi_episode span{
    background: url(/tv/precure/images/shared/nav_soon_06.png) no-repeat center top;
    display: block;
    width: 134px;
    height: 100px;
  }  
  #pc_header li.navi_episode a{
    background: url(/tv/precure/images/shared/nav_splrite_06.png) no-repeat center top;
    width: 134px;
    height: 100px;
  }
  #pc_header li.navi_episode a:hover,
  #episode #pc_header li.navi_episode a{
    background: url(/tv/precure/images/shared/nav_splrite_06.png) no-repeat center bottom;
  }
  /* レシピ */
  #pc_header li.navi_recipe a{
    background: url(/tv/precure/images/shared/nav_splrite_07.png) no-repeat center top;
    width: 116px;
    height: 100px;
  }
  #pc_header li.navi_recipe a:hover,
  #recipe #pc_header li.navi_recipe a{
    background: url(/tv/precure/images/shared/nav_splrite_07.png) no-repeat center bottom;
  }
  /* グッズ */
  #pc_header li.navi_goods a{
    background: url(/tv/precure/images/shared/nav_splrite_08.png) no-repeat center top;
    width: 120px;
    height: 100px;
  }
  #pc_header li.navi_goods a:hover,
  #goods #pc_header li.navi_goods a{
    background: url(/tv/precure/images/shared/nav_splrite_08.png) no-repeat center bottom;
  }
  /* スペシャル */
  #pc_header li.navi_special a{
    background: url(/tv/precure/images/shared/nav_splrite_09.png) no-repeat center top;
    width: 126px;
    height: 100px;
  }
  #pc_header li.navi_special a:hover,
  #special #pc_header li.navi_special a{
    background: url(/tv/precure/images/shared/nav_splrite_09.png) no-repeat center bottom;
  }

  /* =================================
	@CONTENSTS
  ================================= */

  /* 下層共通 */
  .h2_area{
    position: relative;
    background: url(/tv/precure/images/shared/bg_contents_top.png) repeat-x center bottom,
    url(/tv/precure/images/shared/bg_h2_in02.png) no-repeat center center,
    url(/tv/precure/images/shared/bg_h2_in.jpg) repeat-x center top;
    height: 359px;
    margin: -190px 0 0 0;
    padding: 184px 0 0 0;
    z-index: 2;
  }
  #episode .h2_area,
  #goods .h2_area {
    padding: 168px 0 0 0;
  }
  .h2_area h2{
    width: 640px;
    margin: 0 auto;
  }
  #wrapper.in{
    background: url(/tv/precure/images/shared/bg_in.jpg) repeat center top;
    min-width: 1000px;
  }
  .in_page{
    position: relative;
    background: url(/tv/precure/images/shared/bg_in_contents02.png) no-repeat center top,
    url(/tv/precure/images/shared/bg_in_contents.png) repeat-y center top;
    height: auto;
    margin: -7px 0 0 0;
    padding: 0 0 50px 0;
    z-index: 2;
  }

  /* sNavi */
  .sNavi ul {
    background: url(../images/shared/bg_sNavi.png)no-repeat center top;
    width: 610px;
    height: 54px;
    margin: 0 0 0 -305px;
    font-size: 0;
    text-align: center;
    position: absolute;
    top: -40px;
    left: 50%;
  }
  .sNavi li {
    display: inline-block;
  }
  /* SNS AREA */
  .sns_area {
    background: url(/tv/precure/images/shared/bg_sns_area.png) no-repeat center 0;
    background-size: 100% auto;
    width: 273px;
    height: 87px;
    font-size: 0;
    text-align: center;
    padding: 25px 0;
    margin: 0 auto;
  }
  .sns_area li {
    display: inline-block;
    margin: 0 0 0 8px;
  }
  .sns_area li:first-child {
    margin: 0;
  }
  .sns_area li img {
    width: 39px;
    height: 39px;
  }

  /* =================================
	@FOOTER
  ================================= */
  footer {
	background: url(/tv/precure/images/shared/bg_footer_top.png) repeat-x center top;
	width: 100%;
	min-width: 1000px;
	text-align: center;
  margin: -16px 0 0;
	padding: 16px 0 0;
  position: relative;
  z-index: 3;
  }
  footer .footer_container {
  	background-color: #fff1fb;
	padding: 20px 0 40px;
  }
  footer .inner {
	width: 1000px;
	margin: 0 auto;
  }
  footer .title_logolist {
  font-size: 0;
	text-align: center;
  }
  footer .title_logolist li {
	display: inline-block;
	margin: 0 0 0 10px;
  }
  footer .title_logolist li:first-child {
	margin: 0;
  }
  footer .banner_list {
  	width: 970px;
	margin: 5px auto 10px;
  }
  footer .banner_list li {
	float: left;
	margin: 0 0 10px 10px;
  }
  footer .banner_list li:first-child,
  footer .banner_list li:nth-child(6){
	margin: 0;
  }
  footer .copyright {
  	font-size: 1.3rem;
  	color: #812a2e;
  	padding: 10px 0 0;
   }

  /* =================================
	@PAGE TOP
  ================================= */
  .btn_page_top {
    position: fixed;
    right: 10px;
    bottom: 20px;
    z-index: 9999;
  }
  .btn_page_top a {
  	background: url(/tv/precure/images/shared/btn_pagetop.png) no-repeat;
  	width: 100px;
  	height: 98px;
  	text-indent: -9999px;
  	display: block;
  }
}

/* ==========================================================
  SP表示 @media screen and (max-width: 640px)
========================================================== */

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

  *[class^="pc_"],
  *[id^="pc_"] {
	display: none !important;
  }
  #wrapper {
	width: 100%;
	max-width: 640px;
	font-family: "メイリオ", Meiryo, sans-serif;
	overflow: hidden;
  }
  img {
	width: 100%;
	max-width: 100%;
	height: auto;
  }

  /* =================================
	@HEADER
  ================================= */

  header {
    width: 100%;
    position: relative;
    z-index: 9999;
  }
  #sp_header {
    background: url(/tv/precure/images/shared/bg_header_sp.jpg) repeat-x center top;
    background-size: 175px 52px;
    height: 52px;
  }
  #sp_header .sns_btn {
    text-align: center;
    position: absolute;
    top: 28px;
  }
  #sp_header .sns_btn li {
    display: inline-block;
    line-height: 0.8;
    margin: 0 0 0 2px;
  }
  #sp_header .logo {
  	width: 73px;
  	height: 74px;
  	position: absolute;
  	top: 0;
  	left: 50%;
  	margin: 0 0 0 -37px;
	z-index: 9999;
  }
  #sp_header .btn_navi {
    width: 118px; /*アイコン横幅*/
    height: 46px; /*アイコン縦高さ*/
    position: absolute;
    top: 4px;
    right: 4px;
  }
  .sp_navi,
  .sp_chara_navi {
    width: 100%;
    position: relative;
    display: none;
  }
  .sp_header_bottom {
    background: url(/tv/precure/images/shared/bg_header_bottom_sp.png) repeat-x center top;
    background-size: 99px 38px;
    height: 38px;
    display: block;
  }

  /* 東映アニメーションヘッダー SP時非表示
  ------------------------------------ */
  .common_head {
	 display: none;
  }

  /* =================================
	@CONTENTS
  ================================= */

  /* 下層共通 */
  .h2_area{
    display: table;
    position: relative;
    background:url(/tv/precure/images/shared/bg_h2_in02.png) no-repeat center center,
    url(/tv/precure/images/shared/bg_h2_in.jpg) repeat-x center top;
    height: auto;
    margin: -180px 0 0 0;
    padding: 184px 0 30px 0;
    z-index: 2;
  }
  .h2_area h2{
    display: table-cell;
    width: 100%;
    margin: 0 auto;
    vertical-align: middle;
  }
  #wrapper.in{
    background: url(/tv/precure/images/shared/bg_in.jpg) repeat center top;
    min-width: 100%;
  }
  #contents .contents_top {
    background: url(/tv/precure/images/shared/bg_contents_top.png) repeat-x center 0;
    background-size: 600px 34px;
    height: 34px;
    padding: 34px 0 0;
    margin: -30px 0 0;
    position: relative;
    z-index: 10;
  }
  .in_page{
    position: relative;
    background: url(/tv/precure/images/shared/bg_in_contents.png) repeat-y center top;
    height: auto;
    margin: -7px 0 0 0;
    padding: 0 0 40px 0;
    z-index: 1;
  }
  /* sNavi */
  .sNavi ul {
    display: none;
  }
  /* SNS AREA */
  .sns_area {
    background: url(/tv/precure/images/shared/bg_sns_area.png) no-repeat center 0;
    background-size: 100% auto;
    width: 273px;
    height: 87px;
    font-size: 0;
    text-align: center;
    padding: 25px 0;
    margin: 0 auto;
  }
  .sns_area li {
    display: inline-block;
    margin: 0 0 0 8px;
  }
  .sns_area li:first-child {
    margin: 0;
  }
  .sns_area li img {
    width: 39px;
    height: 39px;
  }

  /* =================================
	@FOOTER
  ================================= */
  footer {
  	background: url(/tv/precure/images/shared/bg_footer_top.png) repeat-x center top;
  	background-size: 31px 8px;
  	width: 100%;
  	text-align: center;
    margin: -8px 0 0;
  	padding: 8px 0 0;
    position: relative;
    z-index: 3;
  }
  footer .footer_container {
  	background-color: #fff1fb;
  	font-size: 0;
    padding: 15px 0 30px;
  }
  footer .title_logolist {
    margin: 0 auto 15px;
  }
  footer .title_logolist li {
  	display: inline-block;
  	margin: 0 0 0 5px;
  }
  footer .title_logolist li:first-child {
    margin: 0;
  }
  footer .banner_list {
  	width: 100%;
  	font-size: 0;
  	padding: 0 4%;
    margin: 0 auto;
    overflow: hidden;
  }
  footer .banner_list li {
  	width: 49%;
  	margin: 0 0 10px 2%;
  	float: left;
  }
  footer .banner_list li:nth-child(odd){
    margin: 0 0 10px;
  }
  footer .copyright {
  	font-size: 1.3rem;
  	color: #812a2e;
  	padding: 10px 0 0;
  }

  /* 過去タイトルバナー 縦横指定*/
  footer .title_logolist li.logo01 img {
  	width: 56px;
  	height: 35px;
  }
  footer .title_logolist li.logo02 img {
  	width: 66px;
  	height: 35px;
  }
  footer .title_logolist li.logo03 img {
  	width: 66px;
  	height: 35px;
  }
  footer .title_logolist li.logo04 img {
	width: 56px;
	height: 35px;
  }
  footer .title_logolist li.logo05 img {
	width: 69px;
	height: 35px;
  }
  footer .title_logolist li.logo06 img {
	width: 62px;
	height: 35px;
  }
  footer .title_logolist li.logo07 img {
	width: 73px;
	height: 35px;
  }
  footer .title_logolist li.logo08 img {
	width: 67px;
	height: 35px;
  }
  footer .title_logolist li.logo09 img {
	width: 67px;
	height: 35px;
  }
  footer .title_logolist li.logo10 img {
	width: 67px;
	height: 35px;
  }
  footer .title_logolist li.logo11 img {
	width: 86px;
	height: 35px;
  }
  footer .title_logolist li.logo12 img {
	width: 65px;
	height: 35px;
  }
  footer .title_logolist li.logo13 img {
	width: 45px;
	height: 35px;
  }

  /* =================================
	@PAGE TOP
  ================================= */
  .btn_page_top {
    position: fixed;
    right: 5px;
    bottom: 10px;
    z-index: 9999;
  }
  .btn_page_top a {
  	background: url(/tv/precure/images/shared/btn_pagetop.png) no-repeat;
  	background-size: 100% auto;
  	width: 50px;
  	height: 49px;
  	text-indent: -9999px;
  	display: block;
  }
}


/* ムービーボタン */
.pMovie{position:relative;display:block;}
.playImage{position:absolute;top:10px;left:0px;z-index:3000;opacity:0.7;}
a:hover img.playImage{opacity:0.4;}

.movieout{position:relative;width:100% !important;padding-top:56.25%;margin:20px 0 30px;display:block;}
.movieout iframe{position:absolute;width:100%;height:100%;top:0px;right:0px;}

/* コンテンツ内SNSボタン */
.conSnsArea{float:right;overflow:hidden;margin:-10px 30px -70px 0 !important;padding:0px !important;display:block;z-index:6000;width:auto !important;}
.conSnsArea li{display:block;float:left  !important;margin:0 0 0 10px !important;width:auto !important;padding:0px !important;}
.conSnsArea li:nth-last-child(1){margin-right:0%;}
.conSnsArea li div{padding:0px !important;margin:0px!important;width:auto!important;}

