@charset "Shift-JIS";

/* =========================================

title : 柔道チャンネル　side
scope : secondページ以降のsideを使用する全ページ
 
last modify : 2019/03/25 Maitts SNSシェアボタン #15855 
2018/04/06 325_manaka ブログバナーモジュールの新設

2018/03/07 308_tsuda SNSコーナーのdesign修正
2016/11/14 247_morita 右カラム SNS公式アカウント ピカ写メを追加 #11022
2016/07/27 264_tanabe /inc/side_sns.html に関連するスタイルを加筆修正
2016/06/28 222_souda 広告コードのLINEを修正
2016/01/13 222_souda 広告コード読み込みによる高さの変動を修正
2015/11/17 255_suzuki_nobu 行目 ul.side_bnr li p img内のwidth指定削除 
2015/10/09 230inagaki 新広告css
2013/07/25 153_miyano

============================================ */

/*--------------------------------------------------------------------
 side_bar
--------------------------------------------------------------------*/
#side {
	float:right;
	width:300px;
	margin:0px 0px 20px;
	}
	
#side .line {
	overflow:hidden;
	width:300px;
	margin:0px 0px 18px;
	padding:0px 0px 10px;
	/*background:url(/image_cmn/tool/line_dotted.gif) repeat-x 0 bottom;*/
	background:url(/image_cmn/tool/line_red.gif) no-repeat center bottom;
}

#side .line3 {
	overflow:hidden;
	width:300px;
	margin:0px 0px 18px;
	padding:0px 0px 20px;
	/*background:url(/image_cmn/tool/line_dotted.gif) repeat-x 0 bottom;*/
	background:url(/image_cmn/tool/line_red.gif) no-repeat center bottom;
}
	
#side .line_top {
	overflow:hidden;
	width:300px;
	margin:5px 0px 0px;
	padding:1px 0px 0px;
	background:url(/image_cmn/tool/line_dotted.gif) repeat-x 0 0;
	}

/* 動画 */
.side_movie {
	margin:0px 0px 10px;
	}
	
.side_movie .movie {
	height:260px;
	background:url(/image_cmn/side/side_movie_bg.gif) no-repeat 0 0;
	}
.youtube > iframe {
	margin:10px 0 0 10px;
}
.linkyoutube {
	margin: 13px 15px;
}
	
.side_movie .side_movie_btn {
	margin:10px 0px 0px;
	}
	
/* 動画gs tokyo用 */
.youtube > a img {
	margin:10px 0 0 10px;
}
.side_movie .movie_tokyo {
	height:178px;
	background:url(/image_cmn/side/side_movie_bg.gif) no-repeat 0 0;
	}
	
	
/* ad */
#banner_ad{
	width:300px;
	}
#banner_ad div{
	padding:0px 0px 10px;
	}
/* アニメーション */
div#sideanimation{
	width:300px;
	height:100px;
	margin:0 0 0 0;
	padding: 0px 0px 15px;
	clear: both;/*20130912宮野追加*/
	/*background:url(/image_cmn/tool/line_dotted.gif) repeat-x 0 bottom;*/
}

/* バナーリスト */
ul.side_bnr {
	width:300px;
	}

ul.side_bnr li {
	width:300px;
	margin:0px;
	padding:0px 0px 15px;
	}


ul.side_bnr li.side_bnr_g_top,
ul.side_bnr li.side_bnr_g_top2 {
	width:300px;
	margin:0px;
	padding:0px 0px 8px!important;
}

ul.side_bnr li.side_bnr_g_bottom {
	width:300px;
	margin:0px;
	padding:0px 0px 23px!important;
}

ul.side_bnr li.side_bnr_g_bottom2 {
	width:300px;
	margin:0px;
	padding:0px 0px 6px!important;
}

ul.side_bnr li p {
	overflow:hidden;
	border:#585858 solid 2px;
	}

ul.side_bnr li p img {
	position:relative;
	margin:-2px;
	background:#fff;
	}

ul.side_bnr li a img:hover{
	filter: alpha(opacity=80);
	-moz-opacity:0.8;
	opacity:0.8;
	}

div.line figure a img:hover{
	filter: alpha(opacity=80);
	-moz-opacity:0.8;
	opacity:0.8;
	}

ul.side_bnr li p.cap {
	margin:3px 3px 0px;
	line-height:130%;
	border:none;
	}
ul.side_bnr li p.cap.center {
	text-align:center;
	}

