@charset "utf-8";
/*
Theme Name: New World
Description: New World の子テーマ
Version: 1.4.mobile
Template: newworld
*/

#mobile-header { display: none;}/* スマホ用スライドメニューをPCで表示させない */

/************************************************
*************************************************
         　　  タブレット横置き用
*************************************************
************************************************/
@media screen and (min-width: 993px) and (max-width: 1024px) {

	#wrapper { width: 98%;}
	#main    { width: 66%; padding: 10px !important;}
	#side    { padding: 10px 10px 10px 0px !important;}

	img {
	max-width: 100%;
	height: auto;
	width: auto\9; /* ie8 */
        }

	img.attachment-post-thumbnail { width: 100% !important;}

	.post { width: 100%;}
	.post img{ padding: 1px; box-sizing: border-box;}
	.post p b { font-weight: 700; margin: 0px 2px;}

	.post a.more-link,.post p a.more-link {   margin: 0px;
			font-size: 120%;
			padding: 0px 10px 0px 0px;
			text-align: right;
			text-decoration: none;
			}/* こいつのmarginが全ての元凶でした、要注意！ */

	#wide{width: 100%; padding:10px; box-sizing: border-box;}
	#wide p.privacy{ margin: 20px 20px 50px 20px;}

	div.long-title{ width: 100%;
			margin: 30px 0px 30px -20px !important;
			padding-left: 20px;
			border-right: none;
			box-sizing: border-box;
			}
	.long-title:before{ border-width:0 8px 8px 0 ; }

	div.slim-title{ width: 100% !important;
			padding-left: 20px!important;
			margin: 20px 0px 20px -20px !important;
			border-right: none;
			box-sizing: border-box;
			}

	blockquote:after{ margin-right: -15px !important;}

	#m_inner {
		margin: 0px 10px;
		padding: 15px 10px 0px 10px;
		}
	#m_inner .original-thread { margin: 0px -10px;}
	#m_inner img { max-width: 98%;}



}




