@charset "utf-8";

/*
ver 2015.11.05.01
cdn移管のため画像パス変更

ver 2015.08.10.01
memo リンク文字　折り返し指定（word-wap）追加
*/

/* ＝＝＝＝＝＝＝＝＝　執筆者一覧、執筆者トップ、記事別トップ　＝＝＝＝＝＝＝＝＝ */

/* font-size */

	/* base 100% 16px */
	article.news .related-list h3 span,
	article.news .related-list h3 a,
	article.news .title .writer,
	article.writer .pick-topics section .title,
	article.writer .pick-topics .writer p { font-size: 100%;}

	/* 最小　75%　12px */
	article.column .column-list ul li .date,
	.commentsMenu a,
	#commentsWrap.on .gig-comments-login.gig-comments-or { font-size: 75%;}

	/* 小　87.5%　14px */
	.menu-filter ul,
	article.column .title-area span,
	article.column .pick-topics section .pagenavi
	article.column .pick-topics .lead,
	article.column .pick-topics .name,
	article.column .pick-topics .writer,
	article.column .pick-topics .writer .title,
	article.column .pick-topics .writer .name,
	article.column .pick-topics h4,
	article.column .column-list ul li p,
	article.column .column-list ul li .name,
	article.column .column-list ul li .subtitle,
	article.writer .writer-list ul li a,
	article.writer .writer-list ul li .title,
	article.writer .writer-list ul li .profile,
	article.writer .writer-list ul li .small,
	article.news .related-list li a,
	article.news .writer-profile .name,
	article.news .writer-profile .profile,
	article.news figcaption { font-size: 87.5%;}
	article.news .text-area01 h3{font-size: 125%; margin-bottom: 30px; padding-top: 10px;}

	/* 大　112.5%　18px */
	article.column .title-area h3,
	article.column .pick-topics .title,
	article.column h3,
	article.column .column-list ul li .title,
	article.news .title .column-title,
	article.news .writer-profile .title,
	article.news .text-area01 p, article.news .text-area02 p,
	article.writer .pick-topics .writer p span,
	article.search h2 { font-size:112.5%;}

	/* 特大 125%　20px */
	article.news .text-area02 h3,
	article.search h2 span { font-size: 125%;}

	/* 記事見出し　170% 27px　*/
	article.writer h2,
	article.column h2,
	article.news .title h2 { font-size: 170%;}

