/*
Theme Name:	マテリアル2_child
Template:	wp_material2
Description:	マテリアル2の公式子テーマ
Version:	1.0
Author URI:	http://wp-material2.net
*/

/*****************************************
 PC及び全体用
******************************************/
@font-face {
    font-family: PixelMplus12-Regular;
    src: url('font/PixelMplus12-Regular.ttf') format("truetype");
    font-display: swap;
}

body {
    background: #303030;
    color: #fff;
}

.margin_bottom_13 {
    margin-bottom: 13px;
}

.main {
    background: #303030;
}

.main:before {
    background-color: #303030;
}

.side .box {
    border: 4px solid #fff;
    border-radius: 8px;
    padding: 10px;
}

.side {
    -webkit-overflow-scrolling: touch;
}

.side h2 {
    border-bottom: none !important;
    font-family: PixelMplus12-Regular,"メイリオ";
}

.accent_header, h2.under_content {
    color: #fff !important;
    border-top: 2px solid #fff !important;
    border-bottom: 2px solid #fff !important;
}

.posts .post {
    border: 4px solid #fff;
    border-radius: 8px;
}

.posts .post_info {
    border-top: 4px solid #fff;
    background: #303030;
}

.post_info .write_date {
    color: #fff;
}

.post_info h3 a {
    color: #fff;
}

.cat_list .post {
    background: #303030;
    box-sizing: border-box;
    border: 4px solid #fff;
    border-radius: 8px;
    box-shadow: none;
}

.cat_list .post_info {
    width: 278px;
}

.textboard {
    border: 4px solid #fff;
    border-radius: 8px;
    width: 100%;
    max-width: 728px;
    margin: 20px auto 0 auto;
}

@keyframes typing { from { width: 0; } }
@keyframes blink-car { 50% { border-color: transparent; } }
.lead {
    font-family: PixelMplus12-Regular,"メイリオ";
    border-right: 5px solid;
    width: 300px; /* fallback */
    margin: 10px auto;
    white-space: nowrap;
    overflow: hidden;
    animation: typing 5s steps(32, end),
    blink-car 1s infinite ease;
    color: #fff;
    font-size: 16px;
    font-weight: bold;
}

/*.side a:hover:before {
    font-family: FontAwesome;
    content: '\f0da';
    padding-right: 5px;
}

.share-buttons a:hover:before,.follow-box a:hover:before,.textwidget a:hover:before {
    content: none;
}
*/

.cat_link a {
    background-color: #303030;
}

.content_header .write_date {
    color: #fff;
}

.content_header .calendar {
    color: #fff;
    font-size: 1.3em;
}

.bread ul li,.bread ul li a {
    color: #fff;
}

.eye_catch {
    margin: 0 auto 0;
}

.textboard_single {
    border: 4px solid #fff;
    border-radius: 8px;
    width: 100%;
    max-width: 728px;
    margin: 20px auto 30px auto;
}

.lead_single {
    font-family: PixelMplus12-Regular,"メイリオ";
    border-right: 5px solid;
    width: 150px; /* fallback */
    margin: 10px auto;
    white-space: nowrap;
    overflow: hidden;
    animation: typing 5s steps(32, end),
    blink-car 1s infinite ease;
    color: #fff;
    font-size: 16px;
    font-weight: bold;
}

#comments .combody {
    color: #303030;
}

.cominfo a,.combody a,.content_body a {
    color: #dd9933;
}

.cominfo a:hover,.combody a:hover,.content_body a:hover {
    text-decoration: none;
}

.wpcf7-form {
    background: #303030;
    color:#fff;
    border: none;
}

.main_inner .box h2 {
    display: none;
}

div.ad p {
    color: #fff;
}

.pagenavi .current {
    background: #dd9933;
}

.pagenavi span, .pagenavi a {
    background: #576475;
}

.text-center {
	text-align: center;
}

.banner-position {
	line-height: 0;
}

/*****************************************
 タブレット（大）以下
******************************************/
@media screen and (max-width: 1180px) {





}
/*****************************************
 タブレット（中）以下
******************************************/
@media screen and (max-width: 760px) {

.header_inner {
    margin-top:20px;
}

.header_img {
    max-width: 97%;
}

.textboard {
    width: 94%;
}

.cat_list .post_info {
    width: 80%;
}

}
/*****************************************
 タブレット（小）以下
******************************************/
@media screen and (max-width: 620px) {



}
/*****************************************
 スマホ用
******************************************/
@media screen and (max-width: 500px) {

.cat_list .post_info {
    width: 78%;
}

}



@media screen and (max-width: 480px) {

.lead {
    font-size: 14px;
    width: 280px; /* fallback */
}

.lead_single {
    font-size: 14px;
    width: 140px; /* fallback */
}

}