ul.side_bnr li p.side_lead {
	width: 305px;
	margin:0 0 5px;
	line-height:130%;
	border:none;
	}

ul.side_bnr li p.txt_banner {
	line-height:130%;
	padding:5px;
	color:#666666;
	text-align:center;
	border:4px solid #999999;
	background:#FFFFFF;
	}
	
/* Sサイズ */
ul.side_bnr.bnr_s {
	width:260px;
	margin:0px auto;
	}
	
ul.side_bnr.bnr_s li {
	width:260px;
	}

/* 枠付き */	
#side dl.frame {
	overflow:hidden;
	width:300px;
	margin:0px 0px 15px;
	padding:5px 0px 10px;
	background:url(/image_cmn/side/side_frame_slash.gif) 0 0;
	}
	
#side dl.frame dt {
	margin:0px 5px 5px;
	}

#side dl.frame dd {
	margin:0px 5px;
	padding:15px 0px 5px;
	background:#f5f5f5;
	}

/*-----整復師情報／接骨院・整骨院情報----------*/
.side_panel {
	width:296px;
	height:129px;
	margin:0px 0px 10px;
	padding:0px;
	border:#585858 solid 2px;
	}
.side_panel dt {
	}
.side_panel dd {
	margin:17px 10px 0px;
	}

.side_panel.seifukushi {
	background:url(/image_cmn/side/seifukushi_bg.gif) no-repeat 0 0;
	}

.side_panel.sekkotsuin {
	background:url(/image_cmn/side/sekkotsuin_bg.gif) no-repeat 0 0;
	}

/*-----リンクについて----------*/
#side .linkfree {
	width:300px;
	margin:15px 0px 0px;
	padding:5px 0px;
	background:url(/image_cmn/side/linkfree_box_bg.gif) 0 0;
	}
#side .linkfree dt {
	margin:0px 5px;
	padding:0px;
	}
#side .linkfree dt img {
	float:left;
	margin:0px;
	padding:0px;
	}
#side .linkfree dd {
	margin:0px 5px;
	padding:5px 10px 12px;
	background:#fbfbfb url(/image_cmn/side/linkfree_bg.gif) repeat-x 0 bottom;
	}
#side .linkfree dd .dtl {
	width:140px;
	margin:7px auto 0px;
	background:url(/image_cmn/tool/arrowbtn_bg.gif) repeat-x 0px center;
	}
#side .linkfree dd .dtl a {
	display:block;
	padding:2px 8px 2px 22px;
	border:1px solid #e5e5e5;
	background:url(/image_cmn/tool/arrow_double_red_mini.gif) no-repeat 7px center;
	color:#434343;
	text-align:center;
	}
#side .linkfree dd .dtl a:hover {
	color:#ff0000;
	}



/* 施設様ログイン */

#side #login_box {
	display:block;
	width:300px;
	height:240px;
	overflow:hidden;
	float:right;
	margin:4px auto 20px;
	padding:0;
	letter-spacing: 0.07em;
}

#side #login_box dl.login_style{
	border:#CCC 1px solid;
	display:block;
	padding:10px 10px 0 10px;
	width:278px;}
	
#side #login_box .login_style dt{
	width:278px;
	height:48px;
	background-color:#F93;
	/*background-color:#FFFFCC;*/
	display:block;
	padding:5px 0 0 0;
	margin:0 0 10px 0;
	}
	
#side #login_box .login_style dd{
	overflow:hidden;
	display:block;
	}
	
	
#side #login_box .login_style p{
	font-size:12px;
	margin:0 0 2px 0;
	width:278px;
	}
	
#side #login_box .login_style li{
	margin:0 0 10px 0;}
	

#side #login_box div.login_style_l {
	width:278px;
	margin:15px 0 10px 0;
	}

#side .cate_line_login {
	height:1px;
	margin:2px auto 10px;
	padding:0;
	border:0;
	border-bottom:1px solid #CCC;
	width:90%;
	}
#side .cate_line_login hr {
	display:none;
	}

p.registration_link{
	font-size:13px;
	padding:0 0 10px 0px;
	margin:0 auto;
	text-align:center;
	}
p.registration_link a{
	padding:2px 0 10px 25px;
	background: url(/image_cmn/side/shisetsu_login_icon.gif) no-repeat 0 0;
	}

/*----------------------------
 広告表示用
-----------------------------*/