/*  執筆者  */
article.writer  { margin: 50px auto 30px;}
article.writer h2 { margin-bottom:15px;}
article.writer .writer-area { margin-bottom:40px;}
article.writer .writer-area img { float: left; width:110px; margin-right:20px;}
article.writer .writer-area .title { margin-bottom:15px; color:#666; font-weight:bold;}
article.writer .writer-area .profile { margin-left:130px;}

/*  執筆者一覧リスト  */
article.writer .writer-list { margin: 20px 0 0;}
article.writer .writer-list ul { list-style: none; display:flex; flex-flow:wrap;}
article.writer .writer-list ul li:nth-child(3n+1) { clear:both;}
article.writer .writer-list ul li a { width: 250px; float: left; display: block; padding: 10px 10px; line-height: 1.2;}
article.writer .writer-list ul li a img { margin: 0 10px 0 0; float: none; width:80px; float:left;}
article.writer .writer-list ul li p { margin-top: 5px;  line-height: 1.1;}
article.writer .writer-list ul li .name { font-weight: bold; display: block; margin: 5px 0 3px 0; padding: 0}
article.writer .writer-list ul li .title { color: #7C7C7C; display: block; line-height: 1.2; margin-left:90px;}
article.writer .writer-list ul li .profile { color: #7C7C7C; display: block; line-height: 1.2; clear:both; display:none;}
article.writer .writer-list ul li .small {}

/*　タグ別記事一覧　キーワード検索結果　*/
article.search  { margin: 30px auto;}
article.search h2 { margin: 30px 0;}
article.search h2 span {}
article.search .searchbox{width: 360px;}
article.search .searchbox input.keyword{width: 320px;}

/*  おすすめ記事一覧  */
.category-list .category-menu { float: left; width: 253px; line-height: 1.8;}
.category-list .category-menu ul { list-style: none;}

/* menu-filter
---------------------------------------- */
.menu-filter  { width: 1080px;  margin: 20px auto;}
.menu-filter ul { float: right; list-style: none;}
.menu-filter ul li  { float: left;}
.menu-filter ul li a { display: block; border: #d8d3cd solid 1px; padding: 8px 13px; margin-left: 10px}
.menu-filter ul li a:hover { background-color: #d8d3cd}

/* ＝＝＝＝＝＝＝＝＝　連載一覧、連載トップ　＝＝＝＝＝＝＝＝＝ */

article.column  { margin: 50px auto 30px;}
article.column h2 { margin: 30px 0 20px 0; padding-bottom:15px;}
article.column h3 { margin: 0 0 15px; color: #00113f;}
article.column .thumb { float: left; margin-right: 24px;}
article.column .title-area { margin-bottom:40px;}
article.column .title-area h2 { margin: 20px 0; line-height: 1.2; padding-bottom:0;}
article.column .title-area h3 { color: #000; margin: 15px 0 ; line-height: 1.3;}
article.column .title-area .title { float: left; width: 626px;}
article.column .title-area .writer {margin-bottom:15px;}
article.column .title-area .title .cate-name { display: inline-block; background-color: #fff; text-decoration: none; padding-right: 8px; }
article.column .title-area .title .cate-name span { display:block; padding: 4px 28px 4px 12px; background: url(/web/20160104042820im_/http://cdn.mainichi.jp/vol1/premier/business/images/pc/img_column_arrow.png) no-repeat 100% 50% ;}
article.column .title-area .title .cate-name:hover { background-color: #d8d3cd; }
article.column .pick-topics section { float: left; width: 490px;  margin-right: 20px}
article.column .pick-topics section a { display: block;}
article.column .pick-topics section p { margin-top: 5px;}
article.column .pick-topics section p:hover { text-decoration: underline;}
article.column .pick-topics section span { display: block;}
article.column .pick-topics section .pagenavi { list-style: none; margin: 10px 0;}
article.column .pick-topics section .pagenavi li a { display: block; float: left; border: #d8d3cd 1px solid; padding: 8px 18px; margin-right: 20px; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px;}
article.column .pick-topics section .pagenavi li a:hover { background: #d8d3cd;}
article.column .pick-topics section .pagenavi li.list a { float: right; margin-right: 0;}
article.column .pick-topics h4 { margin-bottom: 13px;}
article.column .pick-topics .title { font-weight: bold; margin-bottom:10px;}
article.column .pick-topics .lead { color: #7c7c7c; margin-bottom:10px;}
article.column .pick-topics .name {}
article.column .pick-topics .writer { float: right; width: 235px;}
article.column .pick-topics .writer a { display: block;}
article.column .pick-topics .writer p { margin-bottom: 10px;}
article.column .pick-topics .writer .title { font-weight: bold; margin-bottom:1px;}
article.column .pick-topics .writer .lead01 { margin-bottom: 10px; line-height: 1.8}
article.column .pick-topics .writer .lead02 { color: #7c7c7c; line-height: 1.8}
article.column .pick-topics .writer a p:hover { text-decoration: underline;}
article.column .pick-topics .writer .name { font-weight: bold; margin-bottom:1px;}
article.column .social-area { text-align: right; margin: 10px 0 20px}
article.column .social-area a:hover { text-decoration:none;}

article.column .column-list {}
article.column .column-list ul li { list-style: none; margin-bottom: 35px; max-height:160px; overflow:hidden;}
article.column .column-list ul li a { display: block; min-height: 133px; clear: both;}
/* cfix cssで追加 */
article.column .column-list ul li a:before,
article.column .column-list ul li a:after{ content:""; display: table;}
article.column .column-list ul li a:after{ clear:both;}
article.column .column-list ul li a { *zoom:1;}

article.column .column-list ul li img { float: left; width: 240px;}
article.column .column-list ul li p { float: right; line-height: 1.5; width: 500px;}
article.column .column-list ul li span { display: block;}
article.column .column-list ul li span:hover { text-decoration: underline;}
article.column .column-list ul li .title { font-weight: bold; margin-bottom: 2px;}
article.column .column-list ul li .name { color: #7c7c7c;  margin-bottom: 7px;}
article.column .column-list ul li .subtitle { color: #7c7c7c;  margin-bottom: 7px;}
article.column .column-list ul li .lead { margin-bottom: 5px;}
article.column .column-list ul li .date { color: #7c7c7c;}
article.column figure {position:relative;}
article.column figure:before {content:''; position:absolute; width:100%; height:100%;}

/* ＝＝＝＝＝＝＝＝＝　記事ページ　＝＝＝＝＝＝＝＝＝ */

/* main-colum
---------------------------------------- */
article.news { background-color: #fff; margin: 15px 0 40px; width: 750px; float: left; text-align: left;}
article.news a:hover { text-decoration: underline;}
article.news object {margin-bottom:30px; width: 610px;}

/*  記事画像  */
article.news figure img { max-height: 620px;}
article.news figure.main { margin: 0px 0px 25px; position: relative; text-align: center; overflow: hidden;}
article.news figcaption { line-height: 1.5; padding:0 10px; text-align:left; color:#666;}
article.news figure.main figcaption { padding:3px 20px 0;background:#FFF; width:100%; text-align:right;}
article.news figure.main img { height: 422px;}

/*  フローティングボタン */
article.news .button-wrap { width: 44px; margin-left: 13px; padding-top: 30px; line-height: 2.0; float: left; z-index:1000;}
article.news .button-wrap img {border:2px solid #FFF; border-radius:50%;}
article.news .float-area { width: 750px; height: auto; position: relative; margin-top: 30px;}

/*  ふわっと表示  */
.fade {}
.fadeInDown {
-webkit-animation-fill-mode:both; -ms-animation-fill-mode:both; animation-fill-mode:both;
-webkit-animation-duration:1s; -ms-animation-duration:1s; animation-duration:1s;
-webkit-animation-name: fadeInDown; animation-name: fadeInDown;
 visibility: visible !important;
}
@-webkit-keyframes fadeInDown {
 0% { opacity: 0; -webkit-transform: translateY(-20px);}
 100% { opacity: 1; -webkit-transform: translateY(0);}
}
@keyframes fadeInDown {
 0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px);}
 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0);}
}


/*  記事  */
article.news .title { margin-left: 70px; margin-bottom: 20px; margin-right: 70px;}
article.news .title .column-title { font-weight:bold; color:#444;}
article.news .title h2 { margin: 16px 0 20px; line-height:140%;}
article.news .title .writer {}
article.news .title time{ float: right; color: #555; margin:0 0 20px 50px;}
article.news .article-inner { width: 680px; float: right;}
article.news .article-inner .indent { text-indent: 10px;}
article.news .social-area a:hover { text-decoration:none;}

/*  記事エリア01  */
article.news .text-area01 { margin-left: 70px; margin-bottom: 60px; position: relative;}
article.news .text-area01 p {  width: 380px; float: left; line-height: 1.7;}
article.news .text-area01 p a { text-decoration:underline; padding:0 5px; color:#0078c6;word-wrap:break-word;}
article.news .text-area01 p a:hover { text-decoration:none; }

/*  関連記事  */
article.news aside.related-list { float: right; width: 260px;}
article.news aside.related-list ul { list-style: none; line-height: 1.6; margin:0 20px 26px 25px;}
article.news aside.related-list h3 { margin-bottom: 15px; padding-top:0;}
article.news aside.related-list h3 span{ padding-left:25px; margin-bottom:5px; display: block; background:url(/web/20160104042820im_/http://cdn.mainichi.jp/vol1/premier/business/images/pc/arrow01_bk.png) no-repeat 5px 50%;}
article.news aside.related-list h3 a { color:#FFF; padding:8px 5px 7px 25px; font-weight:normal; display:block; margin-bottom:20px; background:url(/web/20160104042820im_/http://cdn.mainichi.jp/vol1/premier/business/images/pc/images/arrow01_wh.png) no-repeat 5px 50% #00113f; border-radius:2px 0 0 2px;}

/* ソーシャルアイコン */
.social-area { margin: 10px 0 10px 0; text-align: left;}
.social-area a { margin-right: 10px;}


/*  記事エリア02  */
article.news .text-area02 { width: 680px; line-height: 1.7;}
article.news .text-area02 p, article.news .text-area02 h3 { margin: 0 70px 30px 0}
article.news .text-area02 a { text-decoration:underline; padding:0 5px; color:#0078c6;word-wrap:break-word;}
article.news .text-area02 a:hover { text-decoration:none;}
article.news .right { float: right; width: 45%; margin-left: 24px; text-align:center; position:relative;}
article.news .left { float: left; width: 45%; margin-right: 24px; margin-left:-70px; text-align:center; margin-bottom: 30px; position:relative;}
article.news .center { width:610px; text-align:center; margin-bottom:30px; position:relative;}
article.news .right img, article.news .left img { max-width: 100%; height: auto; max-height: 620px;}
article.news .center img { max-width:100%; max-height:620px;}
article.news .bottom { width: 610px; text-align:center; margin-bottom:30px; position:relative;}
article.news .bottom img { max-width: 100%;}
article.news .bottom:before,
article.news .right:before,
article.news .left:before,
article.news .center:before { content:''; position:absolute; width:100%; height:100%; left:0; top:0;}

article.news .writer-profile { margin:0 70px 30px 0; clear:both;}
article.news .writer-profile img { float:left; width:90px; height:90px;}
article.news .writer-profile .title { margin-left:100px; margin-bottom:5px; font-weight:bold;}
article.news .writer-profile .name { margin-left:100px; margin-bottom:5px; font-weight:bold; color:#666;}
article.news .writer-profile .profile { margin-left:100px;}
article.news .writer-profile a:hover { text-decoration:none;}
article.news .writer-profile a:hover .title,
article.news .writer-profile a:hover .name { text-decoration:underline;}

/* コメント（GIGYA） */
#commentsDiv-commentTextarea { width: 100%;}
.commentsMenu { display: none; text-align: right;}
.commentsMenu a {}
#commentsWrap.on .commentsMenu { display: block;}
#commentsWrap { padding: 0 0 20px 0; border-top: 1px solid #CCC; width: 680px; margin: auto; position: static; top: auto; left: auto;}
#commentsWrap.on { margin-left:760px; padding: 5px 15px; background-color: #EEE; background: rgba(240, 240, 240, 0.95); box-shadow: 1px 1px 5px #666; border-top: 0px solid #CCC; width: 320px; height: 480px; z-index: 10000; position: fixed; border-radius: 6px;}
.commentsDiv-comments { background: #FFF;}
#commentsWrap.on #commentsDiv-comments { overflow: scroll; height: 190px; border: 1px solid #CCC; background: #FFF width: 90%;}
#commentsWrap.on .gig-comments-commentList-header-commentsCount { padding-top: 10px;}
#commentsWrap.on .gig-comments-commentBox { margin-top: 0;}
#commentsWrap.on #commentsDiv-commentBox { margin-top: 10px; border-top: none;}
#commentsWrap.on .gig-comments-login.gig-comments-or { font-weight: normal;}

article.news div.gig-comments-providerIcons { width:14px; background-position:left center;}

/* 2015.06.17 */

.link-group h3 a, .link-group .btn-links a {font-size:87.5%; margin-right: 5px;}
.related-box {margin:0 15px 60px;}
.related-box .related-list, .related-box .link-group {border:1px solid #CCC;background-color: #F7F6F4; padding:0 20px 20px; position: relative; }
.related-box .related-list{ width:49%; float:left;}
.related-box .related-links{ width:49%; margin:auto;}
.related-box .related-list ~ .related-links{ float:right;}

.related-box .related-list h3 { margin:20px 0 20px 20px;}
.related-box .related-list li a {display: block;border-bottom:1px solid #CCC; padding:5px 20px;background:url(/web/20160104042820im_/http://cdn.mainichi.jp/vol1/premier/business/images/pc/Arrow_Biz_Light_S.png) no-repeat 0 50%;}
.related-box .related-list li a:hover {border-bottom:1px solid #666; text-decoration:none; background-image:url(/web/20160104042820im_/http://cdn.mainichi.jp/vol1/premier/business/images/pc/Arrow_Biz_Light_S_Hover.png);}
.related-box .related-links h3 a {background-color:#00113f; color:#FFF; padding:5px 25px; display:table; position: relative; top:-1px; left:-21px;font-weight: normal;margin-bottom:20px;}
.related-box .related-links .thumbnail {width:60px;height:60px; margin:0 10px 10px 0; float:left; display: block;background-size:cover;background-position: 50% 50%;}
.related-box .link-group p {color:#162348; font-weight: bold;}
.related-box .link-group .btn-links a {background-color:#E7E3D7; display: inline-block; padding:5px 7px; margin-top:10px; border-radius:2px;}
.related-box .related-links .btn-biz {margin:20px; display: block; background:#00113f; color:#FFF; padding:15px;border-radius:4px;}
.related-box .related-links .btn-biz .logo {background:url(/web/20160104042820im_/http://cdn.mainichi.jp/vol1/premier/business/images/pc/Icon_Biz.png) no-repeat 0 0; width:23px; height:27px; display: inline-block; vertical-align: middle; margin-right: 20px;}

/* 2015.06.30 */

article.news .title .cat-title {}
article.news .title .cat-title { background:url('/web/20160104042820im_/http://cdn.mainichi.jp/vol1/premier/business/images/pc/Arrow_Biz_Light_S.png') no-repeat 98% 50% #F9F9F9; margin:0 0 1em -70px;color:#192851;display: inline-block; padding-right: 30px;}
article.news .title .cat-title span {background:#192851; color:#FFF; display: inline-block; padding: 5px 10px 5px 20px; margin: 0 10px 0 0;}
article.news .title .cat-title a {color:#192851;font-size:16px;}
article.news .title .cat-title span a {color:#FFF;}

article.writer .writer-list ul li a img,
article.writer .writer-area img,
article.news .writer-profile img {border-radius:50%;}

/* 2015.07.13 */

.related-links .link-group img { float: none; margin-left: 0px; margin-bottom: 0px; }
.related-links .link-group span { display: inline;}
.related-links .link-group .thumbnail { height:60px; width:60px; position:relative; background:url(/web/20160104042820im_/http://cdn.mainichi.jp/vol1/premier/business/css/pc/column.css?20151221) no-repeat 50% 50%; background-size:cover; display:block; float:left; margin-right:10px; overflow:hidden;}
.related-links .link-group .thumbnail span { padding-left:50%; display:inline-block;}
.related-links .link-group .thumbnail span img { margin-left:-50%; height:60px;}

/* end */
/*
     FILE ARCHIVED ON 04:28:20 Jan 04, 2016 AND RETRIEVED FROM THE
     INTERNET ARCHIVE ON 07:58:11 May 02, 2017.
     JAVASCRIPT APPENDED BY WAYBACK MACHINE, COPYRIGHT INTERNET ARCHIVE.

     ALL OTHER CONTENT MAY ALSO BE PROTECTED BY COPYRIGHT (17 U.S.C.
     SECTION 108(a)(3)).
*/