@charset "utf-8";

img{max-width:100%;height: auto;}

/*エリア_1*/

/*エリア_2*/
.left2_text{font-size: 20px;line-height: 1.3;margin-bottom: 10px;}/*色はindex_partsで指定*/
.dtm{display: flex;justify-content: center;}
.title_dtm{font-family: 'Oswald', sans-serif;text-align: center;
  line-height: 1.4; letter-spacing: 0.1em;padding: 20px 0 0px;
  font-size:20px;color: silver;}
.kasi{border-radius: 5px;background: black;color:tan;
      font-size: 15px;padding: 1px 20px 3px 20px;
      margin:35px 0 0 20px;}
.kasi:hover{background-color: tan;color: black;}
audio{width: 70%;margin:10px auto -5px;}
/*========= 貧弱アイコンの回転 ===============*/
.dtm_ikon{text-align: center;margin: 10px auto;}
.dtm_ikon{width:70px;}/*LEFT_2 画像*/
.maru{transform: translateY(-50%) translateX(-50%);}
.maru{animation: rotation-s2 10s linear infinite;
  	 right: calc(50% - 5px);top: calc(50% - 5px);}

/*エリア_3
 LEFT_3 のパーツの配置*/
.jyuliyancom{color:limegreen;font-size: 20px;margin-top: 0px;margin-bottom: -50px;}
.jyuliyan_enter{color:limegreen;}
.inst{color:darkorange;font-size: 20px;margin-top: 0px;margin-bottom: -50px;}
.inst_enter{color:darkorange;}
.dtm_for_cubase{color:tan;font-size: 30px;margin-top: 20px;}
.btn_cubase_enter span{color:tan;}
.kaiinsenyou{font-size: 15px;color:gold;margin-top:-13px;}/*会員専用*/
.sp-bottom .idtopass{font-size: 12px;padding-top: -5px;color:gold;}/*ユーザーIDとパスワードが必要にゃ*/
.clock{font-size: 30px;color:#FFCCCC;letter-spacing: 0.2em;margin: 0 0 30px 0;}
.calender{font-size: 30px;color:#EEE8AA;letter-spacing: 0.2em;margin: 0 0 30px 0;}
.date_top{font-size: 30px;line-height: 1.2;color:white;position: absolute;top:30px;}
.date_bottm{display: none;}

/*エリア_6
  LEFT_6 位置指定*/
#left6 .sp-bottom
	{position: absolute;
	top:50%;left:50%;
	transform: translate(-50%,-50%);}
#left6 .sp-bottom p
	{margin:0 0 0px 0;
	    letter-spacing: 0.3em;
	    white-space: nowrap;}
  /*LEFT_6 のパーツの配置*/
.sp-bottom .jyuliyan_com{font-size: 25px;padding-top:50px;color:white;}
.sp-bottom .for-pc{display: none;}/*文字「HPのURL」*/
.qr{width:100px;padding-bottom: 30px;}
.sp-bottom .for-mobile{font-size: 20px;color:white;padding-top:30px;}/*文字「for MOBILE」*/
.sp-bottom .gamensize{font-size: 15px;color:tan;height: 45px;padding-top: 8px;
	border-left: 2px solid tan;
	border-top: 2px solid tan;
	border-right: 2px solid tan;background: darkred;}
.sp-bottom .ttc21{font-size: 15px;color:tan;height: 43px;padding-top: 8px;
	border-left: 2px solid tan;
	border-right: 2px solid tan;background: darkgreen;}
.sp-bottom .index_2022{font-size: 15px;color:tan;height: 45px;padding-top: 8px;
	border-left: 2px solid tan;
	border-bottom: 2px solid tan;
	border-right: 2px solid tan;background: black;}
.sp-bottom .gamensize:hover{color:yellow;}
.sp-bottom .ttc21:hover{color:yellow;}
.sp-bottom .index_2022:hover{color:yellow;}
.jasrak_mark{width:auto;height: 50px;margin: 30px auto 0;}
.sp-bottom .jasrak_no{font-size: 15px;padding-bottom: 50px;color:white;}


/*===========================================================*/
/*レスポンシブ*/
/*===========================================================*/

/*＝＝＝＝＝＝＝＝＝＝＝1000px以下＝＝＝＝＝＝＝＝＝＝＝＝＝*/
@media screen and (max-width:1000px)
{
audio{width:90%;margin:0px auto -10px;}
.title_dtm{line-height: 1.4; letter-spacing: 0.1em;padding: 20px 0 20px;
  font-size:20px;color: silver;}
.kasi{border-radius: 5px;background: black;color:tan;
      font-size: 15px;padding: 1px 20px 3px 20px;
      margin:35px 0 0 20px;}
.for-mobile{font-size: 15px;}/*文字「for MOBILE」*/
.dtm_for_cubase{font-size: 30px;margin-top: 20px;}
.kaiinsenyou{font-size: 15px;margin-top:-13px;}/*会員専用*/
.idtopass{font-size: 12px;padding-top: -5px;}/*ユーザーIDとパスワードが必要にゃ*/
.btn_cubase_enter span{color:tan;}
}
/*＝＝＝＝＝＝＝＝＝＝＝700px以下＝＝＝＝＝＝＝＝＝＝＝＝＝*/
@media screen and (max-width:700px)
{
/*エリア_2*/
.left2_text{font-size: 15px;line-height: 1.2;margin-bottom: 10px;}/*LEFT_2*/
.left2_text{line-height: 2;}
.title_dtm{line-height: 1.4; letter-spacing: 0.1em;padding: 20px 0 20px;
  font-size:15px;color: silver;}
.kasi{border-radius: 5px;background: hotpink;color:black;
      font-size: 15px;padding: 1px 10px 3px 10px;
      margin:25px 0 0 10px;}

audio{width:250px;height: 40px;margin:1px auto -10px;}
.dtm_ikon{width:40px;margin-top:-100px;}/*LEFT_2 画像*/

/*エリア_3
  LEFT_3 のパーツの配置*/
.dtm_for_cubase{font-size: 23px;margin-top: 20px;}
.kaiinsenyou{font-size: 15px;margin-top:-10px;}/*会員専用*/
.idtopass{font-size: 10px;padding-top: -5px;}/*ユーザーIDとパスワードが必要にゃ*/
/*RIGHT_3 のパーツの配置*/
.right3_wrap{text-align: center;}
.for-mobile{font-size: 15px;}/*文字「for MOBILE」*/
#right3{/*RIGHT_3 画像 天地左右center*/
	background:url("p_r_3.jpg") no-repeat center;
	background-size:cover;}

/*エリア_4_NYANKO CLOCK CALENDER*/
.clock{font-size: 20px;color:#FFCCCC;}
.calender{font-size: 20px;margin-top: -20px;color:#EEE8AA;}
#right4{/*RIGHT_4 画像 天地左右center*/
	background:url("p_r_4.jpg") no-repeat center;
	background-size:cover;}

/*エリア_5 imagのみ*/
#left5{/*LEFT_5 画像 天地左右center*/
	background:url("p_l_5.jpg") no-repeat center;
	background-size:cover;}
#right5{/*RIGHT_5 画像 天地左右center*/
	background:url("p_r_5.jpg") no-repeat center;
	background-size:cover;}

/*エリア_6 END*/
#right6{/*RIGHT_6 画像 天地左右center*/
	background:url("p_r_6.jpg") no-repeat center;
	background-size:cover;}