#ad_banner {
    margin: 20px auto 15px;
    padding: 45px 0 0;
    width: 646px;
    text-align: center;
    clear: both;
    vertical-align: top;
    overflow: hidden;
    border-top: 4px solid #f6c4d6;
}
.ad_box{
	margin:15px auto;
	max-height:250px;
}
.ad_box:first-child{
	margin:0 auto 15px;
}
.ad_box02{
	display:inline-block;
	padding:0 8px;
	vertical-align:top;
	*display: inline;
	zoom: 1;
}

.ad_box02 .ad_box_link {
  display: block;
  height: 210px;
  width: 252px;
}

.ad_box02 .ad_box_img {
  width: 100%;
}

#side .ad_box .ad_box_link {
  display: block;
  height: 250px;
  width: 300px;
}

#side .ad_box .ad_box_img {
  width: 100%;
}

/*----------------------------
 SNS公式アカウントBOX
-----------------------------*/
#sns_box {
	display:block;
	margin:0 auto 2px;
	width:300px;
}
#sns_link_box {
	background-color:#FFFFFF;
	overflow:hidden;
	border:2px solid #0a72c3;
	width:296px;
	padding:0;
	margin: 0px auto 12px;
}
#sns_link_box dt {
	position:relative;
	padding: 4px 0 8px; 
	font-size:17px;
	color:#fff;
	border:1px solid #4997d3;
	border-bottom-color:#1273bf;
	text-align:center;
	background-color:#358cd0;
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #358cd0), color-stop(100%, #1f7ec7));
	background-image: -moz-linear-gradient(top, #358cd0, #1f7ec7);
	background-image: linear-gradient(top, #358cd0, #1f7ec7);
	font-weight:bold;
	line-height:1;
	behavior: url(/css/PIE.php);
}
#sns_link_box dt > span {
	display:block;
	margin-top:5px;
} 
#sns_link_box dd {
  text-align:center;
}

#sns_link_box #sns_list {
  width: 220px;
    margin: 0 auto;
    padding: 2px 0 12px 0;
    text-align: center;
}

#sns_link_box #sns_list li {
	float: left;
	padding: 0 0 0 0;
	margin: 10px 17px 0 0;
	/*float: left;
	margin: 10px 10px 0 0;
	padding: 0 0 0 0;*/
}

#sns_link_box #sns_list li:nth-of-type(3n) {
	margin: 10px 0 0 0;
}

#sns_link_box #sns_list li:nth-of-type(4){
	margin: 10px 17px 0 35px;
}

#sns_link_box #sns_list:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
	}
*+html #sns_link_box #sns_list { zoom: 1; }
#sns_link_box #sns_list li {
	position:relative;
	float:left;
	padding:0 2px;
	behavior: url(/css/PIE.php);
}

#sns_link_box #sns_list li a{
	display:block;
	}
#sns_link_box #sns_list li a:hover{
	filter: alpha(opacity=70);
	-moz-opacity:0.7;
	opacity:0.7 !important;
	}
#sns_link_box #sns_list li.disable{
	background:#eee;
	border-color:#ccc;
}
#sns_link_box #sns_list li img {
	display:block;
	zoom:1;
	text-align:center;
	margin:4px auto;
}
#sns_link_box #lnk_sns_cont {
	display:block;
	text-align:center;
	margin:0 15px;
	border-top:1px solid #358cd0;
	padding:10px 0px;
	font-weight: bold;
	color: #999;
	/*font-size:15px;*/
}
li.bnr.fb a:hover,
li.bnr.tw a:hover,
li.bnr.ig a:hover,
li.bnr.yt a:hover,
li.bnr.pika a:hover{
  opacity: 0.8;
}
.mod_sns_box {
    background: #f3eada;
    border: 1px solid #d1c4ae;
    margin: 0 auto 15px;
    width: 278px;
}
.mod_sns_box dl {
    margin: 0 auto;
}
.mod_sns_box .shere {
    display: -webkit-flex;
    display: flex;
    margin: 15px auto 12px;
    width: 240px;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}