/************************************************
*************************************************
          　　タブレット縦置き用
*************************************************
************************************************/
@media screen and (min-width: 481px) and (max-width: 992px) {	

	#wrapper { width: 98%;}

		/* スライドメニュー */
	#mobile-header{ display: inline; float: right;}

	/* animate.js */
	#animatedModal { }
	.modal-content{
	max-width: 100%;
	font-weight: 500;
	width: auto;
	margin: 100px auto 0px auto;
	padding: 0 150px;
	}
	.modal-content ul li { margin: 30px 0px;}
	
	img {
	max-width: 100%;
	height: auto;
	width: auto\9; /* ie8 */
        }

	pre {   
		white-space: pre-wrap;         /* CSS3 preの折り返し設定*/
		white-space: -moz-pre-wrap;    /* Firefox */
		white-space: -webkit-pre-wrap; /* Chrome, Safari */
		white-space: -o-pre-wrap;      /* Opera 7 */
		word-wrap: break-word;         /* IE 5.5+ */
	     }

	#page    { background: url(images/tablet_bg_header_black.png) repeat-x top left;}/* トップ部分の黒い透かしはCSSではなくここにある画像である。スマホ用に画像を作成 */
	
	#header  { width: auto; height: auto; margin: 0px; padding: 15px 0px; 5px 0px }
	#header h1 { display: inline; font-size: 110%;}
 	#header p  { display: none !important;}
 	/* .menu-main-container{ display: none !important;} */
	ul#nav.menu{ top: 60px;}
	
	#contents{ width: 100%; margin: 20px 0px 0px 0px; padding: 0px;}
	#main    { float: none; width: 100%; padding: 0px;}
	#side    { float: none; width: 100%; padding: 0px;}
	#footer  { width: 100%; height: auto;}
	
	#wide{width: 100%; padding:10px; box-sizing: border-box;}
	#wide p.privacy{ margin: 20px 20px 50px 20px;}

	#mndangler_sitemap { margin: 0px 0px 50px 0px; font-size: 80%;}

	.post a.more-link,.post p a.more-link {   margin: 0px;
			font-size: 120%;
			padding: 0px 10px;
			margin: 0px 0px 10px 5px;
			text-align: right;
			text-decoration: none;
			}/* こいつのmarginが全ての元凶でした、要注意！ */
	
	.post .title{ border-left: none !important;
		margin-bottom: 2px !important;
		border-top: 1px solid #fffafa !important;
		font-size: 120% !important;}
	
	.post img.attachment-post-thumbnail { width: 100%; max-width: 100%; padding: 0px; margin: -2px 0px 10px 0px;}
	
	.post h2, .post h3, .post h4, .post h5, .post h6{margin: 0px;}
	.post    { width: 100%;}
	.post img{ border: none; padding: 0px; margin: 10px 3px; max-width: 99%; display: block !important; margin: 10px auto;}
	.post p { margin: 15px 0px; font-size: 120%; padding: 0px 5px 0px 10px; line-height: 1.5em;}
	.post p b { font-weight: 700; margin: 0px 2px;}

	.wp-to-top { right: 2px !important;}

	/* gifffer */
	.gifffer {
	max-width: 100%;
	padding: 0px !important;
	display: block;
	margin: 0px auto;
	background: none !important;
	}
	.gifffer img {
	max-width: 100%;
	margin: 0;
	padding: 0;
	background: none;
	}

	.post blockquote{ width: 98%; margin: 20px 5px 20px 6px !important; box-sizing: border-box;}
	blockquote:after{ margin-right: -15px !important;}

	span.fontback{ background:linear-gradient(transparent 40%, #f5f5f5 80%);}

	div.blog_info  {  display: none;}
	
	div.wp-pagenavi{ padding: 20px 30px !important; box-sizing: border-box;}
	div.wp-pagenavi span.pages{ font-size: 150% !important;}
	div.wp-pagenavi span.current{ font-size: 150% !important;}
	div.wp-pagenavi a.page.larger{ font-size: 150% !important;}
	div.wp-pagenavi a.page.smaller{ font-size: 150% !important;}
	div.wp-pagenavi a.nextpostslink{ font-size: 150% !important;}
	div.wp-pagenavi a.previouspostslink{ font-size: 150% !important;}
	
	
/*************************************
    ここからタブレット sidebar 用
**************************************/

	li.widget-container { display: none;}
	
	div.sponsore_link{ text-align: center; margin-top: 10px; }
	#contents_afi{     width: 100%;
			   margin-left: auto; margin-right: auto;
			   text-align: center;
			 }
	#contents_top_afi{ width: 98%;
			   text-align: center;
			   margin: 10px auto;
			 }

	ul.wp-tag-cloud  { margin: 0px !important;
			   padding: 10px 10px !important;}

	#side h3.randomentry_top { margin-bottom: 0px;}
	#side .randomentry li:first-child { border: none; border-top: 1px solid #165e83; border-bottom: 1px solid #165e83;}
	ul.randomentry li { height: 80px; margin-bottom: 0px; opacity: 1.0; background: none; border: none; border-bottom: 1px solid #165e83;}
	ul.randomentry li img { margin-right: 10px; float: left; position:static; filter: none;}
	ul.randomentry li p.tablet_random { position:static; word-wrap:break-word; padding: 20px 5px; line-height: 1.5em;}

	.newentry{ display: none !important;}
	h3.newentry_top{ display: none;}
	
	#rssfeed     { height: auto;}
	#rssfeed img {  width: 30%;
			height: auto !important;}
	.rss-inner    {margin-left: auto !important; margin-right: auto !important; text-align: center;}
	
	#sns_b.sns_sidebar ul { margin: 15px 10px 0px 10px;}
	#sns_b.sns_sidebar li a { padding: 15px; font-size: 20px;} 


/*************************************
      ここからタブレット single 用
**************************************/	

	#multi-inner  { margin: 6px; width: 98%; box-sizing: border-box;}
	
	#multi-inner2 { margin: 6px; width: 98%; box-sizing: border-box;}

	#multi-inner3 { margin: 6px; width: 98%; box-sizing: border-box;}
	
	#multi-inner4 { margin: 6px; width: 98%; box-sizing: border-box;}
	
	#image-inner  { margin: 6px; width: 98%; box-sizing: border-box;}
	
	#image-inner2 { margin: 6px; width: 98%; box-sizing: border-box;}

	#image-inner3 { margin: 6px; width: 98%; box-sizing: border-box;}
	#image-inner3 p { margin: 0;}

	/* Q&Aセット */
	#que_inner{	margin: 15px 6px 0px 6px;}
	#ans_inner{ margin: 0px 6px 15px 6px;}

	.font_ex_cover_title { margin: 0px 6px; width: 98%; box-sizing: border-box; display: inline-block;}
	.font_ex_cover { margin: 0px 6px 6px 6px; width: 98%; box-sizing: border-box; padding: 5px 10px;}
	.font_ex_cover p { margin: 0; padding: 0;}

	.b-title-inline{ margin-left: 10px;}

	div.long-title{ width: 100%;
			margin-left: -10px !important;
			padding-left: 30px;
			border-right: none;
			box-sizing: border-box;
			}
	.long-title:before{ border-width:0 8px 8px 0 ; }

	div.slim-title{ width: 100% !important;
			padding-left: 20px!important;
			margin: 20px 0px 20px -10px !important;
			border-right: none;
			box-sizing: border-box;
			}

	.highlight-title{ margin-left: 5px; padding: 3px 15px 5px 15px;}
	#highlight-cover{ margin: 0px 5px 15px 5px;}

	.prism-title     { margin: 10px 5px 0px 5px !important;}
	pre[class*="language-"] { margin: 0px 5px 10px 5px !important;}

	ul.related_post.wp_rp { width: 100%; margin-left: 5px !important;}

	.plugin-cover { width: auto;
			height: auto;
			box-sizing: border-box;
			margin: 0px 0px 0px 5px;
			padding: 10px 5px;
			}

	div#map-container canvas { width: 100%; box-sizing: border-box; margin: 0;}

	#disqus-inner { padding: 5px;}
	#disqus-inner p.disqus-exp { margin: 0px -5px;}
	#disqus-inner p.disqus-exp2{ display: none;}

	#item-wrap{ width: 98%; box-sizing: border-box; margin: 15px auto;}
	#linuxword{ width: 98%; box-sizing: border-box; margin: 10px auto 0px;}
	#linux-des{ width: 98%; box-sizing: border-box; margin: 0px auto;}

	.kaisou-inner{ margin: 5px; padding: 5px;}

	#m_inner {
		margin: 0px 10px;
		padding: 10px 0px 0px 0px;
		}
	#m_inner .original-thread { margin: 0px;}
	#m_inner img { max-width: 98%;}

	#bootstrap_link_cover { margin: 6px;}
	#bootstrap_link_cover .btn { white-space: pre-wrap;}
}


