@charset "utf-8";
/*
Theme Name: 台湾ラボ オリジナル テーマ
Theme URI: https://taiwan.laboraotory.ne.jp/wp-content/themes/TaiwanLaboOriginal/
Author: 坂井 稔 【 Minoru Sakai 】
Author URI: https://taiwan.laboratory.ne.jp/
Description: 台湾情報サイト「台湾ラボ」の専用テーマ
Version: 1.1.2
License:
License URI:
Tags:
Text Domain:
*/

/****  リセット  ****/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-style:normal;
	font-weight: normal;
	font-size: 100%;
	vertical-align: baseline;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}
h1,h2,h3,h4,h5,h6{
	clear: both;
}

/* 共通の設定 */
* {
	margin: 0;
	padding: 0;
	border: none;
	}

html{
	height:100%;
}

body {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
    font-size: 90%;
	background:#cccccc url(images/body.png) center center repeat-y;
	margin:0 auto;
	height:100%;
    }

span#first_row{
	font-size: 75%;
	font-weight: 100;
	padding: 3px 0;
	}


body.single h1{
	position: relative;
	padding: .5em 1em .5em 1.5em;
	border: 1px solid #ccc;
	border-radius: 10px 10px 10px 10px / 10px 10px 10px 10px;
	font-weight:bolder;
	font-size:x-large;
	background-color:#E6E6FA;
}
body.single h1::after {
	position: absolute;
	top: .5em;
	left: .5em;
	content: '';
	width: 6px;
	height: -webkit-calc(100% - 1em);
	height: calc(100% - 1em);
	background-color:#884898;
	border-radius: 4px;
}

.single div.post-content p{
	line-height:150%;
	margin: 0 0 30px 0;	/* 上下左右のマージンは10px */
	padding: 0 0 15px 0;	/* 上下左右の余白は5px */
}

h2#page_first_h2 {
	position: relative;
	padding: .5em .75em;
	margin:0 0 15px 0;
	background-color: #fff;
	border: 1px solid #ccc;
	border-radius: 6px;
}
h2#page_first_h2::before,
h2#page_first_h2::after {
	position: absolute;
	top: 100%;
	left: 30px;
	content: '';
	height: 0;
	width: 0;
	border: 10px solid transparent;
}
h2#page_first_h2::before {
	border-top: 15px solid #ccc;
}
h2#page_first_h2::after {
	margin-top: -2px;
	border-top: 15px solid #fff;
}


div.post-content h2{
	font-weight:bolder;
	position: relative;
	padding: .5em .75em;
	margin:0 0 15px 0;
	background-color: #E6E6FA;
	border: 1px solid #ccc;
	border-radius: 6px;
}
div.post-content h2::before,
div.post-content h2::after {
	position: absolute;
	top: 100%;
	left: 30px;
	content: '';
	height: 0;
	width: 0;
	border: 10px solid transparent;
}
div.post-content h2::before{
	border-top: 15px solid #ccc;
}

div.post-content h2::after{
	margin-top: -2px;
	border-top: 15px solid #E6E6FA;

}

a:link {color:#0000FF;} /*未訪問のリンクの色*/
a:visited {color:#0000FF;} /*訪問済みのリンクの色*/
	
a:hover img{
	opacity:0.5;
	filter: 'alpha( opacity=50 )';
	-ms-filter: 'alpha( opacity=50 )';
	background: #fff;
	}

input {
border: 1px #c0c0c0 solid;
}

select, textarea {
border: medium #c0c0c0 double;
}

#wrapper{
	width: 930px;
	margin:5px auto 0;
	padding: 0 12px;
	background-color: #fff;
	}
	
#header {
	background:url(images/header_background.jpg) no-repeat center center; 
	max-width:930px;
	height:250px;
    }
.head-logo{
	float: left;
	width: 44.408%;
	margin-right: 3.66%;
	font-size:40px;
	font-weight:bolder;
	}
.head-logo a{
	text-decoration: none;
	font-weight:bolder;
    color: #FFF;
    font-size: 50px;
    font-weight: bold;
    text-shadow: 2px 2px 1px gray,
    -2px 2px 1px gray,
    2px -2px 1px gray,
    -2px -2px 1px gray;
}
.head-dial{
	float: left;
	width: 29.355%;
	margin-right: 2.577%;
	}
