@charset "utf-8";
@media (min-width: 768px) {}
@media (max-width: 767px) {}

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { font-weight: 500}

:root{
    --c_white:#fff;
    --c_dark:#000;
    --c_base: #363636;
    --c_light:#fff;
    --c_main:#5b6467;
    --c_main2:#5b6467;
    --c_pink:rgba(255,214,219,0.9);
    --font_jp: "Zen Maru Gothic", serif;
    --font_en: "Zen Maru Gothic", serif;
}


body{
  position: relative;
  background:#fff;  
  color: #333;
  font-family: var(--font_jp);
  font-size: 16px;
  line-height: 1.7em;
  font-weight: 500;
	background-color: #ffd6db;
}
body:before{ content: ""; display: block; position: fixed; width: 100%; height: 100vh; background-image: url("//img-fan.pia.jp/main/image/e9kzqjo9/slul1sbq.png"); z-index: -1; top: 0; left: 0;background-size: 40px; background-position: center;}


.pc_only{display: initial;}
.sp_only{display: none;}
@media (max-width: 767px) {

  .pc_only{display: none;}
  .sp_only{display: initial;}
}

/*サブページ用調節
*************************/
.container {position: relative;}
.container.inner{width: 94%;padding: 160px 0 80px;}

.container.inner:after{ content: ""; display: block; position: fixed; width: 100%; height: 100vh; background-image: url("//img-fan.pia.jp/main/image/e9kzqjo9/sl6t616j.png"); z-index: -1; top: 0; left: 0; background-size: 100%; background-repeat: no-repeat; background-position: center; opacity: 0.1;}

.container .container { top: 0;  }
/*containerの中にcontainerが入っているパターンがあるため*/
/*ヘッダー固定の場合topicPathの重なり修正*/
.inner {max-width: 1100px;}
.inner .inner {padding: 0;}

@media (max-width: 767px)  {
  .container.inner{padding: 100px 0 40px;}
  .container .container { top: 0;  }
}

/*サブページ用調節ここまで
*************************/


.content {border: none;padding: 0;margin: 0;  }
.top_inner-wrap{max-width: 1000px;margin: 0 auto;width: 92%;}

/* link */
a:link, a:visited {text-decoration: underline;color: var(--c_main);}
a,a:hover{transition: 0.2s;}

#wrapper a:hover {  transition: 0.4s;  filter:alpha(opacity=60);  -moz-opacity: .6;  opacity: .6;}

.clearfix::after { content: ""; display: block; clear: both;}


/* header PC
*************************/
  header {padding: 0px 10px 0;box-sizing: border-box;height: 38px;width: 100%;color: var(--c_base);position: fixed;z-index: 10;background: var(--c_pink);box-shadow: none;border-bottom: none; }

  .siteHeading {font-size: 161.5%;float: none;z-index: 1000;position: relative;}
  .siteHeading.forPc a {position: absolute;display: block;left: 0.2%;top:10px;width: 180px;padding: 0;z-index: 100;}
  .siteHeading.forPc a img {display: block;width: 100%;margin: 0 auto;object-fit: contain;}
  .siteHeading.forSp {display: none;}
  .header_main {padding-right: 0;-moz-box-sizing: border-box;-webkit-box-sizing: border-box; box-sizing: border-box; text-align: center;position: relative;}
header .inner{max-width: inherit; /*width: 99%;*/ padding: 0;}
header .inner #header_user {margin-top: 8px;width: auto;height: auto;position: relative;z-index: 1001;/* float: right; */display: flex;box-shadow: none;background: transparent;border-left: none;}
header .inner #header_user dt {margin-right: 0;font-weight: bold;font-size: 90%;margin: 0 10px 0 0;text-align: left;width: auto;height: 20px;line-height: 20px;background: transparent;color: var(--c_main2);}
header .inner #header_user dt span {display: none;}
header .inner #header_user dd {font-size: 100%;width: auto;}
header .inner #header_user p {margin: 0;text-align: center;line-height: 20px;}
header .inner #header_user p a {text-decoration: none;background-color: var(--c_main2);color: #Fff;margin: 0;width: 80px;border: none;line-height: 1em;padding: 0.3em 0 0.4em;text-align: center;display: block;border-radius: 0;font-size: 12px;font-family: var(--font_en);font-weight: 500;}
header .inner #header_user p:nth-last-child(1) {margin: 0 0 0 5px;}