/************************************************
*************************************************
                    スマホ用
*************************************************
************************************************/
@media screen and (max-width: 480px){

	/* スライドメニュー
	#mobile-header{ display: inline;
			float: right;
			padding: 5px 10px;
			border-radius: 3px 0 0 3px;
			background: #fff;
			}
	a.right-menu {text-decoration: none !important;}*/

	#mobile-header{ display: inline; float: right;}
	/* animate.js */
	.modal-content{
	max-width: 100%;
	font-weight: 500;
	width: auto;
	margin: 30px auto 0px auto;
	padding: 0 30px;
	}
	.modal-content ul li { margin: 20px 0px;}

	article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block;}

	img {
	max-width: 100%;
	height: auto;
	width: auto\9; /* ie8 */
        }

	html     { width: 100%;}
	body     { width: 100%;}
	
	#page    { width: 100%; background: url(images/mobile_bg_header_black.png) repeat-x top left;}/* トップ部分の黒い透かしはCSSではなくここにある画像である。スマホ用に画像を作成 */
	#wrapper { width: 100%;}
	
	
	#header  { width: 100%; height: auto; margin: 0px; padding: 10px 0px;}
	#header h1 { font-size: 80%; padding-left: 10px; display: inline;}
 	#header p  { display: none !important;}
 	.menu-main-container{ display: none !important;}
 	 
	#contents{ width: 100%; margin: 5px 0px 0px 0px; padding: 0px; border: none; border-radius: 0px;}/* 実験中 */
	#main    { float: none; width: 100%; padding: 0px;}
	#side    { float: none; width: 100%; padding: 0px;}
	#footer  { width: 100%; height: auto; padding-top: 0px;}
	
	#wide{width: 100%; padding:5px; box-sizing: border-box;}
	#wide p.privacy{ margin: 20px 20px 50px 20px;}

	#mndangler_sitemap { margin: 0px 0px 20px 0px; font-size: 80%;}	
	#mndangler_sitemap li ul.wsp-posts-list { margin: ; padding: ;}

	pre {   
		white-space: pre-wrap;         /* CSS3 preの折り返し設定*/
		white-space: -moz-pre-wrap;    /* Firefox */
		white-space: -webkit-pre-wrap; /* Chrome, Safari */
		white-space: -o-pre-wrap;      /* Opera 7 */
		word-wrap: break-word;         /* IE 5.5+ */
	     }
	
	div.blog_info  {  display: none;}
	
	.post img.attachment-mobile_thum { max-width: 100%; margin: 0; padding: 0px;}
	.post img.attachment-post-thumbnail { max-width: 100%; margin: 0; padding: 0px;}

	.post a.more-link,.post p a.more-link {   margin: 0 0 15px 20px;
			font-size: 90%;
			padding: 0px 10px;
			text-align: left;
			text-decoration: none;
			}/* こいつのmarginが全ての元凶でした、要注意！ */
	
	.post .title   { width: 100% !important;
		   position: relative;
		   padding: 5px 2px 5px 5px !important;/* 親要素のimportantに要注意！！ */
		   margin: 0px !important;
		   border: none; border-left: none !important; border-top: 2px solid #696969; border-bottom: 2px solid #696969;
		   border-radius: 0px;
		   text-shadow: none;
		   font-size: 130% !important;
		   box-sizing: border-box;/* これによりpaddingを自動で含めてくれる */
		   -moz-box-sizing: border-box;
		   -webkit-box-sizing: border-box;
		   -o-box-sizing: border-box;
		   -ms-box-sizing: border-box;
		 }
	.post .title:before{
	content:" ";
	position:absolute;
	top:100%;
	left:20px;
	width:0;
	height:0;
	border-width:16px;
	border-style:solid;
	border-color:transparent;
	border-top-color:#696969;}
	
	.post .title:after{
	content:" ";
	position:absolute;
	top:100%;
	left:24px;
	width:0;
	height:0;
	border-width:12px;
	border-style:solid;
	border-color:transparent;
	border-top-color:#787c80;
	z-index:1;}
	
	span.fontback{ background:linear-gradient(transparent 40%, #f5f5f5 80%);}

	.post h2, .post h3, .post h4, .post h5, .post h6{margin: 0px;}
	.post    { width: 100%;}
	.post img{ max-width: 99%; border: none; padding: 0px; display: block !important; margin: 10px auto;}
	.post p { margin: 15px 0px; font-size: 110%; padding: 0px 5px 0px 10px; word-break: break-all;}
	.post p b { font-weight: 700; margin: 0px 1px;}

	/* Back to Top */
	.wp-to-top { background-size: contain !important; right: 0px !important; width: 15% !important; height: 9% !important;}

	/* gifffer */
	.gifffer {
	max-width: 100%;
	border: none !important;
	padding: 0px !important;
	margin: 0px 2px;
	background: none !important;
	}
	.gifffer img {
	max-width: 100%;
	border: none !important;
	margin: 0;
	padding: 0;
	background: none;
	}

	div.wp-pagenavi{ max-width: 100%; padding: 10px 0px !important; font-size: 80%;}
	
	.post blockquote{ width: 96%; margin: 20px 2px 20px 8px !important; box-sizing: border-box;}
	blockquote:after{ margin-right: -15px !important;}

	

/*************************************
         ここからスマホ sidebar 用
**************************************/
	
	li.widget-container { display: none;}
	
	div.sponsore_link{ padding-right: 10px; margin-top: 10px; border-top: 1px solid #ebf6f7;}
	ins.adsbygoogle  { width:100%; margin-left: 0px;}/* アフィリエイト */
	#contents_afi{     width: 100%;
			   margin-left: auto; margin-right: auto;
			   text-align: center;
			 }
	#contents_top_afi{ display: none;}
	
	ul.wp-tag-cloud  { margin: 0px !important;
			   padding: 10px 10px !important;}
	
	h3.randomentry_top{ display: none !important;}
	ul.randomentry li { display: none !important;}
	
	.newentry{ display: none !important;}
	h3.newentry_top{ display: none;}
	
	#rssfeed     { height: auto;}
	#rssfeed img {  width: 50%;
			height: auto !important;
			margin: 10px 0px;
			}
	
/*************************************
         ここからスマホ single 用
**************************************/
	
	.b-title{ margin: 0px !important;
		  padding: 0px 0px 0px 5px !important;
		  border-bottom: 0px;
		  line-height: 2em;
		  letter-spacing: 0.1em;
		  border-left: 10px solid #0095d9;
		  }
	.post h2.b-title-inline{
		margin: 10px 0px;
		padding: 10px;
		background: #d3d3d3;
		border: 1px solid #dcdcdc;
		border-left: 8px solid #007bbb;
		display: block;
		}

	.s-title{ margin: 0px !important;
		  padding: 0px 0px 0px 5px !important;
		  border-bottom: 0px;
		  line-height: 2em;
		  letter-spacing: 0.1em;
		  font-size: 115%;
		  border-left: 10px solid #165e83;
		  }
	.post h3.s-title-inline {
		word-break: break-all;
		margin: 10px 0px;
		padding: 10px;
		display: block;
		
		line-height: 1.2em;
		font-size: 120%;
		}
	.ss-title{ margin: 0px !important;
		  padding: 0px 0px 0px 5px !important;
		  border-bottom: 0px;
		  line-height: 2em;
		  letter-spacing: 0.1em;
		  border-left: 10px solid #bce2e8;
		  font-size: 110%;
		  text-shadow: 1px 1px #c0c0c0;
		  }
	
	
	
	
	#fusen{ width: 90%;}
	
	
	#multi-inner  { margin: 5px; padding: 5px; border-radius: 0px;}
	
	#multi-inner2 { margin: 5px; padding: 5px; border-radius: 0 10px 0 0;}

	div#multi-inner3{ margin: 5px; background-size: 20%;}
	div#multi-inner3 li { margin: 5px 0px;}
	
	#multi-inner4 { margin: 5px; padding: 5px; border-radius: 0 10px 0 0;}
	
	#image-inner  { margin: 5px; padding: 5px; border-radius: 0px; word-break: break-all;}
	
	#image-inner2 { margin: 5px; padding: 5px; border-radius: 0px;}
	
	#image-inner3 { margin: 5px; padding: 5px; border-radius: 0px;}
	#image-inner3 p { margin: 5px 0px; padding: 0px 5px;}

	/* Q&Aセット */
	#que_inner{	margin: 5px 5px 0px 5px;}
	#ans_inner{ margin: 0px 5px 5px 5px;}

	.font_ex_cover_title { margin: 0px 5px; display: inline-block;}
	.font_ex_cover { margin: 0px 5px 5px 5px; padding: 5px;}
	.font_ex_cover p { margin: 0; padding: 0;}

	.highlight-title { margin: 0px 5px;}
	#highlight-cover { margin: 0px 5px 15px 5px;}

	.prism-title     { margin: 10px 5px 0px 5px !important;}
	pre[class*="language-"] { margin: 0px 5px 10px 5px !important;}
	
	#example-inner{
		margin: 5px;
		padding: 5px;
		line-height: 1.8em;
		}/* marginを左に取るためだけの囲み */	

	.plugin-cover { box-sizing: border-box;
			margin: 10px 10px;
			padding: 0px 5px;
			word-wrap: break-word;
			white-space: pre-wrap;
			font-size: 80%;
			}

	#g-apli { margin: 5px; max-width: 100%;}
	.appreach-links { margin-left: auto; margin-right: auto;}
	
	.wp_rp_wrap_inner { margin: 0px;}
	
	table.baseballscore{ width: 99%; margin: 0px 0px 0px 2px !important;
			     box-sizing: border-box;/* これによりpaddingを自動で含めてくれる */}
	table.baseballscore td.teamname{ font-size: 85%;}
	
	#simpleresult { font-size: 90%;}
	table.s-res td.s-name {letter-spacing: 0.1em !important;}
	table.s-res tr.bar   { text-align: center !important;}
	table.s-res td.r-l   { width: 40%; padding: 0px; text-align: center !important;}
	table.s-res td.game-n{ width: 20%; padding: 0px; text-align: center !important;}
	table.s-res td.r-r   { width: 40%; padding: 0px; text-align: center !important;}
	
	div#item-wrap{  width: 100%;
			margin: 0px !important;
			border: 4px solid #c0c0c0;
			box-sizing: border-box;/* これによりpaddingを自動で含めてくれる */}
	#item-wrap .ss-title{ padding: 0px 5px !important;}
	
	div.long-title{ width: 100% !important;
			padding: 0px 8px !important;
			margin: 20px 0px!important;
			line-height: 2em;
			border-radius: 0px;
			border-left: 8px solid #165e83;
			border-right: none !important;
			box-sizing: border-box;/* これによりpaddingを自動で含めてくれる */
			}
	.long-title:before{ display: none;}
	
	div.slim-title{ width: 100% !important;
			padding: 0px 10px !important;
			margin: 20px 0px !important;
			border-left: 3px solid #00a3af;
			border-right: none !important;
			border-radius: 0px;
			box-sizing: border-box;/* これによりpaddingを自動で含めてくれる */
			}
	.slim-title:before{ display: none;}

	#linuxword { margin: 0 5px;}
	#linux-des { margin: 0 5px 10px 5px;}
	
	.kaisou-inner{ margin: 5px; padding: 5px;}

	table.kaisou img { display: none !important;}
	table.kaisou td { font-size: 30%; vertical-align: top !important;}
	table.kaisou td.ksen { vertical-align: top !important;}
	
	table.arm_catalog{ font-size: 90%;}
	table.mh4_gun { width: 98%; margin: 5px;}
	table.mh4g_koukan td.koukan-ser    { font-size: 90%;}
	table.mh4g_koukan td.koukan-ser2   { font-size: 75%;}
	
	div.wp_rp_content{ width: 100%; 
			   margin-left: auto; margin-right: auto;
			   }
	div.wp_rp_content ul.related_post li { width: 100% !important; padding: 3px 0px !important; margin: 0px !important; border-top: 1px solid #ebf6f7;}
	div.wp_rp_content ul.related_post li a.wp_rp_thumbnail { margin: 0px 5px !important;}
	div.wp_rp_content ul.related_post li a.wp_rp_title { padding: 0px 5px 0px 0px !important; margin: 0px !important;}

	.sns_dis { display: none;}
	#sns_b.share ul { width: 98%; margin-left: auto; margin-right: auto;}
	#sns_b.share li { width: calc((100% * 1/3) );}
	.blog_dis { display: inline;}
	#sns_b.share li.line a { font-size: 120% !important;}
	#sns_b.sns_sidebar ul { margin: 0px 2px;}
	
	#sns_b.sns_sidebar ul { margin: 0px auto; text-align: center;}
	#sns_b.sns_sidebar ul li { display: inline-block; float: none; margin: 15px 5px;}
	#sns_b.sns_sidebar li a { padding: 10px; font-size: 16px;} 

	#disqus-inner { padding: 5px;}
	#disqus-inner p.disqus-exp { border-radius: 0px; border-top: 1px solid #ebf6f7; margin: 0px -5px;}
	#disqus-inner p.disqus-exp2{ display: none;}
	#disqus_thread ul ul .children { border-left: 1px solid #333;}	

	div#map-container canvas { width: 100%; box-sizing: border-box; margin: 0;}/* これ書いてあるのこっちだけなので注意 */
	
	#m_inner {
		margin: 0px 2px;
		padding: 0px;
		word-break: break-all;
		border-radius: 0 8px 0 0;
		}
	#m_inner .original-thread { margin: 0px;}

	#m_inner .bassui { padding: 5px;}
	#m_inner .bassui p { padding: 5px;}

	#m_inner .m_twitter p { padding: 10px;}

	#m_inner img { max-width: 98%;}
	#m_inner .t_h { padding: 5px 5px; font-size: 80%;}/* 名無し部分 */
	#m_inner .t_b { padding: 0px 10px;}/* レス */
	#m_inner .t_i { padding: 0px 10px 0px 20px;}/* レスにレス */
	#m_inner .t_h.t_i { font-size: 60%;}/* レスにレスの名前を小さくする */

	#bootstrap_link_cover { margin: 5px;}
	#bootstrap_link_cover .btn { white-space: pre-wrap;}




}