@charset "SHIFT-JIS";

#membership {
width: 100vw;
position: relative;
left: 50%;
right: 50%;
margin-left: -50vw;
margin-right: -50vw;
padding-bottom: 10px;
}
#membership p.report-text {
padding: 50px 20px 40px;
font-size: 25px;
text-align: center;
}
/* ---------------------------------------------
fanevent
--------------------------------------------- */
#membership #fanevent {
padding: 60px 0 50px;
background-color: #f6f5f3;
}
/* ----------イベント概要 */
#membership #fanevent #fanevent-outline {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
#membership #fanevent #fanevent-outline .main-image {
width: 470px;
}
#membership #fanevent #fanevent-outline .main-image img {
width: 100%;
vertical-align: bottom;
}
#membership #fanevent #fanevent-outline .outlie-text {
width: 448px;
padding-right: 35px;
}
#membership #fanevent #fanevent-outline .outlie-text .title-text {
margin-bottom: 20px; margin-top: -0.5em;
text-align: left;
line-height: 1.8;
font-family: 'Noto Serif JP', serif;
font-weight: normal;
font-size: 30px;
}
#membership #fanevent #fanevent-outline .outlie-text p {
font-size: 18px;
line-height: 1.8;
}
/* ---------------------------------------------
参加者の声
--------------------------------------------- */
#membership #voice {
padding: 80px 0 60px;
}
#membership #voice .w980 .title-text {
margin-bottom: 20px;
padding: 0 20px;
text-align: left;
font-size: 25px;
}
#membership #voice .w980 .voice-container {
margin: 0 30px;
}
#membership #voice .w980 .voice-container dl {
padding: 0 15px;
border-bottom: 1px solid #edeceb;
}
#membership #voice .w980 .voice-container dt {
margin-bottom: 3px;
padding-top: 15px;
font-size: 13px;
vertical-align: top;
}
#membership #voice .w980 .voice-container dt::before {
content: "";
display: inline-block;
width: 32px;
height: 27px;
margin-right: 12px;
background: url(/images/ms/com/balloon.png) left center no-repeat;
background-size: auto 100%;
vertical-align: top;
}
#membership #voice .w980 .voice-container dt span.name-text,
#membership #voice .w980 .voice-container dt span.star-text {
font-size: 18px;
}
#membership #voice .w980 .voice-container dt span.name-text {
font-weight: bold;
}
#membership #voice .w980 .voice-container dd {
padding-bottom: 15px;
font-size: 16px;
line-height: 1.8;
}
/* ---------------------------------------------
動画
--------------------------------------------- */
#membership #fanevent-movie { padding: 80px 0 0; }
#membership #fanevent-movie div.movie-cotainer { width:850px; margin: 0 auto 0; }
#membership #fanevent-movie .movie-cotainer .movie_area { position:relative; padding-bottom:56.25%; padding-top:0; height:0; overflow:hidden; margin-bottom:70px; }
#membership #fanevent-movie .movie-cotainer .movie_area iframe { position:absolute; top:0; left:0; width:100%; height:100%;}
#membership #fanevent-movie  div.movie-cotainer .movie-title { margin-bottom:10px; text-align:center; font-size:20px; }


/* ---------------------------------------------
floatImage
--------------------------------------------- */
#membership #floatImage {
    padding: 50px 0 80px;
}
#membership #floatImage .floatImage-container .floatImage {
    display: flex;
    gap: 2.4rem;
}
#membership #floatImage .floatImage-container .floatImage .imageArea {
    flex: 0 0 auto;
    max-width: 52%;
}
#membership #floatImage .floatImage-container .floatImage .imageArea img {
    width: 100%;
}
#membership #floatImage .floatImage-container .floatImage .caption {
    display: inline-block;
    padding: 10px;
    color: #717171;
}
#membership #floatImage .floatImage-container .floatImage .textArea {
    flex: 1 1 100%;
    word-break: break-all;
}
#membership #floatImage .floatImage-container .floatImage .textArea .title {
    font-weight: bold;
    font-size: 22px;
    margin-bottom: 3px;
    border-top:none;
	border-bottom:none;
	padding:0px;
	width:auto;
}
#membership #floatImage .floatImage-container .floatImage .textArea .text {
    font-size: 16px;
    margin:0;
    line-height: 1.8;
}

#membership #floatImage .floatImage-container .floatImage + .floatImage {
    margin-top: 60px;
}

#floatImage + #voice{
 border-top: 1px solid #cfcfcf;
 width:980px;
 margin: 0 auto;
}


/* ---------------------------------------------
  前に戻る
 --------------------------------------------- */

#bottom_navigation {
 padding: 0 0 80px;
 text-align: center;
}

#bottom_navigation div a {
 display: block;
 width: 360px;
 margin: 0 auto;
 border-radius: 10px;
 border: 1px solid #ddd;
 letter-spacing: 0.05em;
 line-height: 55px;
 font-size: 18px;
 font-weight: bold;
 text-decoration: none;
 color: #666;
}

#bottom_navigation div a:hover {
 opacity: .7;
}

/* ---------------------------------------------
common
--------------------------------------------- */
#membership .w980 { width: 980px; margin-left: auto; margin-right: auto; }
#membership .separate { border-top: 20px solid #eee; }
#membership .title-text { font-size: 30px; font-weight: bold; margin-bottom: 40px; text-align: center; }
#membership .membership-button { text-align: center; }
#membership a:hover { opacity: 0.7; }
.pagetop {
position: fixed;
right: 30px;
bottom: 50px;
z-index: 20;
}
.pagetop a {
overflow: hidden;
display: inline-block;
text-indent: 200%;
white-space: nowrap;
vertical-align: middle;
line-height: 1;
background-image: url("/com/images/common/common-img-sprite.png");
background-repeat: no-repeat;
width: 50px;
height: 50px;
background-position: 0 -1277px;
}