/* header SP
*************************/
@media (max-width: 767px) {
    .siteHeading.forSp {display: block;width: 120px;margin-top: 3px;padding: 0;}
    header{height: 75px;}
    header .inner #header_user{margin-top: 0;justify-content: center;padding-top: 0;margin: 0 -22px;    position: absolute;right: 20px;top: 10px;flex-direction: column;}
    header .inner #header_user dt{margin-bottom: 8px;text-align: right;margin-right: 50px; font-size: 12px;}
    header .inner #header_user dd{    display: flex;justify-content: right;}
    header .inner #header_user p a{width: 70px;font-size: 11px;line-height: 1.7em;}
    .header_main {padding-bottom: 0;}
}


/* mainNav PC
*************************/
@media (min-width: 768px) {
  #mainNav {z-index: 9;position: fixed;top: 38px;width: 100%;padding: 0;right: inherit;background: var(--c_pink);display: flex;}
  #mainNav ul.inner {position: relative;float: none;max-width: inherit;width: inherit;box-sizing: border-box;margin-left: auto;padding: 0;text-align: right;}
  #mainNav li {float: none;position: relative;margin: 0 min(2vw,20px) 0 0;display: inline-block;text-align: center;}
  #mainNav li a {color: var(--c_main);margin: 0;font-size: 16px;padding: 0.5em 0;font-weight: 600;}
  #mainNav li a:hover {opacity: 1;}
}


/* mainNav SP
*************************/
@media (max-width: 767px) {
  #mainNav {position:fixed;z-index: 10;top: 85px;width: 100%;}
  /* #mainNav:before{content: ""; position: absolute;bottom: 0;width: 100%;height: 1px;background:var(--c_base);left: 50%;transform: translateX(-50%);} */
  #mainNav ul {width: 100%;height: calc(100vh - 75px);padding: 0;background-color: var(--c_main);position: fixed;top: 75px;/*SPヘッダーの高さ*/left: 0;margin-left: 0;opacity: 0;visibility: hidden;}
  #mainNav ul.inner {padding-top: 20px;opacity: 0;transition: 0.4s;} 
  #mainNav ul li{height: auto !important;}
  #mainNav ul a {font-size: 20px;text-align: center;text-decoration: none;border-top: none;display: block;line-height: 1.5em;padding: 0.5em 0;font-family: var(--font_en);letter-spacing: 0.05em; color: #fff!important;}
  .menuOpen #mainNav ul {opacity: 1;visibility: visible;transition: 0.6s;overflow-y: scroll;}   
  .menuOpen #mainNav ul li {width: 100%;} 
  .menuOpen #mainNav ul li:last-of-type{width: 100%;background-color: var(--c_main2) !important;}
  .menuOpen #mainNav ul li:first-child {padding-top: 0;}
}


/* navSwitcher SP
*************************/
@media (max-width: 767px) {
	#navSwitcher {background-color: transparent;position: fixed;z-index: 20000;width: 30px;padding-top: 10px;padding-right: 8px;padding-bottom: 8px;padding-left: 8px;top: 10px;right: 5px;}
    
    #navSwitcher a {width: 28px;height: 8px;display: block;position: relative;border-top:1px solid var(--c_main); border-bottom: none;}
    
    .menuOpen #navSwitcher a {height: 20px;border: none;}
    .menuOpen #navSwitcher a:before {display: none;}
    #navSwitcher span {width: 100%;height: 1px;margin: 0;background-color: var(--c_main);border-radius: 50px;position: absolute;top: 0;bottom: 0;transition: 0.2s;}
    #navSwitcher .l{bottom: inherit;top: -9px;}
    #navSwitcher .r{top: inherit;width: 100%;right: 0;bottom: 0px;}
    .menuOpen #navSwitcher .l {bottom: 0;top: 0;-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-ms-transform: rotate(-45deg);-o-transform: rotate(-45deg);transform: rotate(-45deg);}
    .menuOpen #navSwitcher .r {width: 100%;right: inherit;top: 0;-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-ms-transform: rotate(45deg);-o-transform: rotate(45deg);transform: rotate(45deg);}
    .menuOpen #navSwitcher .m {opacity: 0;}
}