.head-contact{
	float: left;
	width: 20%;	
	}
	
.head-profile{
	float: left;
	width: 20%;
}
.gnavi{
	clear: both;
	}

#headerNav-sp ul{
    list-style: none;
    overflow: hidden;
    }
#headerNav-sp ul li {
    float:left;
    width: 20%;
    }	

#headerNav-sp{
	display: none;
	}


#container {
	overflow: hidden;
	}

#main {
	float: left;
	/* width: 63.129%; */
	width: 70.129%;
    padding: 10px 0;
    }
#main p.post-content{
	line-height:2 !important;
	font-size:20px !important;
}
#main strong{
	font-weight:bolder !important;	
}

#sidebar {
	float: right;
	/*	width: 35.258%; */
	width: 28.258%;
	padding: 10px 0;
	}

#footer {
    padding: 10px 0;
    }


#footerNav{
	display: none;
	}
#headerNav ul {
    list-style: none;
    overflow: hidden;
    }
#headerNav li {
    float:left;
    width: 20%;
    }
.copyright{
	text-align: center;
	font-size: 80%;
	color: #333;
	}
.copyright a{
	text-decoration: none;
	color: #333;
	}



div#comment_area{
	border: 1px solid #ccc;
	border-radius: 10px 10px 10px 10px / 10px 10px 10px 10px;		
}
h3#comments{
	background:lightgrey;
}





/****  パンくず  ****/
.bread{
	margin: 10px 0;
}
.bread ul{
	list-style: none;
	font-size: 0.75em;
}
.bread ul li{
	color: #666;
	display: inline-block;
	margin: 0 10px;
}
.bread ul li a{
	color: #666;
}







/*---------------------------------------------------------*/
/* Sidebar */
/*---------------------------------------------------------*/
.sidebar-wrapper {
	margin: 0 0 15px 0;
}
.sidebar-title {
	border-left: solid 10px #99c348;
	font-size: 1.2em;
	padding: 3px 0 3px 10px;
	margin: 8px 0;
	color: #555;
	border-top: solid 1px #ccc;
	border-right:solid 1px #ccc;
	border-bottom: solid 1px #ccc;
}



.textwidget {
	padding: 0 8px;
}
#calendar_wrap {
	text-align: center;
}
#calendar_wrap table {
	margin-left: auto;
	margin-right: auto;
}
#calendar_wrap table a {
	text-decoration: underline;
	color: #2ea7e0;
}
#calendar_wrap table a:hover {
	background-color: #2ea7e0;
	color: #fff;
}
.sidebar-wrapper ul {
	list-style-type: none;
	padding: 0;
	margin: 0;
}
.sidebar-wrapper li {
	border-bottom: dotted 1px #99c348;
}
.sidebar-wrapper li a {
	display: block;
	color: #555;
	padding: 3px 0 3px 8px;
}
.sidebar-wrapper li a:hover {
	background-color: #cfc;
}












/****  get_calendar()用 ****/

#wp-calendar{width:99%;text-align:center;}
#wp-calendar table{margin-right:2%;margin-left:2%;}
#wp-calendar th{border:1px solid lightgrey;}
#wp-calendar thead{background:aliceblue;}
#wp-calendar td{border:1px solid lightgrey;}








.post-container{
	max-width:145px;
    display: inline-block; /* インラインブロック化 */
    vertical-align: top;   /* 上端を揃える */
	text-align:center;
    margin: 3px 0;
    padding:5px;
    border: 1px solid gray;
	
	border-radius:5px;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;

	background: linear-gradient(#ffffff,#ffffff,#ffffff,#F0F8FF);

}

.post-container img{
 display: block;
 margin-left: auto;
 margin-right: auto;
}



/* 以下、タブレット縦（ディスプレイ幅が960px）より小さい画面に使われるCSS */

@media screen and (max-width: 960px) {
#wrapper{
	width: 95%;
	}
img{
	max-width: 100%;
	height: auto;
	width /***/:auto;　
	}
.head-profile{
	font-size: 80%;
	margin: 0;
	}

.post-container{
	max-width:130px;
}

}
/* 
@media screen and (max-width: 900px) {
.post-container{
	max-width:120px;
}
}

@media screen and (max-width: 860px) {
.post-container{
	max-width:100px;
}
}

@media screen and (max-width: 720px) {
.post-container{
	max-width:80px;
}
}


@media screen and (max-width: 600px) {
.post-container{
	max-width:70px;
}
}


@media screen and (max-width: 540px) {
.post-container{
	max-width:60px;
}
}
 */


