@charset "utf-8";

/*** Ravijour CSS Document *******************************************

	top.css

******************************************************************* */
body{
	background-color: #FFF;
}
body.is-hidden{
  opacity:0;
}
body.is-visible{
  opacity:1;
  transition:opacity 2s ease;
}

/*========================================
 共通Css
========================================*/
#SectionBody{width:940px;margin:0 auto 50px;}
@media screen and (max-width: 768px) {
  #SectionBody{
  width:92%;
  }
}
@media screen and (max-width: 1134px) {
  #SectionBody{
  width:92%;
  }
}
/*タイトル*/

/*横並び*/
/*#SectionBody .List{display: -webkit-flex;display: flex;-webkit-justify-content: space-between;justify-content: space-between;}
*//*カラー*/

/*背景色*/
#SectionBody .List li{position: relative;}
#SectionBody .List .ttx{bottom: 0;background-color: rgba(255,255,255,0.6);font-weight: 500;position: absolute;width: 100%;}

/*========================================
 #bannerBlockCss
========================================*/
#bannerBlock .Subimage{margin: 6px 0 0 0;}
#bannerBlock a img { -webkit-transition:opacity 0.5s;-moz-transition:opacity 0.5s;-ms-transition:opacity 0.5s;-o-transition:opacity 0.5s;transition:opacity 0.5s;
  -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -o-backface-visibility: hidden; backface-visibility: hidden; }
#bannerBlock a img:hover { opacity: 0.75; }


/*========================================
 RankingCss
========================================*/


/*========================================
 CategoryCss
========================================*/
#SectionBody .CategoryList .List .ttx .En{font-size: 18px;}
#SectionBody .CategoryList .List .ttx.type1{padding: 9px 0;text-indent: 10px;}
#SectionBody .CategoryList .List .ttx.type1 .En{margin-right: 5px;}
#SectionBody .CategoryList .List .ttx.type2{line-height: 18px;padding: 5px 0px;text-align: center;}
#SectionBody .CategoryList .List .ttx.type2 span{display: block;}
/*========================================
 TopicsCss
========================================*/
#SectionBody .TopicsList .List .ttx{font-size: 14px;padding: 3px 10px 1px;min-height: 46px;}
/*========================================
 InstagramCss
========================================*/
#SectionBody .InstagramIcon:before{content: '';display: inline-block;position: relative;background: url(../images_ravi/InstagramIcon.jpg) no-repeat 50% 50%;width: 28px;height: 28px;margin: -10px 3px 0 0;vertical-align: middle;}
#SectionBody .InstagramIcon a, .SectionTitle .InstagramIcon .ja{color: #D91E78 !important;}
#SectionBody .InstagramList img{width: 100%;}
#SectionBody .InstagramList li{width: 180px;float: left;margin-left: 10px;}
#SectionBody .InstagramList li:first-child{width: 370px;margin-left: 0;}
#SectionBody .InstagramList li a:hover{opacity: 0.8;filter: alpha(opacity=80);-ms-filter: "alpha(opacity=80)";}
#SectionBody .InstagramList li:nth-child(5), .InstagramList li:nth-child(6), .InstagramList li:nth-child(7){margin-top: 10px;}

@media screen and (max-width: 768px) {
	#SectionBody .InstagramList li{width: 19.2%;float: left;margin-left: 1%;}
	#SectionBody .InstagramList li:first-child{width: 39.2%;margin-left: 0;}
	#SectionBody .InstagramList li:nth-child(5), .InstagramList li:nth-child(6), .InstagramList li:nth-child(7){margin-top: 1%;}
}
@media screen and (max-width: 1112px) {
	#SectionBody .InstagramList li{width: 19.2%;float: left;margin-left: 1%;}
	#SectionBody .InstagramList li:first-child{width: 39.2%;margin-left: 0;}
	#SectionBody .InstagramList li:nth-child(5), .InstagramList li:nth-child(6), .InstagramList li:nth-child(7){margin-top: 1%;}
}


.yotpo-slider .yotpo-display-wrapper .y-arrows .yotpo-icon-right-arrow-thin::before, .yotpo-slider .yotpo-display-wrapper .y-arrows .yotpo-icon-left-arrow-thin::before, .yotpo-visual-carousel .yotpo-display-wrapper .y-arrows .yotpo-icon-right-arrow-thin::before, .yotpo-visual-carousel .yotpo-display-wrapper .y-arrows .yotpo-icon-left-arrow-thin::before, .yotpo-pictures-widget .yotpo-display-wrapper .y-arrows .yotpo-icon-right-arrow-thin::before, .yotpo-pictures-widget .yotpo-display-wrapper .y-arrows .yotpo-icon-left-arrow-thin::before {
  font-size: 20px !important;
  margin-top: -10px !important;
}

/*========================================
 ArticleCss
========================================*/
.ArticleList dl dt.date{clear: left;float: left;color: #999;padding: 25px 0 25px 0;width: 120px;border-bottom: 1px solid #bdbbbb; font-size: 13px; letter-spacing: 0.5px; }
.ArticleList dl dd.infotxt{color: #333;border-bottom: 1px solid #bdbbbb;margin-left: 120px; font-size: 13px; letter-spacing: 0.5px; }
.ArticleList dl dd.infotxt a { display: block; padding: 25px; }
/*.ArticleList dl dd.infotxt a:hover { background: #fafafa; }*/

/*========================================
 ランキングページCss
========================================*/
#ranklistall .inner{background: #FFF;padding: 20px 0;}
#ranklistall h1{font-size: 50px;font-weight: 100;font-style: italic;}
#ranklistall h1 small{font-size: 20px; display: inline-block; margin-left: 30px;}
#ranklistall .nav{margin-top: 5px;padding: 10px 0;border-top: 1px solid #999;border-bottom: 1px solid #999;}
#ranklistall .nav li{float: left;margin-left: 10px;}
#ranklistall .nav li:first-child{margin-left: 0;}
#ranklistall .nav a{display: block;color: #000 !important;text-decoration: none;text-align: center;font-size: 13px;line-height: 25px; padding:5px 9px;width: 130px;}
#ranklistall .nav a:hover,#ranklistall .nav a.active{background: #eee; border-radius: 18px;}

#SectionBody .List .disblock li{
	display: inline-block;
	vertical-align: top;
	float: none;
	margin-bottom: 10px;
}

#SectionBody .List .disblock li:first-child, #SectionBody .List .disblock li:nth-child(2), #SectionBody .List .disblock li:nth-child(3) {
	width: 32.6%;
}
#SectionBody .List .disblock li:nth-child(4), #SectionBody .List .disblock li:nth-child(4), #SectionBody .List .disblock li:nth-child(9){margin-left: 0;}


#SectionBody .List .disblock li { -webkit-transition:opacity 0.5s;-moz-transition:opacity 0.5s;-ms-transition:opacity 0.5s;-o-transition:opacity 0.5s;transition:opacity 0.5s;
  -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -o-backface-visibility: hidden; backface-visibility: hidden; }
#SectionBody .List .disblock li:hover { opacity: 0.75; }

.content .lItem a { text-decoration: none; }