.mod_sns_box .shere a {
    display: inline-block;
    height: 34px;
    overflow: hidden;
    position: relative;
    width: 34px;
}
.mod_sns_box .shere a:hover{
  opacity: 0.8;
}
.mod_sns_box .shere a.tw img {
    position: absolute;
    top: -36px;
}
.mod_sns_box .shere a.ln img {
    position: absolute;
    top: -144px;
}
.mod_sns_box .shere a.yt img {
    position: absolute;
    top: -72px;
}
.mod_sns_box .shere a.ig img {
    position: absolute;
    top: -108px;
}
.mod_sns_box .shere a.pka img {
    position: absolute;
    top: -180px;
}
.mod_sns_box .links {
    background: #fff;
    border-radius: 4px;
    margin: 10px auto;
    padding: 6px 0;
    text-align: center;
    width: 260px;
}
.mod_sns_box .links a {
    display: inline-block;
    font-size: 14px;
    font-weight: bold;
    margin-left: -10px;
    position: relative;
    text-align: left;
}
.mod_sns_box .links a:hover{
  opacity: 0.8;
}
.mod_sns_box .links a::after {
    border: 6px solid transparent;
    border-left: 7px solid #cf3a3b;
    content: "";
    display: inline-block;
    margin: 0 0 3px 8px;
    position: absolute;
    right: -20px;
    top: 17px;
    vertical-align: middle;
}
.mod_side_bnr {
    margin-bottom: 15px;
    text-align: center;
    width: 300px;
}
.mod_side_bnr a {
    display: block;
}
.mod_side_bnr a:hover{
    opacity:0.8;
}
.mod_side_bnr figcaption {
  font-size: 12px;
  letter-spacing: 0.1em;
  line-height: 1.5;
  padding-top: 5px;
  text-align: left;
}
/* カテゴリ一覧*/
.ttl_category_list {
  background-color: #358735;
  border: 2px solid #61B127;
  border-bottom: none;
  border-radius: 5px 5px 0 0;
  color: #fff;
  font-size: 18px;
  margin-bottom: 0;
  margin-top: 15px;
  padding: 4px 10px;
  position: relative;
  text-align: center;
  top: 0;
}
.ttl_category_list:before{
  border-right: 11px solid transparent;
  border-bottom: 12px solid #61B127;
  border-left: 11px solid transparent;
  content: "";
  height: 0;
  position: absolute;
  right: 50%;
  top: -13px;
  transform: translateX(calc(-50% + 20px));
  width: 0;
}
#category_list ul {
  border: 2px solid #61B127;
  border-radius: 0 0 5px 5px;
  border-top: none;
  font-size: 15px;
  padding: 19px 20px 12px 20px;
}
#category_list li {
  margin: 2px 0 5px;
  text-align: left;
}
#category_list li a {
  color: #0000EE;
  line-height: 22px;
  padding: 0 0 0 36px;
  position: relative;
  font-size:15px;
}
#category_list a::before{
  background: url(/search/image/dtl_new/ttlicon_category_green.png) no-repeat center center;
  background-size: 16px 15px;
  content: "";
  height: 23px;
  left: 12px;
  margin: 0 8px 0 0;
  position: absolute;
  top: 0;
  width: 15px;
}
/* 柔整用表示 bc23 */
.bc23 .ttl_category_list {
  background-color: #4EADD9;
  border: 2px solid #1B94CF;
  border-bottom: none;
}
.bc23 .ttl_category_list span {
  display: inline;
  font-size: 15px;
  line-height: inherit;
  padding-left: 0;
  padding-right: 0;
}
.bc23 .ttl_category_list:before{
  border-right: 11px solid transparent;
  border-bottom: 12px solid #1B94CF;
  border-left: 11px solid transparent;
}
.bc23 #category_list ul {
  border: 2px solid #1B94CF;
  border-top: none;
  letter-spacing: 0.05em;
  padding-left: 20px;
}
.bc23 #category_list a::before{
  background: url(/search/image/dtl_new/ttlicon_category_skyblue.png) no-repeat center center;
  background-size: 16px 15px;
}

.mod_sns_bnr {
    margin: 0 auto 15px;
}
.mod_sns_bnr .lst {
    margin: 0 auto;
    padding: 0;
}
.mod_sns_bnr .bnr {
    height: 40px;
    margin: 0 auto 10px;
    overflow: hidden;
    position: relative;
    width: 280px;
}
.mod_sns_share {
    border: 1px solid #d1c4ae;
    margin: 0 auto 15px;
    width: 278px;
}
.mod_sns_share dd {
    margin: 0;
}
.mod_sns_share .box {
    background: #f8f0dc;
    display: -webkit-flex;
    display: flex;
    margin: 0 auto;
  padding: 15px 22px 3px;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}
