@charset "UTF-8";

.komoji {
  font-size: 0.9em;
  color:#696969;
}

.akamoji {
  color:#EB6167;
  font-weight: bold;
}

/* PC画面用（ウィンドウ幅が769px以上の場合に適用） */

@media print,screen and (min-width: 769px) {
	
/* ※一式価格あり用 */
.noshi_kakaku{
width: 660px;
margin:2% 0% 2% 15%;
}

.noshi_kakaku2{
width: 460px;
margin:2% 0% 2% 28%;
}
	
.akamoji_big {
  font-size: 1.3em;
  font-weight: bold;
  color:#EB6167;	
  margin-top:3%; 
  padding-left:10%; 
}
	
.kuromoji_big {
  font-size: 1.2em;
  font-weight: bold;
  padding-left:1%;
  padding-top:1%;
}
	
.aomoji {
  color:#0099CC;
  font-weight: bold;
}
	
.nav_btn ul {
  list-style-type: none; /*箇条書きのポッチを消す*/
  text-align:center /*左右中央寄せは親要素に対して指定*/
}
	
.nav_btn ul li { 
  display: inline-block;/*inline-blockにします*/
  width: 220px;/*幅も指定できる*/
  padding: 10px 0;/*余白も指定できる*/
  margin: 20px 0px 30px 0px;/*余白も指定できる*/
  vertical-align: middle;/*縦の表示位置も指定できる*/
  font-weight: bold;/*文字を太字に*/
  font-size: 1.3em;/*文字サイズ*/
}	

.btn1 {
  display: inline-block;
  padding: 0.6em 1.5em 0.4em 1.5em;
  text-decoration: none;
  color: #EB6167;
  border: solid 2px #EB6167;
  border-radius: 10px;
  transition: .4s;
}

.btn1:hover {
  background: #FFFFCC;
  color: #EB6167;
}
	
.btn1:visited {
  text-decoration: none;
  color: #EB6167;
}

.noshi_midashi {
  font-size: 1.3em;
  font-weight: bold;
  color:#EB6167;
  border-bottom: solid 3px #EB6167;
  margin:10px 0px 0px 10px;
  padding-bottom:3px;
}
	
.noshi_midashi2 {
  font-size: 1.2em;
  font-weight: bold;
  color:#9FA0A0;
  border-bottom: dotted 2px #9FA0A0;
  margin:10px 0px 10px 10px;
  padding-bottom:3px;
}
	
.noshi_midashi_t {
  padding-left:1%;
}	
	
.noshi_haba {
  width: 800px;
  margin:10px auto;
}
	
.maki_img {
  width: 700px;
  margin:20px auto;
  margin-bottom:70px;
}	
	
.uchinoshi {
  width: 360px;
  height:220px;
  background-image:url("/novelty-rapping/images/noshi/uchinoshi.jpg");
  background-repeat: no-repeat;
  image-rendering: -webkit-optimize-contrast;
}
	
.sotonoshi {
  width: 360px;
  height:220px;
  background-image:url("/novelty-rapping/images/noshi/sotonoshi.jpg");
  background-repeat: no-repeat;
  image-rendering: -webkit-optimize-contrast;
}	
	
.maki_name {
  font-size: 1.5em;
  font-weight: bold;
  color:#782800;
  text-align:center;
  padding-top:20px;
}
	
.maki_text {
  font-weight: bold;	
  text-align:center;
  padding:120px 0px 0px 10px;
  color:#782800;
}
	
.print_about {
  width: 800px;
  margin:10px 0px 10px 10px;
}	
	
.print_about img{
  width: 720px;
  height:300px;
  margin:10px 0px 10px 40px;
  image-rendering: -webkit-optimize-contrast;
}
	
.img_up {
  position: relative;
  }	

.img_up p {
  position: absolute;
  top: 82%;/*画像の左上に配置*/
  left: 83%;
  margin: 0; /*余計な隙間を除く*/
  color: white;/*文字を白に*/
  background: gray;/*背景色*/
  font-size: 1.2em;
  line-height: 1;/*行高は1に*/
  padding: 6px 10px 4px 10px;/*文字周りの余白*/
  }	

.print_example {
  width: 800px;
  text-align:center;
  font-size: 1.5em;
  font-weight: bold;
  margin:20px 0px 70px 0px;
}	
	
.print_btn {
  padding: 0.4em 7em 0.2em 7em;
  text-decoration: none;
  color: #0099CC;
  border: solid 2px #0099CC;
  border-radius: 10px;
  transition: .4s;
}

.print_btn:hover {
  background: #FFFFCC;
  color: #0099CC;
}
	
.print_btn:visited {
  text-decoration: none;
  color: #0099CC;
}
	
.mizuhiki_midashi2 {
  font-size: 1.2em;
  font-weight: bold;
  color:#0099CC;
  margin:10px 0px -10px 85px;
}	
	
.mizuhiki_text {
  font-size: 1.2em;
  font-weight: bold;
  color:#EB6167;
  margin: 10px 0px 10px 0px;	
}	
	
.mizuhiki_table{
  width: 800px;
  margin:20px auto;
  margin-bottom:30px;	
  }	
	
.mizuhiki_table td{
  padding: 5px;
  }
	
.mizuhiki_text2 {
  font-size: 1.1em;
  line-height: 1.3em;
  margin-top:5px;
}
	
.mizuhiki_img {
  width: 650px;
  margin:20px auto;
  margin-bottom:70px;
}	
	
.mizuhiki_img_up {
  position: relative;
  }

.mizuhiki_img_up p {
  position: absolute;
  top: 80%;/*画像の左上に配置*/
  left: 68%;
  margin: 0; /*余計な隙間を除く*/
  color: white;/*文字を白に*/
  background: gray;/*背景色*/
  font-size: 1.2em;
  line-height: 1;/*行高は1に*/
  padding: 6px 10px 4px 10px;/*文字周りの余白*/
  }
	
.mizuhiki_img_p{
  font-size: 1.1em;
  color:gray;
  margin:0px 0px -2px 12px;
  }	

/*サブページ用*/	
.example h2{
  display: none;
}
	
.example_p {
  width: 860px;	
  color: #006699;/*文字色*/
  padding: 0.6em 0em 0.4em 0em;/*上下の余白*/
  border-top: solid 3px #006699;/*上線*/
  border-bottom: solid 3px #006699;/*下線*/
  font-size: 1.4em;	
  font-weight: bold;
  margin: 20px auto;
}		
	
.example_table {
  border-collapse: collapse;
  margin-top: 20px;
  margin-bottom: 20px;
}
	
.example_table th {
  border: solid 1px black;
  padding: 10px;
}
	
.example_table td {
  border: solid 1px black;
  padding: 5px;
}	
	
.example_table th {
  background: #D9D9D9;
}	
	
.example_any {
  font-weight: bold;
  background: #E2EFDA;
  text-align:center;
}
	
.example_sotugyo {
  font-weight: bold;
  background: #FCE4D6;
  text-align:center;
}
	
.example_open {
  font-weight: bold;
  background: #D9E1F2;
  text-align:center;
}
	
.example_other {
  font-weight: bold;
  background: #FFF2CC;
  text-align:center;
}
	
.example_text {
  text-align:center;
}
	
.meigi_akamoji {
  color:#EB6167;
  font-weight: bold;
  margin-top: 50px;
}	
	
.meigi_table {
  margin-top: -50px;
  margin-bottom: 20px;
}

.meigi_table td{
  font-size: 1.1em;
  line-height: 1.3em;
  vertical-align: top;
  padding-top: 50px;
}
	
.meigi_table p{
  margin-top: 20px;
}	
	
.meigi_midashi {
  color:#0099CC;
  font-weight: bold;
  font-size: 1.2em;
  line-height: 1.2em;
  margin-left: -2px;
  margin-bottom: -15px;
}
	
.meigi_img {
  width: 400px;
  image-rendering: -webkit-optimize-contrast;
}	
	
.meigi_img_up {
  position: relative;
  }

.meigi_img_up p {
  position: absolute;
  top: 89%;/*画像の左上に配置*/
  left: 82%;
  margin: 0; /*余計な隙間を除く*/
  color: white;/*文字を白に*/
  background: gray;/*背景色*/
  font-size: 1em;
  line-height: 1;/*行高は1に*/
  padding: 6px 10px 4px 10px;/*文字周りの余白*/
  text-align:center;
  }
	
.about_rapping {
  width: 600px;
  font-size: 1.3em;
  font-weight: bold;
  margin:70px 0px 30px 190px;
}	
	
	
	
}
	
