/*
Theme Name: devo topics
Author: devo
Version: 1.0
*/

/*-------------------------------------------------------------------
    MAIN
--------------------------------------------------------------------*/
.main_img_wrap_oth{margin: 30px auto 0;}
.main_img_wrap_oth h2{font-size: 18px; border-bottom:none;text-align:left;line-height: 1.4;margin: 0;}
.main_img_wrap_oth h3{text-align:left;}

.entry_article_wrap h1 {padding:0 0 0 20px; border-left:solid 7px #ec451e; font-size:30px; line-height:1.4; word-break:break-all;text-align: left; border-bottom: none;}
.entry_article_wrap h2 {margin:45px 0 0; padding:0 0 4px; font-size:30px; border-bottom:4px solid #f9d4cc; line-height:1.4;word-break: break-all; /*font-weight:normal;*/text-align: left;}
.entry_article_wrap h3 {margin:35px 0 0; padding:0 0 6px; border-bottom:solid 1px #ccc; font-size:26px; /*font-weight:normal;*/text-align: left;}
.entry_article_wrap h3:before {margin:0 6px 0 0; content:"\f0dd"; color:#ec451e; font-family:"Font Awesome 5 Free"; font-weight:bold; position:relative; top:-4px;}
.entry_article_wrap h4 {margin:35px 0 0; padding:10px 12px; background:#f5f4f2; font-size:20px; /*font-weight:normal;*/ border-left:solid 4px #ec451e; border-bottom: none;}
.entry_article_wrap h5 {margin:30px 0 0; font-size:16px; color:#ec451e;}

.entry_article_wrap .article-in p {color: #666; line-height: 1.8; word-break: break-all;}
mark {background-image: linear-gradient(transparent 60%, #daebfb 50%); font-weight: bold; color: #666;}
.entry_article_wrap ul.share li{list-style: none;}

/* カテゴリ一覧ページ */
.entry_box p.sp_img {width:140px; margin:4px 0 0; float:left;}
.entry_box .summary-box {width: 360px; float: right;}
.entry_box p.article-in {overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; /* 任意の行数を指定 */}

/* 記事内テーブル */
.table-scroll {overflow:auto; white-space:nowrap; margin-top:10px;width: inherit;}
.table-scroll table {width:100%; box-sizing:border-box; border-top:1px #999 solid; border-right:1px #999 solid; margin-bottom:20px!important; border-top-color:#f2f2f2; border-right-color:#f2f2f2; font-size:80%;}
.table-scroll table tr th {white-space:nowrap; line-height:normal!important; padding:10px; border-bottom:1px solid #f2f2f2; border-left:1px solid #f2f2f2;}
.table-scroll table tr td {white-space:nowrap; line-height:normal!important; padding:10px; border-bottom:1px solid #f2f2f2; border-left:1px solid #f2f2f2;}
.table-scroll table tr td:nth-of-type(1) {background-color:#fcfcfc; vertical-align:top; text-align:left;}
.table-scroll table tr td:first-child {font-weight: bold;}
/*.table-scroll table tr td + td {text-align: center;}*/
.table-scroll table ul {margin:0!important; padding:0 5px 0!important; list-style-position:inside!important;}
.table-scroll::-webkit-scrollbar { height: 10px;border-radius: 5px;}
.table-scroll::-webkit-scrollbar-track {border-radius: 5px; background: #f3f3f3;}
.table-scroll::-webkit-scrollbar-thumb {border-radius: 5px;background: #ccc;}

pre code{white-space: pre-wrap;/* 自動折り返しを許可 */  word-wrap: break-word;/* 長い単語でも折り返し */  display: block;/* ブロック要素として扱う */ overflow-x: hidden;/* 横スクロールを隠す */background-color: #efefef; padding: 20px 25px;margin: 20px 0 0;}
blockquote p font{font-size:15px;}
hr{display:none;}

/*-------------------------------------------------------------------
    S I D E
--------------------------------------------------------------------*/
#side .title {width:250px; padding:0; color:#6f6767; display:table;}
#side .title span {margin: 15px 0;display: block;}
#side .title h2 {padding: 0 0 2px;
        font-size: 18px;
        font-weight: normal;
        border-bottom: 4px solid #e8efec;}


/*-- 最新記事 --*/
ul.topics {margin: 0 0 30px 0; background: #f9f9f9; padding: 11px 9px 15px;}
ul.topics li {margin: 10px 0 0 0;
        padding: 0 0 8px 0;
        font-size: 15px;
        line-height: 1.4;
        position: relative;
        list-style: none;
        text-decoration: none;}
ul.topics li a:link {text-decoration:none;}
ul.topics li a:before {
        margin: 0 7px 0 0;
        content: "\f105";
        font-family: "Font Awesome 5 Free";
        font-weight: bold;
		color: #fe8518;}
.search_box input[type=text]{background: #fff;
    border: 2px solid #d6dbdf;
    border-radius: 3px;
    font-size: 1rem;
    height: 26px;
    outline: none;
    padding-right: 2px;
display: inline-block;
width: 70%;}
.search_box input[type=submit]{height: 32px;
    display: inline-block;
    background: #000;
    border-radius: 0.3rem;
    color: #fff;}


/*-- カテゴリ --*/
ul.cat-list  {margin: 0 0 30px 0; background: #f9f9f9; padding: 11px 9px 15px;}
ul.cat-list li {padding:0 0 0 7px; font-size:14px; line-height:1.6; background:url(/images/common/list.gif) left no-repeat;  list-style: none;}
ul.cat-list a:link {text-decoration:none;}
ul.cat-list a:before {
        margin: 0 7px 0 0;
        content: "\f105";
        font-family: "Font Awesome 5 Free";
        font-weight: bold;
		color: #fe8518;}



/* smartPhone */
@media screen and (max-width: 640px) {

/*-------------------------------------------------------------------
    MAIN
--------------------------------------------------------------------*/
.main_img_wrap_oth h2{font-size: 18px; border-bottom:none;text-align:left;line-height: 1.4;margin: 0;}
.main_img_wrap_oth h3{text-align:left;}

.entry_article_wrap h1 {padding:0 0 0 14px; border-left:solid 7px #ec451e; font-size:20px; line-height:1.4; word-break:break-all; text-align: left; border-bottom: none;}
.entry_article_wrap h2 {margin:35px 0 0; padding:0 0 4px; font-size:20px; border-bottom:4px solid #f9d4cc; line-height:1.4;text-align: left;;}
.entry_article_wrap h3 {margin:30px 0 0; padding:0 0 5px; border-bottom:solid 1px #ccc; font-size:16px;text-align: left;}
.entry_article_wrap h3:before {margin:0 6px 0 0; content:"\f0dd"; color:#ec451e; font-family:"Font Awesome 5 Free"; font-weight:bold; position:relative; top:-4px;}
.entry_article_wrap h4 {margin:25px 0 0; padding:8px 10px; background:#f5f4f2; font-size:14px; border-left:solid 4px #ec451e; border-bottom: none;}
.entry_article_wrap h5 {margin:25px 0 0; font-size:14px; color:#ec451e;}

.entry_article_wrap .article-in p {color: #666; line-height: 1.8; word-break: break-all;}
mark {background-image: linear-gradient(transparent 60%, #daebfb 50%); font-weight: bold; color: #666;}
.entry_article_wrap ul.share li{list-style: none;}

/* カテゴリ一覧ページ */
.entry_box p.sp_img {width:140px; margin:4px 0 0; float:left;}
.entry_box .summary-box {width: 190px; float: right;}
.entry_box p.article-in {overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; /* 任意の行数を指定 */}

/* 記事内テーブル */
.table-scroll {overflow:auto; white-space:nowrap; margin-top:10px;width:340px;position: relative;}
.table-scroll table {box-sizing:border-box; border-top:1px #999 solid; border-right:1px #999 solid; margin-bottom:20px!important; border-top-color:#f2f2f2; border-right-color:#f2f2f2;}
.table-scroll table tr th {white-space:nowrap; line-height:normal!important; padding:10px; border-bottom:1px solid #f2f2f2; border-left:1px solid #f2f2f2;}
.table-scroll table tr td {white-space:nowrap; line-height:normal!important; padding:10px; border-bottom:1px solid #f2f2f2; border-left:1px solid #f2f2f2;}
.table-scroll table tr td:nth-of-type(1) {background-color:#fcfcfc; vertical-align:top; text-align:left;}
.table-scroll table tr td:first-child {font-weight: bold;}
/*.table-scroll table tr td + td {text-align: center;}*/
.table-scroll table ul {margin:0!important; padding:0 5px 0!important; list-style-position:inside!important;}
.table-scroll::-webkit-scrollbar { height: 10px;border-radius: 5px;}
.table-scroll::-webkit-scrollbar-track {border-radius: 5px; background: #f3f3f3;}
.table-scroll::-webkit-scrollbar-thumb {border-radius: 5px;background: #ccc;}
.table-scroll:before {content: "\f362"; font-family: "Font Awesome 5 Free"; font-weight: bold; position: absolute; top: 0; left: 0; z-index: 9; background: rgba(204,204,204,.8); padding: 0.2em; font-size: 120%; /*border-radius: 0 0 5px;*/ color: #fff;}

pre code{white-space: pre-wrap;/* 自動折り返しを許可 */  word-wrap: break-word;/* 長い単語でも折り返し */  display: block;/* ブロック要素として扱う */ overflow-x: hidden;/* 横スクロールを隠す */background-color: #efefef; padding: 20px 25px;margin: 20px 0 0;}
blockquote p font{font-size:15px;}
hr{display:none;}

/*-------------------------------------------------------------------
    S I D E
--------------------------------------------------------------------*/
#side {width: 80% !important;padding: 10px;margin: 0 auto;}
#side .title {width: 100%;
        padding: 0;
        color: #6f6767;
        display: table;
        text-align: center;}
#side .title span {margin: 15px 0;display: block;}
#side .title h2 {padding: 0 0 2px;
        font-size: 18px;
        font-weight: normal;
        border-bottom: 4px solid #e8efec;}



/*-- 最新記事 --*/
ul.topics {margin: 0 0 30px 0; background: #f9f9f9; padding: 11px 9px 15px;}
ul.topics li {margin: 10px 0 0 0;
        padding: 0 0 8px 0;
        font-size: 15px;
        line-height: 1.4;
        position: relative;
        list-style: none;
        text-decoration: none;}
ul.topics li a:link {text-decoration:none;}
ul.topics li a:before {
        margin: 0 7px 0 0;
        content: "\f105";
        font-family: "Font Awesome 5 Free";
        font-weight: bold;
		color: #fe8518;}
.search_box input[type=text]{background: #fff;
    border: 2px solid #d6dbdf;
    border-radius: 3px;
    font-size: 1rem;
    height: 26px;
    outline: none;
    padding-right: 2px;
display: inline-block;
width: 70%;}
.search_box input[type=submit]{height: 32px;
    display: inline-block;
    background: #000;
    border-radius: 0.3rem;
    color: #fff;}
/*-- カテゴリ --*/
ul.cat-list  {margin: 0 0 30px 0; background: #f9f9f9; padding: 11px 9px 15px;}
ul.cat-list li {padding:0 0 0 7px; font-size:14px; line-height:1.6; background:url(/images/common/list.gif) left no-repeat;  list-style: none;}
ul.cat-list a:link {text-decoration:none;}
ul.cat-list a:before {
        margin: 0 7px 0 0;
        content: "\f105";
        font-family: "Font Awesome 5 Free";
        font-weight: bold;
		color: #fe8518;}


	
}