/* 以下、スマートフォン（ディスプレイ幅480px以下）より小さい画面に使われるCSS */

@media screen and (max-width: 480px) {
body {
	background-image: none;
	background-color: #fff;
    width: 100%;
    margin:0 auto;
    }
#wrapper{
	width: 95%;
	padding: 0;
	margin: 0 auto;
	background-image: none;
	background-color: #fff;
	}
#header{
	width: 100%;
	}


.logo-smp{
	float: left;
	width: 44.408%;
	margin-right: 3.66%;
	font-size:40px;
	font-weight:bolder;
	}
.logo-smp a{
	text-decoration: none;
	font-weight:bolder;
    color: #FFF;
    font-size: 50px;
    font-weight: bold;
    text-shadow: 2px 2px 1px gray,
    -2px 2px 1px gray,
    2px -2px 1px gray,
    -2px -2px 1px gray;
}




	
#container {
	clear: both;
	overflow: auto;
	}
#main{
	float: none;
	width: 100%;
	padding: 0;
	}
#sidebar{
	float:none;
	width: 100%;
	}
#headerNav {
    display: none;
    }
#headerNav-sp {
	display: block;
    }

#headerNav-sp ul{
    list-style: none;
    overflow: hidden;
    }
#headerNav-sp li {
    float:left;
    width: 20%;
    }


.logo-smp{
	float: left;
	width: 100%;
	}
.footerNavLink{
	clear: both;
    float: left;
    width: 49%;
    margin-right: 2%;
    }    
.dial-smp{
    float: left;
    width: 49%;
    }




#footerNav {
	display: block;    
    }
#footerNav ul{
    list-style: none;
    overflow: hidden;
    }
#footerNav li {
    float:left;
    width: 20%;
    }

.post-container{
	/* max-width:73px; */
	max-width:97px;
}



}


/****************************************
          関連記事（Relation）
*****************************************/
#related-entries h3{
  font-size:24px;
}

#related-entries .related-entry{
	max-width:145px;
    display: inline-block; /* インラインブロック化 */
    vertical-align: top;   /* 上端を揃える */
	text-align:center;
    margin: 3px 0;
    padding:5px;
    border: 1px solid gray;
	
	border-radius:5px;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;

	background: linear-gradient(#ffffff,#ffffff,#ffffff,#F0F8FF);

}


#related-entries .related-entry-thumb {

}


#related-entries .related-entry-thumb img{
 display: block;
 margin-left: auto;
 margin-right: auto;
}

#related-entries .related-entry-content {
  /* float:right; 
  width:200px;
  height:160px;
  padding:0;*/
  /* margin-left:200px; */
  /* width:250px;
  border:solid 1px yellow; */
  
}
.related-entry-title{
    margin-bottom:0;
}
.related-entry-snippet{
  margin:0 0 0 0;
  text-align:left;
}
.related-entry-read{
  margin:0;
  font-size:12px;
}




/*Pagenation*/
.pagenation {
    margin: 1em 0;
}
.pagenation:after, .pagenation ul:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
}
.pagenation ul {
    margin: 0;
}
.pagenation li {
    float: left;
    list-style: none outside none;
    margin-left: 3px;
}
.pagenation li:first-child {
    margin-left: 0;
}
.pagenation li.active {
    background-color: #999999;
    border-radius: 3px;
    color: #FFFFFF;
    cursor: not-allowed;
    padding: 10px 20px;
}
.pagenation li a {
    background: none repeat scroll 0 0 #CCCCCC;
    border-radius: 3px;
    color: #FFFFFF;
    display: block;
    padding: 10px 20px;
    text-decoration: none;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
}
.pagenation li a:hover {
    background-color: #444444;
    color: #FFFFFF;
    opacity: 0.8;
    transition-duration: 500ms;
    transition-property: all;
    transition-timing-function: ease;
}