.qr{width:100px;}
.for-mobile{font-size: 20px;color:white;padding-top:30px;}/*文字「for MOBILE」*/
.jasrak_mark{width:auto;height: 50px;margin: 30px auto 0;}
.jasrak_no{font-size: 12px;color:#CCCCCC;padding-bottom: 50px;}
}
/*＝＝＝＝＝＝＝＝＝＝＝550px以下＝＝＝＝＝＝＝＝＝＝＝＝＝*/
@media screen and (max-width:550px)
{
.left2_text{line-height: 2;}
.dtm_ikon{width:40px;margin-top:-10px;}/*LEFT_2 画像*/
.jyuliyancom,.inst{font-size: 15px;margin-bottom: -30px;}
.jyuliyan_enter,.inst_enter{font-size: 10px;}
.btn_cubase_enter{margin-top:5px;}
.kaiinsenyou{font-size: 10px;}
.dtm_for_cubase{font-size: 23px;margin-top: -20px;}
.kaiinsenyou{font-size: 15px;margin-top:-10px;}/*会員専用*/
.idtopass{font-size: 10px;padding-top: -5px;}/*ユーザーIDとパスワードが必要にゃ*/

audio{width:250px;height: 40px;margin:1px auto -10px;}

#left1{/*天地左右center*/
  background:url("p_r_1.jpg") center;
  background-size:cover;}
#left2 .sp-top{/*天地左右center*/
	background:url("p_cubase_3.png") no-repeat center;
	background-size:cover;height: 50vh;}
#left3 .sp-top{/*天地左右center*/
	background:url("p_l_3_small.jpg") no-repeat center;
	background-size:cover;height: 50vh;}
#left4 .sp-top{/*天地左右center*/
	background:url("p_r_4.jpg") no-repeat center;
	background-size:cover;height: 50vh;}
	.date_bottm{display: block;font-size: 20px;line-height: 1.2;
		color:white;position: absolute;top:40px;left:20px;}
	.date_top{display: none;}
