/******************************************
Theme Name:BLOGS
Theme URI:https://alicex.jp/shikiri/note/3/
Description:スレッド式ブログ用デザイン
Version:1.0.0
Author:ARCHETYP
Author URI:https://alicex.jp/shikiri/
:https://alicex.jp/
License:GNU General Public License
License URI:https://alicex.jp/shikiri/2/
******************************************/
/*全ての要素*/
*{
word-break:break-all;
word-wrap:break-word;
overflow-wrap:break-word;
line-break:strict;
word-wrap:break-word;
-webkit-text-size-adjust:none;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
margin:0;
padding:0;
outline:none;
}
/*body要素*/
body{
color:#444;
background:#f7f7f7;
line-height:1.6;
font-size:14px;
font-family:Assistant,'Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',Meiryo,メイリオ,sans-serif;
word-break:break-all;
text-align:justify;
}
/*リンク*/
a{
color:#0e7ac4;
}
article{
margin:20px auto;
max-width:100%;
}
/*ヘッダーとフッター*/
.header,footer{
font-family:Montserrat,sans-serif;
display:block;
font-size:16px;
width:100%;
max-width:100%;
padding:22px 10px 15px 10px;
color:#444;
background:#fff;
text-align:center;
box-shadow:6px 5px 8px rgba(0,0,0,0.1);
}
/*ヘッダー*/
.header{
margin:-20px 0 20px 0;
font-weight:700;
font-size:30px;
}
.header small{
font-size:90%;
}
.header span{
display:block;
font-size:13px;
font-weight:normal;
}
/*フッター*/
footer{
padding:22px 10px 35px 10px;
margin:0 auto;
border-top:1px solid #efefef;
}
.commentHeader{
font-size:13px;
text-align:center;
width:100%;
max-width:100%;
padding:12px 10px 12px 10px;
color:#444;
background:#fff;
border-top:1px solid #f8823c;
border-bottom:1px solid #f8823c;
}
section.section{
display:flex;
flex-wrap:wrap;
width:96%;
max-width:960px;
margin:0 auto;
counter-reset:number 0;
}
.brand{
display:block;
width:60px;
height:60px;
overflow:hidden;
object-fit:cover;
margin:0 auto 0px auto;
clear:both;
}
/*カードBOX領域*/
.fc,#commentEdit{
width:calc(100% - 10px);
margin:0 5px 10px 5px;
color:#444;
background:#fff;
border:1px solid #ddd;
box-shadow:3px 3px 6px rgba(0,0,0,0.1);
}
.fc .upper{
display:flex;
}
.fc .upper .icons{
display:inline-block;
width:60px;
height:60px;
overflow:hidden;
object-fit:cover;
margin:0 auto;
border-radius:4px;
background:#fff;
}
.fc .upper .group{
width:100%;
padding:12px;
background:#fff;
}
.fc .upper .group .group_head{
display:flex;
margin-bottom:12px;
color:#bcbcbc;
}
.fc .upper .group .categoryTitle{
display:block;
width:100%;
text-align:right;
padding-right:6px;
}
.fc .upper .group .date{
display:block;
width:100%;
text-align:left;
}
.fc .upper .group .numbering{
display:block;
font-size:24px;
font-weight:normal;
line-height:1.4;
padding:4px 0;
}
.fc .upper .group .name{
font-weight:normal;
}
.fc .upper .group .pbody{
display:block !important;
font-size:16px;
line-height:1.6;
}
.fc .upper .group .pbody em{
font-style:normal;
color:#26ae90;
background:#f8f8f8;
}
.fc .upper .group .pbody .read__more{
clear:both;
display:block;
width:240px;
margin:12px auto !important;
margin-left:auto !important;
margin-right:auto !important;
padding:6px 4px;
text-align:center;
font-size:14px;
color:#fff;
background:#a5d85d;
text-decoration:none;
border-radius:4px;
}
.fc .upper .group .group_footer{
display:flex;
}
.fc .upper .group .group_footer div{
width:100%;
}
.fc .upper .group .group_footer .p:nth-child(even){
text-align:right;
}
.fc .upper .group .mailbox{
margin-bottom:12px;
}
.th{
width:calc(100% - 10px);
margin:0 5px 10px 5px;
color:#bcbcbc;
background:#fff;
border:1px solid #ddd;
box-shadow:3px 3px 6px rgba(0,0,0,0.1);
line-height:1.0;
}
.th a{
text-decoration:none;
}
.th .upper{
display:flex;
-webkit-align-items:center;
align-items:center;
}
.th .upper .icons{
width:180px;
height:100px;
background:#f3d83f url(//alicex.jp/data/shikiri/img/shikiri_upld_14.jpg) no-repeat 50%;
-webkit-background-size:cover;
background-size:cover;
object-fit:cover;
overflow:hidden;
}
.th .upper .icons img{
display:inline-block;
min-width:180px;
min-height:100px;
object-fit:cover;
object-position:80% 50%;
margin:0 auto;
border-radius:4px;
background:#fff;
}
.th .upper .group{
width:calc(100% - 60px);
padding:6px 6px 6px 8px;
background:#fff;
}
.th .upper .group .numbering{
font-family:'Montserrat',sans-serif;
font-size:28px;
color:#aaa;
background:#fff;
}
.th .upper .group .numbering:before {
counter-increment:number 1;
content:counter(number, decimal-leading-zero);
}
.th .upper .group .group-headre{
display:flex;
-webkit-align-items:center;
align-items:center;
}
.th .upper .group .topics{
display:inline-block;
font-size:16px;
width:calc(100% - 40px);
/*position:relative;
top:-4px;*/
padding:0 0 0 6px;
color:#777;
background:#fff;
}
.th .upper .group .p{
color:#aaa;
background:#fff;
padding:6px 12px 0 40px;
line-height:1.4;
}
form{
width:100%;
}
.radius{
border-radius:60px !important;
overflow:hidden;
}
.bgc{
background:#e3f2fd;
}
.breadcrumb{
display:block;
width:98%;
max-width:960px;
margin-left:auto;
margin-right:auto;
margin-bottom:6px;
padding:0px 15px;
list-style:none;
background-color:#f5f5f5;
border-radius:4px;
}
.breadcrumb > li {
float:left;
display:inline-block;
margin:2px;
}
.breadcrumb > li + li:before {
padding:0 5px;
color:#aaa;
content:"\00bb";
}
.breadcrumb > .active {
color:#777;
}
.backBtn-grid{
display:flex;
width:100%;
max-width:960px;
}
.backBtn-grid .backBtn{
display:block;
width:calc(100% / 2 - 10px);
margin:0 5px 1px 5px;
padding:6px 0;
text-decoration:none;
background:#fff;
border:1px solid #ddd;
}
.backBtn-grid span.backBtn{
display:block;
color:#ccc;
}
.backBtn-grid a.backBtn{
box-shadow:3px 3px 6px rgba(0,0,0,0.1);
display:block;
color:#444;
}
textarea{
width:100%;
max-width:100%;
}
.commentError{
display:block;
width:100%;
max-width:960px;
color:#fff;
background:#eb2142;
margin-left:auto;
margin-right:auto;
padding:12px;
}
table{
margin:12px auto 0;
background:#fff;
border:1px solid #ccc;
}
td{
width:34px;
}
table tr td:nth-child(1){
color:#ff8080;
}
table tr td:nth-child(7){
color:#1b95e0;
}
table tr td[colspan="7"]{
color:#777;
border-bottom:1px solid #ccc;
}
td a{
text-decoration:none;
display:block;
color:#888;
background:#efefef;
border:1px solid #fff;
}
table tr td:nth-child(1) a{
color:#fff;
background:#ff8080;
border:1px solid #ff8080;
}
table tr td:nth-child(7) a{
color:#fff;
background:#1b95e0;
border:1px solid #1b95e0;
}
table tr td[colspan="7"] a{
color:#777;
display:inline-block;
text-decoration:underline;
background:transparent;
border:0px;
}
blockquote br,
.pbody ol br,.pbody ul br{
display:none;
}
blockquote p br,
.pbody ol li br,.pbody ul li br{
display:block;
}
blockquote{
position:relative;
margin:12px 0;
padding:10px 15px 10px 50px;
box-sizing:border-box;
font-style:italic;
border:solid 2px #464646;
color:#464646;
}
blockquote:before{
display:inline-block;
position:absolute;
top:20px;
left:15px;
vertical-align:middle;
content:"\f10d";
color:#77c0c9;
font-size:25px;
line-height:1;
font-weight:900;
font-family:"Font Awesome 5 Free";
}
blockquote p{
padding:0;
margin:10px 0;
line-height:1.7;
}
blockquote cite{
display:block;
text-align:right;
color:#888888;
font-size:0.9em;
}
.pbody ol{
border:solid 2px skyblue;
border-radius:5px;
padding:0.5em 1em 0.5em .3em;
position:relative;
counter-reset:number;
list-style-type:none!important;
}
.pbody ol li{
position:relative;
padding-left:30px;
line-height:1.5em;
padding:0.5em 0.5em 0.5em 30px;
}
.pbody ol li:before{
position:absolute;
counter-increment:number;
content:counter(number);
display:inline-block;
background:#5c9ee7;
color:white;
font-family:'Avenir','Arial Black','Arial',sans-serif;
font-weight:bold;
font-size:15px;
border-radius:50%;
left:0;
width:25px;
height:25px;
line-height:25px;
text-align:center;
top:50%;
color:#fff;
background:skyblue;
-moz-transform:translateY(-50%);
-webkit-transform:translateY(-50%);
-o-transform:translateY(-50%);
-ms-transform:translateY(-50%);
transform:translateY(-50%);
}
.pbody ul{
color:#1e366a;
border-top:solid #1e366a 1px;
border-bottom:solid #1e366a 1px;
padding:0.5em 0 0.5em 1.5em;
}
.pbody ul li{
line-height:1.5;
padding:0.5em 0;
}