/*
Theme Name:JAPAMDENTALGUIDE
*/

/*-------------------------------------------
全体
-------------------------------------------*/
body{
	background: #f5f5f5!important;
	font-family: "Playfair Display", serif!important;
}
.main-contents{
	display: flex;
	justify-content: space-between;
	width: 80%;
    margin: 5% auto;
}
a{text-decoration: none;color: black;}
/* 未訪問のリンク */
a:link {
  color: black;
}

/* 訪問済みのリンク */
a:visited {
  color: black;
}

/* マウスカーソルが乗っている時のリンク */
a:hover {
  opacity: 0.8;
}

/* クリック中のリンク */
a:active {
  color: black;
}
/*-------------------------------------------
メイン
-------------------------------------------*/
main{
	width: 65%;
}
.mv-top{width: 100%;}
main h2{
	font-size: 1.3rem!important;
    font-weight: bold!important;
    color: #165b7a;
}
.caution{
	background: #1bc4f2;
	color: white;
	padding: 0rem 1.5rem;
	margin-bottom: 0px;
}
#sidebar{
	width: 33%;
}
#sidebar img{
	width: 100%;
	margin: 8px auto;
}
/*-------------------------------------------
ヘッダー
-------------------------------------------*/
#logo{width: 200px;}
header{
	background: white;
}

/*-------------------------------------------
トップ
-------------------------------------------*/
.search-tag{
	background: white;
	margin-bottom: 1rem;
	padding: 1rem;
}
.best{
	background: white;
	margin-bottom: 1rem;
	padding: 1rem;
}