#left5 .sp-top{/*天地左右center*/
	background:url("p_l_5_sa.jpg") no-repeat center;
	background-size:cover;height: 50vh;}
#left5 .sp-bottom{/*天地左右center*/
	background:url("p_l_5_sb.jpg") no-repeat center;
	background-size:cover;height: 50vh;}
#left6{/*天地左右center*/
	background:url("p_r_6_s.jpg") no-repeat center;
	background-size:cover;}
}
/*＝＝＝＝＝＝＝＝＝＝＝401px以下＝＝＝＝＝＝＝＝＝＝＝＝＝*/
@media screen and (max-width:401px)
{
.left2_text{line-height: 2;}

.title_dtm{line-height: 1.4; letter-spacing: 0.1em;padding: 0px 0 0px;
          font-size:16px;color: silver;}
.kasi{font-size: 13px;padding: 1px 10px 3px 10px;
              margin:10px 0 0 12px;}
#left1{/*天地左右center*/
	background:url("p_r_1_mobile.jpg") center;
	background-size:cover;}
#left3 .sp-top{
	background:url("p_l_3_mobile.jpg") no-repeat center;
	background-size:cover;height: 35vh;}
#left4 .sp-top{
	background:url("p_r_4_mobile.jpg") no-repeat center;
	background-size:cover;height: 40vh;}
#left5 .sp-bottom{
	background:url("p_l_5_mobile.jpg") no-repeat center;
	background-size:cover;height: 100vh;}
#left6{
	background:url("p_r_6_mobile.jpg") no-repeat center;
	background-size:cover;}
.dtm_ikon{margin: 80px auto 10px;}
/*LEFT_3 のパーツの配置 　※　btnの大きさは index_btn.css で指定*/
.jyuliyancom{color:limegreen;font-size: 15px;margin-top: 0px;margin-bottom: -28px;}
.jyuliyan_enter{font-size: 10px;color:limegreen;}
.inst{color:darkorange;font-size: 15px;margin-top: 0px;margin-bottom: -29px;}
.inst_enter{font-size: 10px;color:darkorange;}
.btn_cubase_enter{margin-top:5px;}
.btn_cubase_enter span{color:tan;}
.dtm_for_cubase{font-size:18px;margin-top: -35px;}
.kaiinsenyou{font-size: 12px;margin-top:-10px;}/*会員専用*/
.idtopass{font-size: 10px;padding-top: -5px;}/*ユーザーIDとパスワードが必要にゃ*/

audio{width:250px;height: 40px;margin:10px auto -10px;}
.clock{margin-top:50px;}
.qr{display: none;}
.for-mobile{display: none;}/*文字「for MOBILE」*/
.sp-bottom .for-pc/*文字「HPのURL」*/
{display: block;padding-top:5px;padding-bottom: 30px;font-size: 10px;color:white;}
.sp-bottom .gamensize,.sp-bottom .ttc21,.sp-bottom .index_2022
{font-size: 12px;padding-top: 11px;}
.sp-bottom .jasrak_no{font-size: 12px;padding-bottom: 50px;color:white;}

}
/*＝＝＝＝＝＝＝＝＝＝＝321px以下＝＝＝＝＝＝＝＝＝＝＝＝＝*/
@media screen and (max-width:321px)
{
.title_dtm{line-height: 1.4; letter-spacing: 0.1em;margin: 0px 0 10px;
            font-size:15px;color: silver;}
.kasi{font-size: 12px;padding: 2px 10px 3px 10px;margin:7px 0 0 5px;}
#left3 .sp-top{
background:url("p_l_3_mobile.jpg") no-repeat center;
background-size:cover;height: 25vh;}
#left5 .sp-top{/*入れないことにした*/
height: 0vh;}
#left5 .sp-bottom{
background:url("p_l_5_mobile.jpg") no-repeat center;
background-size:cover;height: 100vh;}

.clock{font-size: 15px;margin-top:0px;}
.calender{font-size:15px;margin-top:-25px;}
.dtm_ikon{width:30px;margin: 5px auto 0px;}
audio{width:230px;height: 35px;margin:5px auto -10px;}

/*LEFT_6 のパーツの配置*/
.sp-bottom .jyuliyan_com{font-size: 23px;padding-top:60px;}
.sp-bottom .gamensize{font-size: 12px;height: 45px;padding-top: 8px;}
.sp-bottom .ttc21{font-size: 12px;height: 43px;padding-top: 8px;}
.sp-bottom .index_2022{font-size: 12px;height: 45px;padding-top: 8px;}
.jasrak_mark{width:auto;height: 50px;margin: 20px auto 0;}
.sp-bottom .jasrak_no{font-size: 10px;padding-bottom: 50px;color:white;}

}