@charset "utf-8";


/* トップページ
---------------------------------------------------*/


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

	.cardList { margin-top: 20px; width: 100%; }
	/* 今週のカード部分 */

	/* テキスト1行
	.cardFirst { position: relative; margin: 0 auto 0 auto; padding: 225px 0 0 40px; width: 980px; height: 860px; background:  url(../card/04/images/bg_weekly_pc_190530.png) 0 0 no-repeat; background-size: contain; box-sizing: border-box; box-sizing: border-box; } */
	/* テキスト1行 名前2行 
	.cardFirst { position: relative; margin: 0 auto 0 auto; padding: 225px 0 0 40px; width: 980px; height: 941px; background:  url(../card/04/images/bg_weekly_pc_190530.png) 0 0 no-repeat; background-size: contain; box-sizing: border-box; box-sizing: border-box; } */
	/*テキスト2行 */
	 /*.cardFirst { position: relative; margin: 0 auto 0 auto; padding: 265px 0 0 40px; width: 980px; height: 901px; background:  url(../card/04/images/bg_weekly_pc_190620.png) 0 0 no-repeat; background-size: contain; box-sizing: border-box; box-sizing: border-box; }
	/* テキスト3行 	
	.cardFirst { position: relative; z-index: 1; margin: 0 auto 0 auto; padding: 300px 0 0 40px; width: 980px; height: 941px; background:  url(../card/01/images/bg_weekly_pc_181122.png) 0 0 no-repeat; background-size: contain; box-sizing: border-box; box-sizing: border-box; }*/
	/* テキスト2行 画像が3行*/
	 .cardFirst { position: relative; margin: 0 auto 0 auto; padding: 265px 0 0 40px; width: 980px; height: 1200px; background:  url(../card/04/images/bg_weekly_pc_190627.png) 0 0 no-repeat; background-size: contain; box-sizing: border-box; box-sizing: border-box; }
	/* テキスト1行 画像が3行 
	.cardFirst { position: relative; margin: 0 auto 0 auto; padding: 225px 0 0 40px; width: 980px; height: 1190px; background:  url(../card/04/images/bg_weekly_pc_190607.png) 0 0 no-repeat; background-size: contain; box-sizing: border-box; box-sizing: border-box; }*/
	.cardFirst .cardList .rare { margin-top: -5px; color: #fff; font-size: 1.4rem; }
	.cardFirst .cardList .name { color: #ff0; font-weight: bold; line-height: 1.4; }

	.navList { position: relative; margin-bottom: 10px; }
	.navList li { float: left; padding-bottom: 10px; width: 224px; box-sizing: border-box; }
	.navList li img { height: auto; }
    .navList li.rare6 { padding-right: 10px; width: 218px; }
	.navList li.rare5 { padding-right: 10px; width: 218px; }
	.navList li.rare4 { padding-right: 10px; width: 218px; }
	.navList li.rare3 { padding-right: 10px; width: 168px; }
	.navList li.rare2 { padding-right: 10px; width: 168px; }
	.navList li.rare1 { padding-right: 10px; width: 168px; }
	.navList li.rare0 { width: 158px; }
	
	.navText { position: relative; margin-bottom: 20px; }
	.navText li { float: left; margin-right: 8px; margin-bottom: 10px; width: 140px; font-size: 1.3rem; text-align: center; }
	/*.navText li:last-child { margin-right: 0; }*/
	.navText li a { display: block; padding: 6px 15px 6px 0; box-sizing: border-box; background-image: url(../card/images/arrow.png); background-repeat: no-repeat; background-position: right -5px center; background-color: #00329a; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; color: #fff }
	.navText li a:hover { background-color: rgba(0,63,188,0.5); color: #fff; }
	
	.navText li.navCp,
	.navText li.navGr,
	.navText li.navSc { width: 140px; }
	.navText li.navUr { width: 180px; }
	.navText li.navRa,
	.navText li.navCm { width: 120px; }
    .navText li.navCt { width: 180px; }
	.navText li.none { background: #ccc; color: #fff; background-image: none; padding: 5px 15px 5px 0; box-sizing: border-box;border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; }
 	.navText li.navSc { margin-right: 0;  }
	.navText.adjust li { margin-right: 1.25%; width: 19%; }
	.navText.adjust li:last-child { margin-right: 0; }
	
	
	
	/*.navText li a.rare5 { background: #947C42; }
	.navText li a.rare4 {}
	.navText li a.rare3 {}
	.navText li a.rare2 {}
	.navText li a.rare1 {}
	.navText li a.rare0 {}*/
	
	
	.cardList { margin-bottom: 40px; width: 880px; }
	.cardList li { float: left; margin: 0 0 20px 0; width: 20%; text-align: center; }
	.cardList li img { width: 94%; }
	.cardList li dd { padding-top: 5px; text-align: center; }
	.cardList.last { margin-bottom: 0; }
	/*.cardList.last li { margin-bottom: 0; }	*/

	/* 3*3 */
	.cardFirst .cardList { width: 550px; }
	.cardFirst .cardList li { margin-bottom: 15px; width: 33%; }
	
	/* 3*5 */
	.cardFirst .cardList { width: 900px;  }
	.cardFirst .cardList li { margin-bottom: 15px; width: 20%; }
	.cardFirst .cardList li.adjust { clear: both; }
	
	#rare5List .rare,
	#rare4List .rare,
	#rare3List .rare,
	#rare2List .rare,
	#rare1List .rare,
	#rare0List .rare{ display: none; }

	.modalWindow .modalInner { overflow: auto; margin: 0 auto; padding-bottom: 10px; width: 720px; height: 560px; }
	.modalWindow .modalInner .skill { padding: 0 120px 20px 120px; }
	.modalWindow .modalInner .chara { padding: 0 200px 20px 200px; }
	.modalWindow .modalInner img { width: 100%; }
	.modalWindow .modalInner .front { float: left; width: 350px; }
	.modalWindow .modalInner .front img { width: 100%; }
	.modalWindow .modalInner .back  { float: right; width: 350px; }
    .modalWindow .modalInner.single {  overflow: auto; margin: 0 auto; padding-bottom: 10px; width: 360px; height: 560px;}
	
}
@media screen and (max-width: 767px) {
	.navList { margin-top: -36vw; position: relative; margin-bottom: 10px; }
	.navList li { float: left; padding-bottom: 10px; width: 50%; box-sizing: border-box; }
	.navList li.rare4 { padding-right: 5px; }
	.navList li.rare3 { padding-left: 5px; }
	.navList li.rare2 { padding-right: 5px; }
	.navList li.rare1 { padding-left: 5px; }
	.navList li.rare0 { padding-right: 5px; }


	.navCard { margin-bottom: 10px; padding: 8px 2px; color: #fff; box-sizing: border-box;border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px;  }
	.navCard dt { margin-bottom: 1px; background: #00329a; padding: 8px 15px 8px 10px; background-image: url(../card/images/arrow.png);background-repeat: no-repeat; background-position: right 0px center; font-size: 3.73333333vw; cursor: pointer; }
	.navText { position: relative; margin-bottom: 20px; }
	.navText li { position: relative;margin-bottom: 1px; font-size: 3.73333333vw; }
	.navText li a { display: block; padding: 8px 15px 8px 10px; box-sizing: border-box;   background-color: rgba(0,63,188,0.5); color: #fff;color: #fff }
	.navText li a:hover { background-color: rgba(0,63,188,0.5); color: #fff; }
	.navText li.none { background: #ccc; color: #fff; background-image: none; padding: 8px 15px 8px 10px; }
	.navText li:last-child { border-bottom: none; }

	.navText  li a::after { position: absolute; top: 50%; content: ''; width: 7px; height: 7px; border: 0px; border-top: solid 2px #fff; border-right: solid 2px #fff; -ms-transform: rotate(135deg); -webkit-transform: rotate(135deg); transform: rotate(135deg); right: 15px; margin-top: -5px; }
	/*.navText  li a:hover::after {border-top: solid 2px #000; border-right: solid 2px #000; }*/


	/* 通常のカード部分 */
	.cardList { position: relative; margin: 10px 0 20px 0 ; }
	.cardList li { float: left; margin-bottom: 10px; padding: 0 3px; width: 50%; text-align: center; box-sizing: border-box; }
	.cardList li dd { font-size: 3.73333333vw; }

	/* 今週のカード部分 */
	/* 6枚 2行  .cardFirst { position: relative; padding: 34.1333333vw 2vw 20px 2vw; height: 258vw; background: url(../card/04/images/bg_weekly_190620.png) 0 0 no-repeat; background-size: contain; box-sizing: border-box; }*/
	/* 6枚 3行 .cardFirst { position: relative; padding: 38vw 2vw 20px 2vw; height: 258vw; background: url(../card/01/images/bg_weekly_190110.png) 0 0 no-repeat; background-size: contain; box-sizing: border-box; }
	/* 8枚 1行  .cardFirst { position: relative; padding: 27vw 2vw 20px 2vw; height: 325vw; background:  url(../card/04/images/bg_weekly_190530.png) 0 0 no-repeat; background-size: contain; box-sizing: border-box; }*/
	/* 8枚 2行  .cardFirst { position: relative; padding: 32.5vw 2vw 20px 2vw; height: 325vw; background:  url(../card/04/images/bg_weekly_190530.png) 0 0 no-repeat; background-size: contain; box-sizing: border-box; }*/
	/* 8枚 3行 .cardFirst { position: relative; padding: 38vw 2vw 20px 2vw; height: 335vw; background:  url(../card/03/images/bg_weekly_190418.png) 0 0 no-repeat; background-size: contain; box-sizing: border-box; }*/
	/*10枚 3行 .cardFirst { position: relative; padding: 38vw 2vw 20px 2vw; height: 405vw; background: url(../card/01/images/bg_weekly_181122.png) 0 0 no-repeat; background-size: contain; box-sizing: border-box; }*/
	/*10枚 2行  .cardFirst { position: relative; padding: 32.5vw 2vw 20px 2vw; height: 400vw; background: url(../card/04/images/bg_weekly_190523.png) 0 0 no-repeat; background-size: contain; box-sizing: border-box; }*/
	/*10枚 1行 .cardFirst { position: relative; padding: 33vw 2vw 20px 2vw; height: 405vw; background: url(../card/02/images/bg_weekly_190214.png) 0 0 no-repeat; background-size: contain; box-sizing: border-box; }*/
	/*12枚 2行   .cardFirst { position: relative; padding: 32.5vw 2vw 20px 2vw; height: 472vw; background: url(../card/04/images/bg_weekly_190607.png) 0 0 no-repeat; background-size: contain; box-sizing: border-box; }*/
	/*15枚 2行 */ .cardFirst { position: relative; padding: 32.5vw 2vw 20px 2vw; height: 615vw; background: url(../card/04/images/bg_weekly_190627.png) 0 0 no-repeat; background-size: contain; box-sizing: border-box; }
	
	
	/* テキストが3行 */
	.cardFirst .cardList { margin-top: 40px!important; }
	/* テキストが2行 */
	.cardFirst .cardList { margin-top: 20px!important; }
	.cardFirst .cardList .rare { margin-top: -2px; color: #fff; font-size: 3.2vw; }
	.cardFirst .cardList .name { color: #ff0; font-size: 3.73333333vw; line-height: 1.0; }

	/* モーダル画面調整  */
	.modalWindow .modalInner { overflow: scroll; padding-bottom: 10px; width: 92vw; height: 140vw;  }
	.modalWindow .modalInner .skill { padding-top: 10px; }
	
	#rare4List .rare,
	#rare3List .rare,
	#rare2List .rare,
	#rare1List .rare,
	#rare0List .rare{ display: none; }

}