/********************** TOP PAGE **********************/

/* top_content_wrapper
    固定ヘッダーの高さ分のマージンをつけるためのID
*************************/
#top_content_wrapper {width: 100%;margin: 0 auto;padding-top: 81px;/*ヘッダーの高さ*/}
#top_content_wrapper:after{ content: ""; display: block; position: fixed; width: 100%; height: 100vh; background-image: url("//img-fan.pia.jp/main/image/e9kzqjo9/sl6t616j.png"); z-index: -1; top: 0; left: 0; background-size: 100%; background-repeat: no-repeat; background-position: center; opacity: 0.75;}


@media (max-width: 767px) {
 #top_content_wrapper {padding-top: 75px;/*ヘッダーの高さ*/}
}



/* h1 PC
*************************/
.contentHeading, .contentHeadingbig {
font-size: 36px;font-weight: 400;line-height: 1em;border: none;z-index: 2;font-family: var(--font_en);text-align: center;display: block;margin-bottom: 60px;padding-bottom: 0;position: relative;color: var(--c_main);    letter-spacing: 0.5em; text-indent: 0.5em;}

#top_content_wrapper .contentHeading, 
#top_content_wrapper .contentHeadingbig{color: var(--c_main);}

@media screen and (max-width: 767px) {
  .contentHeading, .contentHeadingbig{margin-bottom: 40px; font-size: 30px; letter-spacing: 0.4em;}
  .contentHeading::after, .contentHeadingbig::after{bottom: -24px;font-size: 12px;}
}


/* sub menu
*************************/
.sp_sub_menu{display: none !important;}