.language-inner ul{
		padding-left: 0px;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.language-inner li{
	width: 33%;
	background: rgba(29,144,174, 0.9);
	color: white;
	text-align: center;
	border: solid 2px  #1d90ae;
	margin-bottom: 8px;
	padding: 8px;
}


.language-inner li p {
    margin-top: initial;
    margin-bottom: initial;
}

.prefecture-inner ul{
		padding-left: 0px;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.prefecture-inner li{
	width: 30%;
	background: rgba(29,144,174, 0.9);
	color: white;
	text-align: center;
	border: solid 2px  #1d90ae;
	margin-bottom: 8px;
	padding: 8px;
	margin-left: 1%;
  margin-right: 1%;
}


.prefecture-inner li p {
    margin-top: initial;
    margin-bottom: initial;
    text-decoration: none;
    color: white;
}


.city-inner ul{
		padding-left: 0px;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.city-inner li{
	width: 30%;
	background: rgba(29,144,174, 0.9);
	color: white;
	text-align: center;
	border: solid 2px  #1d90ae;
	margin-bottom: 8px;
	padding: 8px;
	margin-left: 1%;
  margin-right: 1%;
}


.city-inner li p {
    margin-top: initial;
    margin-bottom: initial;
    text-decoration: none;
    color: white;
}



.menu-inner ul{
		padding-left: 0px;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.menu-inner li{
	width: 33%;
	color: white;
	text-align: center;
	border: solid 2px  #1d90ae;
	margin-bottom: 8px;
	padding: 8px;
	height: 100px;
}
.menu-inner li:nth-child(1){
	background: url(./assets/images/teeth-whitening.jpg);
	background-size: cover;
}
.menu-inner li:nth-child(2){
	background: url(./assets/images/teeth-whitening.jpg);
	background-size: cover;
}
.menu-inner li:nth-child(3){
	background: url(./assets/images/teeth-whitening.jpg);
	background-size: cover;
}
.menu-inner li:nth-child(4){
	background: url(./assets/images/teeth-whitening.jpg);
	background-size: cover;
}
.menu-inner li:nth-child(5){
	background: url(./assets/images/teeth-whitening.jpg);
	background-size: cover;
}
.menu-inner li:nth-child(6){
	background: url(./assets/images/teeth-whitening.jpg);
	background-size: cover;
}
.menu-inner li:nth-child(7){
	background: url(./assets/images/teeth-whitening.jpg);
	background-size: cover;
}
.menu-inner li:nth-child(8){
	background: url(./assets/images/teeth-whitening.jpg);
	background-size: cover;
}
.menu-inner li:nth-child(9){
	background: url(./assets/images/teeth-whitening.jpg);
	background-size: cover;
}
.menu-inner li:nth-child(10){
	background: url(./assets/images/teeth-whitening.jpg);
	background-size: cover;
}
.menu-inner li:nth-child(11){
	background: url(./assets/images/teeth-whitening.jpg);
	background-size: cover;
}
.menu-inner li:nth-child(12){
	background: url(./assets/images/teeth-whitening.jpg);
	background-size: cover;
}


.menu-inner li p {
    margin-top: initial;
    margin-bottom: initial;
    line-height: 84px;
}




.article-inner{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.article-inner .article{
	width: 48%;
    display: block!important;
    overflow: hidden;
    /*border: 1px solid indianred;*/
    border-radius:8px;
    margin-bottom: 5%;
}
.article-inner .article .text{
	padding: 8px;
	padding-top: 0px;
	width: 100%;
	margin: 0 auto;
	display: block;
	/*
	border: 1px solid indianred;
	border-top: 0px;
	border-radius: 0px 0px 8px 8px;*/
}
.article-inner .article a{
	text-decoration: none;
}
.article-inner .article img{
	width: 100%;
    height: 250px;
    object-fit: cover;
}
.article-inner .article .text h3{
	color: black;
	font-size: 1.2rem;
	margin: 1rem auto;
}
.article-inner .article .text .post-cat{
	background: #1bc4f2;
	color: white;
	padding: 8px 16px;
	font-size: 1rem;
	display: inline;
    border-radius: 4px;
    margin: 5% auto;
}
.article-inner .article .text .post-date{
	color: #1bc4f2;
	display: block;
	margin: 5% auto;
}



/*-------------------------------------------
記事ページ
-------------------------------------------*/
.related-post-wrap h4{
	color: #8fa6ec;
	font-weight: bold;
	font-size: 1.2rem;
	border-bottom: 2px solid #8fa6ec;
}
.post .post-title{
	font-size: 2rem;
	font-weight: bold;
}
.post main h1{
	font-size: 2rem;
}
.post .post-date{
	color: #8fa6ec;
	display: block;
	margin: 5% auto;
}
.post img{
	width: 100%;
    height: 400px;
    object-fit: cover;
}
.post-categories{
	padding-left: 0px;
    list-style: none;
}
.post-categories li{
	background: #1bc4f2;
	color: white;
	padding: 8px 16px;
	font-size: 1rem;
	display: inline;
    border-radius: 4px;
    margin: 5% auto;
}
.post-categories li a{
	text-decoration: none;
	color: white;
}
.post .gaiyou{

}
.post .big-midashi{
	color: #fff;
    padding: 15px;
    background-color: #6a434a;
    margin: 30px -12px 30px;
    font-size: 26px;
    font-weight: bold;
    line-height: 1.35;
    position: relative;
}
.post .small-midashi{
	color: #6a434a;
    font-size: 24px;
    font-weight: bold;
    line-height: 1.7;
    margin: 20px 0 10px 15px;
    padding-bottom: 10px;
    display: inline-block;
    position: relative;
}
.post .small-midashi::before {
    content: "";
    border-left: 7px solid #6a434a;
    min-height: 25px;
    position: absolute;
    left: -23px;
    top: 7px;
}

.post .honbun{

}

.related-post-wrap ul{
    display: flex;
    list-style: none;
    padding-left: 0px;
    justify-content: space-between;
}
.related-post-wrap ul li{
  width: 33%;
}
.related-post-wrap ul li img{
  width: 100%;
  height: 200px;
  object-fit: cover;
}
.related-post-wrap ul li a{
  text-decoration: none;
  color: black;
}



/*-------------------------------------------
フッター
-------------------------------------------*/
.copywrite{
	text-align: center;
}
footer{
	background: #1bc4f2;
    color: white;
    padding: 1rem;
}
footer p{
	margin: 0px;
}
.footer-top{
	background: white;
	display: flex;
	justify-content: space-between;
	padding: 5%;
}

.footer-top .logo{width: 20%;}
.footer-top .category{width: 30%}
.footer-top .category h4{
	color: #6a4449;
	font-weight: bold;
	font-size: 1.2rem;
	border-bottom: 2px solid #6a4449;
}
.footer-top .category ul{
	padding-left: 0px;
	list-style: none;
}
.footer-top .category li{
	color: black;
	padding: 1rem;
	border-bottom:  1px solid gray;
}
.footer-top .category li a{
	text-decoration: none;
	color: #6a4449;
}


.footer-top .footer-article h4{
	color: #6a4449;
	font-weight: bold;
	font-size: 1.2rem;
	border-bottom: 2px solid #6a4449;
}
.footer-top .footer-article{width: 30%}
.footer-top .footer-article .article-inner{
	display: flex;
	justify-content: space-between;
	margin-bottom: 5%;
}
.footer-top .footer-article .article-inner .left{
	width: 50%;
}
.footer-top .footer-article .article-inner .right{
	width: 50%;
	font-size: 1rem;
	color: black;
	text-decoration: none;
}
.footer-top .footer-article a{
	text-decoration: none;
}

.footer-top .footer-article .article-inner .left img{
	width: 200px;
    height: 120px;
    object-fit: cover;
}
.footer-top .footer-article .article-inner .right h3{
	font-size: 1rem;
}

#footer-logo{width: 300px;}

.footer-menu{
	width: 80%;
  display: flex;
  justify-content: space-around;
}


/*-------------------------------------------
検索窓
-------------------------------------------*/
.searchform{
  width: 65%;
  margin:auto;
  margin-bottom: 1rem;
}
.searchform__field{
  width: 80%;
  height: 48px;
  padding: 0.5em;
  border: 1px solid #ddd;
  font-size: 1em;
}
.searchform__btn{
  width: 48px;
  height: 48px;
  color: white;
  border: 0px;
  background-color: #1d90ae;
}
.searchform__icon{
  color:#fff;
}
/*-------------------------------------------
検索結果
-------------------------------------------*/
.search main{
	width: 100%;
}
.search .mainserch{
	width: 67%;
}
.search .article{
	display: flex;
	justify-content: space-between;
	margin-bottom: 5%;
}
.search .article .left{
	width: 30%;
}
.search .article .left img{width: 100%;height: 200px; object-fit: cover;}
.search .article .right{
	width: 65%;
}


.mv{
	position: relative;
}
.mv h1{
	position: absolute;
	top: 36px;
	left: 100px;
	-webkit-text-stroke: 10px white;
  text-stroke: 2px white;
  paint-order: stroke;
}


.pcnone{
	display: none;
}
.spnone{
	display: block;
}
.brsp{
  display: none;
 }
 .post{
 	    padding: 5%;
 	background: white;
 }
 .post table{
width: 90%;
    margin: 5%;
    display: inline-flex;
    font-family: auto;

 }


 
/*-------------------------------------------
SP
-------------------------------------------*/
@media screen and (max-width: 767px) {
  /*-------------------------------------------
  aside
  -------------------------------------------*/
  #sidebar {
  	width: 100%;
    padding: 0;
  }
  .main-contents {
	  display: block;
	  width: 90%;
	  margin: 5% auto;
	}
	main {
		width: 100%;
	}
	.pcnone{
		display: block;
	}
	.spnone{
		display: none;
	}
	.mv h1 {
    position: absolute;
    top: 8px;
    left: 10px;
  }
  .brsp{
  	display: block;
  }
  .article-inner .article {
    width: 100%;
  }
  .searchform {
    width: 100%;
  }
  .footer-top {
  	display: block;
  }
  .footer-menu {
    display: block;
  }




}


.follow-me {
  list-style: none;
  margin: 0 0 -8px;
  overflow: hidden;
  padding: 0;
}
.follow-me li {
  float: left;
  margin: 0 8px 8px 0;
  padding: 0;
}
.follow-me li a::before {
  -webkit-border-radius: 2px;
  border-radius: 2px;
  color: #fff;
  display: inline-block;
  font-family: FontAwesome;
  font-size: 16px;
  height: 44px; /* Button height */
  line-height: 44px; /* Button height */
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
  text-align: center;
  width: 44px; /* Button width */
}
.follow-me li a:hover::before {
  opacity: 0.7;
}
.follow-me li a[href*="amazon.co.jp"]::before,
.follow-me li a[href*="amazon.com"]::before         { background-color: #ff9900; content: "\f270"; }
.follow-me li a[href*="codepen.io"]::before         { background-color: #000000; content: "\f1cb"; }
.follow-me li a[href*="delicious.com"]::before      { background-color: #3399ff; content: "\f1a5"; }
.follow-me li a[href*="deviantart.com"]::before     { background-color: #05cc47; content: "\f1bd"; }
.follow-me li a[href*="digg.com"]::before           { background-color: #000000; content: "\f1a6"; }
.follow-me li a[href*="dribble.com"]::before        { background-color: #ea4c89; content: "\f17d"; }
.follow-me li a[href*="dropbox.com"]::before        { background-color: #007ee5; content: "\f16b"; }
.follow-me li a[href*="facebook.com"]::before       { background-color: #3b5998; content: "\f09a"; }
.follow-me li a[href*="feedly.com"]::before         { background-color: #6cc655; content: "\f09e"; }
.follow-me li a[href*="flickr.com"]::before         { background-color: #0063dc; content: "\f16e"; }
.follow-me li a[href*="foursquare.com"]::before     { background-color: #f94877; content: "\f180"; }
.follow-me li a[href*="github.com"]::before         { background-color: #181717; content: "\f09b"; }
.follow-me li a[href*="plus.google.com"]::before    { background-color: #dc4e41; content: "\f0d5"; }
.follow-me li a[href*="b.hatena.ne.jp"]::before     { background-color: #008fde; content: "\f027"; font-family: blogicon; }
.follow-me li a[href*="instagram.com"]::before      { background-color: #125688; content: "\f16d"; }
.follow-me li a[href*="last.fm"]::before            { background-color: #d51007; content: "\f202"; }
.follow-me li a[href*="linkedin.com"]::before       { background-color: #0077b5; content: "\f0e1"; }
.follow-me li a[href*="nicovideo.jp"]::before       { background-color: #eaeaea; content: "\f047"; font-family: blogicon; }
.follow-me li a[href*="pinterest.com"]::before      { background-color: #bd081c; content: "\f0d2"; }
.follow-me li a[href*="getpocket.com"]::before      { background-color: #ef3f56; content: "\f265"; }
.follow-me li a[href*="reddit.com"]::before         { background-color: #ff4500; content: "\f1a1"; }
.follow-me li a[href*="skype.com"]::before,
.follow-me li a[href*="skype:"]::before             { background-color: #00aff0; content: "\f17e"; }
.follow-me li a[href*="slideshare.net"]::before     { background-color: #2d2d2d; content: "\f1e7"; }
.follow-me li a[href*="spotify.com"]::before        { background-color: #84bd00; content: "\f1bc"; }
.follow-me li a[href*="steamcommunity.com"]::before { background-color: #171a21; content: "\f1b6"; }
.follow-me li a[href*="stumbleupon.com"]::before    { background-color: #eb4929; content: "\f1a4"; }
.follow-me li a[href*="tumblr.com"]::before         { background-color: #36465d; content: "\f173"; }
.follow-me li a[href*="twitch.tv"]::before          { background-color: #6441a5; content: "\f1e8"; }
.follow-me li a[href*="twitter.com"]::before        { background-color: #55acee; content: "\f099"; }
.follow-me li a[href*="vimeo.com"]::before          { background-color: #1ab7ea; content: "\f27d"; }
.follow-me li a[href*="vine.co"]::before            { background-color: #11b58a; content: "\f1ca"; }
.follow-me li a[href*="weibo.com"]::before          { background-color: #e6162d; content: "\f18a"; }
.follow-me li a[href*="whatsapp.com"]::before       { background-color: #64d548; content: "\f232"; }
.follow-me li a[href*="wordpress.com"]::before,
.follow-me li a[href*="wordpress.org"]::before      { background-color: #21759b; content: "\f19a"; }
.follow-me li a[href*="youtube.com"]::before        { background-color: #cd201f; content: "\f16a"; }
.follow-me li a[href$="/feed"]::before              { background-color: #ffa500; content: "\f09e"; }
.follow-me li a[href$="/subscribe"]::before         { background-color: #363636; content: "\f000";  font-family: blogicon; }