.mod_sns_share .btn {
  height: 42px;
  margin: 0 13px 12px;
  width: 42px;
}
.mod_sns_share .btn.fb {
  margin-left: 27px;
}
.mod_sns_share .btn.ln {
  margin-right: 27px;
}
.mod_sns_share .btn.mail {
    height: 25px;
    margin: 0 0 12px;
    width: 110px;
}
.mod_sns_share .btn a {
    display: block;
  height: 42px;
    overflow: hidden;
    position: relative;
    width: 110px;
}
.mod_sns_share .btn a img {
  left: 0;
  position: absolute;
  top: 0;
}
/* ボタン画像スプライト */
.mod_sns_share .btn.fb a img{ top: 0;}
.mod_sns_share .btn.tw a img{ top: -44px;}
.mod_sns_share .btn.ln a img{ top: -88px;}

.mod_sns_share a:hover > img {
  opacity: 0.8;
}
.mod_sns_share .btn.mail a {
    width: 234px;
}

/*-------------------------
 share_box
--------------------------*/
/*.share_box {
	margin: 20px auto 0;
	overflow: hidden;
	/zoom:1;
}
@media screen and (max-device-width: 1024px){
	.share_box {
		margin: 24px auto 0;
	}
}

.share_box dt img {
	display:block;
}
.share_box dd {
	padding:10px 5px 0;
}

.share_box dd ul {
	overflow:hidden; /zoom:1;
}
.share_box dd ul li {
	display: block;
	float: left;
	line-height: 1;
	margin: 0 6px 10px;
	width: 131px;
	height: 30px;
	padding: 10px 0 0;
	text-align: center;
	background: #d3e5f4;
	border: 1px solid #b7d3ea;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	border-radius: 4px;
}
.share_box dd ul li span.line_bg {
	display:block;
	width:82px;
	height:20px;
	margin:0 auto;
}*/

/*SNSシェア*/
.share_box{
	margin: 20px auto 15px;
	border: 1px solid #b7d3ea;
	background: #d3e5f4;
}

.share_box dd{
    padding: 10px 45px;
}
.share_box ul{
	display: -webkit-flex;
	display: flex;
    -webkit-justify-content: space-around;
            justify-content: space-around;
    -webkit-flex-wrap: wrap;
            flex-wrap: wrap;
}
.share_box ul li{
	margin-bottom: 8px;
}
.share_box ul li:last-of-type{
	margin: 0;
}

.share_box a:hover{
  opacity:0.7;
}


/*-------------------------
 official tools BOX
--------------------------*/
.official_tools_box {
	text-align:center;
}
.official_tools_box ul {
	display:inline-block;
	width:300px;
	margin:0 auto;
}
.official_tools_box li {
	margin-bottom:15px;
	text-align:center;
	
/*	no - <figure>*/
display: block;
    -webkit-margin-before: 1em;
    -webkit-margin-after: 1em;
    /*-webkit-margin-start: 40px;
    -webkit-margin-end: 40px;*/
}





#sns_link_box #lnk_sns_cont a, #sns_link_box span {
    font-weight: bold;
}

/* -----------------------------------------------------------------------

	side_movie
	
----------------------------------------------------------------------- */

.side_movie_area {
  width: 300px;
  height: 260px;
  padding-top: 10px;
  background: url(/image_cmn/side/side_movie_bg.gif) no-repeat;
  margin: 0;
}

.side_movie_area div.youtube_thum {
  position: relative;
  width: 280px;
  height: 158px;
  margin: 0 auto;
  padding: 0;
  overflow: hidden
}

.side_movie_area div.youtube_thum > a > img:first-child {
  position: absolute;
  width: 280px;
  height: auto;
  top: 0px;
  left: 0;
}

.side_movie_area div.youtube_thum > a > img:last-child {
  position: absolute;
  top: 54px;
  left: 115px;
}

.side_movie_area div.linkbtn {
  width: 270px;
  height: 67px;
  margin: 13px 15px 0;
}

.side_movie_area div.linkbtn a {
  display: block;
  width: 270px;
  height: 67px;
  background: url(/image/movie/youtube_official_btn_ov.png) no-repeat center center;
  background-size: 270px 67px;
  border: none;
  margin: 0;
}

.side_movie_area div.linkbtn a:hover img {
  opacity: 0;
}

.side_movie_btn {
	margin: 0px 0px 10px;
}