.pc_sub_menu .menu_tit{display: block;width: 220px;text-align: center;padding: 0.5em 0;background-color: var(--c_main);color: #fff;font-size: 16px; font-weight: 600; cursor: pointer;box-sizing: border-box;display: flex;justify-content: center;align-items: normal; background-image: url("//img-fan.pia.jp/main/image/e9kzqjo9/evczftqf.png"); background-repeat: no-repeat; background-position:95% center; background-size: 10px;}

.pc_sub_menu .menu_list{position: absolute;background-color:var(--c_main2);height: 0;opacity: 0;transition: 0.4s;overflow: hidden;pointer-events: none; margin-top: -10px;}

.pc_sub_menu:hover .menu_list{height: auto;opacity: 1;pointer-events: inherit; padding:25px 0; margin-top: 0;}

.pc_sub_menu .menu_list .menu_logo{width: 60%;margin:0 auto 15px;display: block;}
.pc_sub_menu .menu_list ul{display: flex;flex-direction: column;}
.pc_sub_menu .menu_list ul li{margin: 0 !important;}
.pc_sub_menu .menu_list ul li a{color: #fff!important;font-size: 18px !important;line-height: 1em !important;padding: 0.7em 0 !important;}
.pc_sub_menu .menu_list ul li a:hover{ opacity: 0.7!important;}

@media screen and (max-width: 767px) {
  .pc_sub_menu{display: none;}
  .sp_sub_menu .menu_tit{ background-color: #fff; color: var(--c_main);font-size: 16px;text-align: center;margin: 0 auto 1.2em; padding: 0.5em 0;}
  .sp_sub_menu{background-color: #fff !important;padding: 0 0 20px 0;display: block !important; margin-top: 2em;}

  .sp_sub_menu .menu_list .menu_logo{width: 30%;display: block;margin: 0 auto 12px;}
  .sp_sub_menu .menu_list ul{position: relative !important;top: 0 !important;background-color: transparent !important;}
  .sp_sub_menu .menu_list li{padding: 0 !important;height: 40px !important;}
  .sp_sub_menu .menu_list li a{color: var(--c_main) !important;}

  .menuOpen .sp_sub_menu{height: auto !important; }
  .menuOpen .sp_sub_menu .menu_list ul{height: 100% !important;}
}


/* Main img 
*************************/
.top_main {position: relative;padding: 0;margin-bottom: 0; display: flex; align-items: center; padding-top: 10px;}
.top_main img {width: 100%;height: auto;}

.top_main .left{ width: 50%;  box-sizing: border-box;  position: relative; height: calc(100vh - 111px); max-height: 44vw;}
.top_main .left .txt{position: absolute; width: 100%; top: 41%;transform: translate(0, -50%);}
.top_main .left .txt h1{ width: 76%; margin: 0 auto;}

.top_main .right{ width: 50%;padding-right: 3%; box-sizing: border-box;   }
.top_main .right figure{ border-radius: 100%; overflow: hidden;}

@media screen and (max-width: 767px) {
  .top_main{padding: 0; flex-wrap: wrap; flex-direction: column-reverse; width: 90%; margin: 0 auto 100px; padding-top: 10px;}
	
	.top_main .left{ width:100%; padding: 0; height: auto; max-height: inherit; padding-top:15px;}
	.top_main .left .txt{ position: inherit; transform: none;}
	.top_main .right{ width: 100%; padding: 0; }
	
	
	
}



/* TOP update 
*************************/
.top_update{margin: 160px auto;}
.top_update #updatebox .update_flex{display: flex;align-items: flex-start;justify-content: space-between;}

.top_update #updatebox .heading-wrap{width: 100%;display: block;}

.top_update #updatebox dl{margin: 0 auto 40px;background-color: #fff;padding: 0 40px;}

.top_update #updatebox dl a {text-decoration: none;position: relative; color: #333;display: flex; border-bottom: 1px solid #eee;padding: 2.5em 0;}

.top_update #updatebox dl a:hover:after{right: -0.6em; transition: 0.2s;}

.top_update #updatebox dt{width: 6em; font-size: 18px;color: var(--c_main); font-weight: 600;}
.top_update #updatebox dd{border-color: var(--c_light);width: calc(100% - 6em);font-weight: 500;}

/* btn */
.btn_box a{font-size: 18px;display: block;position: relative;text-align: center;text-decoration: none;color: #fff;background-color: var(--c_main);width: min(420px);padding: 1.2em 0;margin: 0 auto; font-weight: 600; box-sizing: border-box;}

.btn_box a:after{position: absolute;content: "";transition: 0.2s;width: 0;height: 0;top: 50%;right: 5%;transform: translateY(-50%);background-image: url("//img-fan.pia.jp/main/image/e9kzqjo9/fhnnm2o1.png");background-position: center;background-repeat: no-repeat;background-size: contain;width: 8px;height: 10px;}


@media (max-width: 767px) {
  .top_update{margin: 40px 0 80px;}
  .top_update #updatebox .heading-wrap .btn_box{width: 40%;text-align: right;}

  .top_update #updatebox .update_flex{flex-direction: column;}

  .top_update #updatebox dl{padding: 0 20px;width: 100%;box-sizing: border-box;margin: 0 auto 20px;}
  .top_update #updatebox dl a{flex-direction: column;padding: 1.5em 0;}
  /* .top_update #updatebox dl a:after{width: 2em;height: 2em;} */
  .top_update #updatebox dt{width: 100%;}
  .top_update #updatebox dd{width: 100%;}
	
	.btn_box a{font-size: 16px;width: 100%;}
	.btn_box a:after{width: 12px;height: 12px;}
}



/* TOP movie 
*************************/
.top_movie {width: 100%;background-color: var(--c_main);padding: 120px 0;position: relative;z-index: 1;overflow: hidden;}
.top_movie .top_inner-wrap .contentHeading{color: #fff;}
.top_movie .top_inner-wrap .contentHeading::after{left: 50%; transform: translateX(-50%);}
.top_movie_inner {max-width: 1180px;width: 90%;margin: 0 auto;display: flex;}
.top_movie_inner li {flex-basis: 100%;}
.top_movie .movie{ position: relative; width: 100%;padding-top: 56.25%;}
.top_movie .movie iframe{ position: absolute; top: 0; right: 0; width: 100%; height: 100%;}
.top_movie .movie_box {padding: 0;border: none;width: 100%;position: relative;border: none;box-sizing: border-box;margin-bottom: 40px;}

.top_movie .bg_box{position: absolute;width: 100%;height: 100%;top: 0;left: 0;z-index: -1;}
.top_movie .bg_box .deco{position: absolute;width: 85%;}
.top_movie .bg_box .deco.d_01{top: 0;left: 0;}
.top_movie .bg_box .deco.d_02{bottom: 0;right: 0;}

.top_movie .btn_box a{color: var(--c_main);background-color: #fff;}
.top_movie .btn_box a:after{background-image: url("//img-fan.pia.jp/main/image/e9kzqjo9/fhnnm2o1.png");}

@media (max-width: 767px) {
  .top_movie{padding: 80px 0;}
  .top_movie .movie_box{margin-bottom: 20px;}
}



/* TOP sns
*************************/
#sns_box{padding: 160px 0;background-color: rgba(255,255,255, 0.5);}
#sns_box .contents_box{}
#sns_box .contents_box figure{padding: 60px 0; border-radius: 30px; width: 100%;margin: 0 auto 40px;text-align: center;}
#sns_box .contents_box figure img{width: 35%;}
#sns_box .contents_box .btn_flex{display: flex;justify-content: center;gap: 0 2%;}
#sns_box .contents_box .btn_flex .btn_box{width: 49%;}
#sns_box .contents_box .btn_flex .btn_box a{width: 100%;font-size: 22px;padding: 1.1em 0;}

.sns_flex{display: flex;justify-content: center;gap: 0 20px;width: 100%;margin: 8vw auto;}
.sns_flex .sns_banner a{display: block; width: 75px;}
.sns_flex .sns_banner a img{width: 100%;}

@media (max-width: 767px) {
  #sns_box{padding: 80px 0;}
  #sns_box .contents_box{width: 100%;margin: 0 auto 0px;}
  #sns_box .contents_box figure{padding: 40px 0;margin: 0 auto 20px;}
  #sns_box .contents_box figure img{width: 60%;}
  #sns_box .contents_box .btn_flex{flex-direction: column;gap: 16px 0;}
  #sns_box .contents_box .btn_flex .btn_box{width: 100%;margin: 0 auto;}
  #sns_box .contents_box .btn_flex .btn_box a{font-size: 20px;}
  .sns_flex{width: 80%; margin: 50px auto;}
    .sns_flex .sns_banner a{ width: 55px;}
}



/* TOP page-top 
*************************/
  .pageTop {position: fixed;padding: 0;bottom: 20px;right: 20px;z-index: 20;}
  .pageTop a {width: 50px;height: 50px;line-height: 50px;border-radius: 50%;background: url("//img-fan.pia.jp/main/image/e9kzqjo9/h3f4l31o.png") 50% 50%/90% auto no-repeat var(--c_main);text-indent: -9999px!important;text-decoration: none;color: #fff;padding: 0;text-align: center;display: block;}

@media (max-width: 767px) {
  .pageTop {bottom: 0;}
  .pageTop a {width: 40px;height: 40px;line-height: 40px;}
}


/* footer
*************************/

footer{color: var(--c_main);background-color: #fff;padding: 40px 0 80px;position: relative;}

footer a:link, footer a:visited{color: var(--c_main);text-decoration: none;font-size: 14px;}
footer nav ul {margin-bottom: 3em;text-align: center;}
footer nav li {margin: 0 1em .5em;display: inline-block;}
.copyright {text-align: center;/* font-family: var(--font_en); */font-weight: 600;}

@media (max-width: 767px) {
  footer {padding: 40px 0;}
  footer a:link, footer a:visited{ font-size: 12px;}
  footer nav ul{display: flex;flex-wrap: wrap;justify-content: center;margin-bottom: 6vw;}
  footer nav li{width: 46%;margin: 0 0 4vw;}
}


.news{margin: 0;}
.newsItem a {padding: 24px 16px 16px;}
.newsList {border-top: none;}


/* ================================= add =================================== */
.fix_wrap{position: fixed;width: 100%;height: 100%;top: 0;left: 0;pointer-events: none;z-index: -1;}
.fix_wrap .bg{position: absolute;width: 50%;right: 0;top: 50%;transform: translateY(-50%);height: 100%;}
.fix_wrap .bg img{height: 100%;opacity: .5;}
.fix_wrap .text{position: absolute;top: 50%;transform: translateY(-50%);left: 1%;}