/* SP画面用（ウィンドウ幅が768px以下の場合に適用） */

@media screen and (max-width: 768px) {	
	
.noshi_kakaku,.noshi_kakaku2{
width: 100%;
margin:5% auto;
}	
	
	
.akamoji_big {
  font-size: 1.15em;
  font-weight: bold;
  color:#EB6167;
  text-align:center;	
  margin :2% 0% 3% 3%;  
}
	
.kuromoji_big {
  font-size: 1em;
  font-weight: bold;
  text-align:center;
  margin-top :3%; 
  margin-bottom :3%; 
}
	
.kuromoji_big2 {
  font-size: 1.1em;
  font-weight: bold;
  margin :-2% 0% 2% 0%; 
}	
	
.nav_btn ul {
  list-style-type: none; /*箇条書きのポッチを消す*/
  text-align:center /*左右中央寄せは親要素に対して指定*/
}
	
.nav_btn ul li { 
  display: inline-block;/*inline-blockにします*/
  width: 45%;/*幅も指定できる*/
  padding: 2% 0;/*余白も指定できる*/
  margin: 0% 1.5% 5% 0%;/*余白も指定できる*/
  vertical-align: middle;/*縦の表示位置も指定できる*/
  font-weight: bold;/*文字を太字に*/
  font-size: 1.1em;/*文字サイズ*/
}
	
.btn1 {
  display: inline-block;
  padding: 0.6em 1em 0.4em 1em;
  text-decoration: none;
  color: #EB6167;
  border: solid 2px #EB6167;
  border-radius: 10px;
  transition: .4s;
  font-size: 0.9em;
  font-weight: bold;
}
	
.btn1:visited {
  text-decoration: none;
  color: #EB6167;
}
	
.btn1 a{
  text-decoration: none;
  color: #EB6167;
  font-weight: bold;
  font-size: 0.9em;
}	
	
.noshi_haba {
  width: 90%;
  margin:5% auto;
}
	
.noshi_midashi {
  font-size: 1.1em;
  font-weight: bold;
  color:#EB6167;
  border-bottom: solid 3px #EB6167;
  margin:5% 0% 0% 2%;
  padding-bottom:1%;
}
	
.noshi_midashi2 {
  font-size: 1.1em;
  font-weight: bold;
  color:#9FA0A0;
  border-bottom: dotted 2px #9FA0A0;
  margin:5% 0% 3% 2%;
  padding-bottom:1%;
}
	
.noshi_midashi_t {
  font-size: 0.9em;
  padding-left:1%;
  margin-bottom:8%;
}	
	
.maki_img {
  width: 95%;
  margin:12% 0% 5% 2.5%;
}
	
.uchinoshi {
  width: 100%;
  background-image:url("/novelty-rapping/images/noshi/uchinoshi.jpg");
  background-repeat: no-repeat;
  background-size:contain;	
}
	
.sotonoshi {
  width: 100%;
  background-image:url("/novelty-rapping/images/noshi/sotonoshi.jpg");
  background-repeat: no-repeat;
  background-size:contain;
  margin-top:5%;
}	
	
.maki_name {
  font-size: 1.1em;
  font-weight: bold;
  color:#782800;
  text-align:center;
  padding-top:5%;
  margin-top:-10%;	
}
	
.maki_text {
  font-weight: bold;	
  text-align:center;
  padding:35% 0% 15% 5%;
  color:#782800;
  line-height: 1.3em;
  font-size: 0.8em;
}	
	
.print_about {
  width: 90%;
  margin:5% 0% 5% 2.5%;
}
	
	
.img_up {
  position: relative;
  margin:5% auto;	
  }
	
.img_up img{
  width: 98%;
  image-rendering: -webkit-optimize-contrast;
  }	

.img_up p {
  position: absolute;
  top: 82%;/*画像の左上に配置*/
  left: 70%;
  margin: 0; /*余計な隙間を除く*/
  color: white;/*文字を白に*/
  background: gray;/*背景色*/
  font-size: 1em;
  line-height: 1;/*行高は1に*/
  padding: 2% 5% 2% 5%;/*文字周りの余白*/
  }	

.print_example {
  width: 95%;
  text-align:center;
  font-size: 1.1em;
  font-weight: bold;
  margin:13% 0%;
}	
	
.print_btn {
  padding: 0.4em 1em 0.2em 1em;
  text-decoration: none;
  color: #0099CC;
  border: solid 2px #0099CC;
  border-radius: 10px;
  transition: .4s;
}
	
.print_btn:visited {
  text-decoration: none;
  color: #0099CC;
}
	
.mizuhiki_midashi2 {
  font-size: 0.9em;
  font-weight: bold;
  color:#0099CC;
  margin:0% 0% -3% 5%;
}
	
.mizuhiki_about_p{
  font-size: 0.8em;
}	
	
.mizuhiki_text {
  font-size: 1.1em;
  font-weight: bold;
  color:#EB6167;	
  margin :5% 0%; 
}
	
.mizuhiki_table{
  width: 95%;
  margin:-2% 0% 5% 2.5%;
  }	
	
.mizuhiki_table td{
  padding: 2%;
  }
	
.mizuhiki_table img{
  width: 100%;
  }	
	
.mizuhiki_text2 {
  font-size: 0.9em;
  line-height: 1.3em;
  padding: 0% 0% 5% 2%;
}
	
.mizuhiki_img {
  width: 95%;
  margin:5% auto;
  margin-bottom:20%;
}
	
.mizuhiki_img img{
  width: 100%;
}	
	
.mizuhiki_img_up {
  position: relative;
  }

.mizuhiki_img_up p {
  position: absolute;
  top: 85%;/*画像の左上に配置*/
  left: 55%;
  margin: 0; /*余計な隙間を除く*/
  color: white;/*文字を白に*/
  background: gray;/*背景色*/
  font-size: 1em;
  line-height: 1;/*行高は1に*/
  padding: 2% 5% 2% 5%;/*文字周りの余白*/
  }
	
.mizuhiki_img_p{
  font-size: 1em;
  color:gray;
  margin:0px 0px -2px 12px;
  }	

/*サブページ用*/	
.example h2{
	display: none;
	}
	
.example_p {
  width: 95%;	
  color: #006699;/*文字色*/
  padding: 0.6em 0em 0.4em 0em;/*上下の余白*/
  border-top: solid 3px #006699;/*上線*/
  border-bottom: solid 3px #006699;/*下線*/
  font-size: 1.3em;	
  font-weight: bold;
  margin: 5% auto;
}
	
.example_table {
  width: 95%;	
  border-collapse: collapse;
  margin-top: 10%;
  margin-bottom: 10%;
}
	
.example_table th {
  border: solid 1px black;
  padding: 2%;
  font-size: 0.9em;	
}
	
.example_table td {
  border: solid 1px black;
  padding: 2%;
  font-size: 0.9em;
}
	
.example_table li {
  padding: 2%;
}	
	
.example_table th {
  background: #D9D9D9;
}	
	
.example_any {
  font-weight: bold;
  background: #E2EFDA;
  text-align:center;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
}
	
.example_sotugyo {
  font-weight: bold;
  background: #FCE4D6;
  text-align:center;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
}
	
.example_open {
  font-weight: bold;
  background: #D9E1F2;
  text-align:center;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
}
	
.example_other {
  font-weight: bold;
  background: #FFF2CC;
  text-align:center;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
}
	
.example_text {
  text-align:center;
}
	
.meigi_akamoji {
  width: 90%;	
  color:#EB6167;
  font-weight: bold;
  text-align:center;
  font-size: 1em;
}	
	
.meigi_table {
  width: 90%;
  margin-top: 5%;
  margin-bottom: 5%;
}
	
.meigi_table p{
  margin-top: 5%;
  font-size: 0.9em;
}	
	
.meigi_midashi {
  color:#0099CC;
  font-weight: bold;
  font-size: 1.2em;
  line-height: 1.1em;
  margin-bottom: -3%;
}
	
.meigi_img {
  width: 90%;
  image-rendering: -webkit-optimize-contrast;
}
	
.meigi_img_up {
  position: relative;
  margin: 2% 0% 10% 10%;
  }

.meigi_img_up p {
  position: absolute;
  top: 90%;/*画像の左上に配置*/
  left: 68%;
  margin: 0; /*余計な隙間を除く*/
  color: white;/*文字を白に*/
  background: gray;/*背景色*/
  font-size: 1em;
  line-height: 1;/*行高は1に*/
  padding: 6px 10px 4px 10px;/*文字周りの余白*/
  text-align:center;
  }	
	
.about_rapping {
  width: 90%;
  text-align:center;
  font-size: 0.9em;
  font-weight: bold;
  margin:13% 0% 13% 5%;
}	
	
}