/*
Theme Name: 成績Ap[AO推薦個別講座]
Description:成績Ap[AO推薦個別講座]テンプレートです
*/

@charset "UTF-8";
@import url(//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css);



/*=================================================
初期設定
===========================*/
html{ margin:0; padding: 0;  }
body {height:100%; font-family: "Montserrat","游ゴシック",YuGothic,"ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,sans-serif;}

body {background: url(images/bk.jpg) repeat; color: #333333; }
a[href^="tel:"] { cursor: default; }
ul{ padding: 0;  margin: 0 !important;}
ul li{ list-style: none; padding: 0; margin: 0; }
table{ width: 100%; }
strong{ /*color: #ff9800;*/ font-weight: bold; }

img{ max-width: 100%; height: auto; }
table th , table td{ padding: 10px; border-bottom:#c8c8c8 2px solid; }

a{ color: #333333; transition: .2s;}
a:hover {color: #E9454F; text-decoration: none;}
main a:hover {color: #E9454F; text-decoration: underline;}
p{ font-size: 1rem; line-height: 2rem; }

hr{ margin : 4rem 0 !important; border-color:#ddd; border-width: 1px; }


h4{ line-height: 1.5 !important; }


.gmap {height: 0; overflow: hidden; padding-bottom: 56.25%; position: relative; }
.gmap iframe {position: absolute; left: 0; top: 0; height: 100%; width: 100%; }
.movie-wrap {position: relative; padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/ height: 0; overflow: hidden; }
.movie-wrap iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.d-table{ display: table; }
.d-table_cell{ display: table-cell; vertical-align: middle; }


/*Bootstrap上書き*/
.lead { line-height: 2rem;}

/* -------------------------------------
 *  共通CSS
 * -------------------------------------*/
.hover a , a img.hover{
    -webkit-transition: 0.2s ease-in-out;
    -moz-transition: 0.2s ease-in-out;
    -o-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out;
}
.hover a:hover , a img.hover:hover{
    opacity: 0.4;
    filter: alpha(opacity=60);
    text-decoration: none;
}
main .hover a:hover{ text-decoration: none;}

.bor_r{ border-radius: 5px; }
.unline{ border-bottom: #888 1px dotted;}
.att01 span{ /*border-top: #519dd2 1px solid;*/ border-bottom: #da6f49 1px solid; padding: 10px; margin: 10px; }
.att02 span{ background: #fff; border-radius: 5px; padding: 10px; margin: 10px; }

.red{ color: #e60012 !important;}
.yew{ color: #946700  !important; }
.green {color: #008000!important; }
.bl {color: #da6f49!important; }
.pink {color: #ff1859!important; }
.purple{color:#6f5ea2!important;}
.or{ color: #e46d00 !important; }

.font08{ font-size: .8rem; line-height: 1.3rem; }
.font09{ font-size: .9rem; }
.font10{ font-size: 1rem; }
.font12{ font-size: 1.2rem; }
.font14{ font-size: 1.4rem; }
.font16{ font-size: 1.6rem; line-height: 2.5rem;}
.font18{ font-size: 1.8rem; line-height: 3rem;}
.font20{ font-size: 2rem; line-height: 3.2rem;}

.underline {background:linear-gradient(transparent 70%, #FFFF00 0%); }
.underline_red {background:linear-gradient(transparent 70%, #f1b29b 0%); }
.underline02 {
    background: linear-gradient(transparent 35%, #ffdc00 35%);
    font-weight: bold;
    border-radius: 6px;
}
.bg_border{ /*background-color: #ddd;*/ border: #f1b29b 3px solid; display: inline-block; margin: 0 auto; box-sizing:border-box; }
.pt-5rem{ padding-top: 5rem; }
.list li{ list-style-type: disc; margin-left: 1.5rem; }
.apnavi_logo{ background: url(images/ser_nav.png) no-repeat 0 2px; background-size: 150px; padding-left: 155px; display: inline-block; }



/*adobeフォント*/
.midashi{font-family: toppan-bunkyu-midashi-go-std,sans-serif; font-weight: 900; font-style: normal;}



/*=================================================
header + MV
===========================*/
#he_line{ background: #5a3512; height: 35px; width: 100%; border-bottom: 1px solid #9fa5b3;}
h1 { color:#FFFFFF; font-size: .9em; font-style: normal; margin-bottom: 0 ; padding-top: 10px; }
#he_line i{ padding-top: 10px; }
#he_line a i{ color: #FFFFFF; }
#he_line a i:hover{ color: #f1b29b;}

i{ display: inline-block; padding-right: 15px; }


/*以下、いらなかったら捨てる*/
#mv_pc{ background: url(images/mv_bk.png) no-repeat right center #eae3d5; height: 400px; margin-top: 20px; }
#mv_pc .container{ position: relative; }
#mv_pc .container .mav_txt{ position: absolute; z-index: 999; }
#mv_pc .container #slide_mv{ position: absolute; z-index: 99; top: -20px;
    left: 80px; }
#mv_pc .container #slide_mv .metaslider{box-shadow: #333 1px 1px 5px;}



/*PC + TAB*/
#navarea { background-color: rgba(216,106,0,0.8); position: absolute; z-index: 9999; width: 100%; }
#header_tab #navarea nav ul{ display: table; }

#navarea nav ul li , #navarea nav ul li a{ text-align: center; color: #fff; width: 100%; height: 100%; display: table-cell; width: 11.42857%; height: 70px; vertical-align: middle; margin: 0; padding: 0; overflow: hidden; font-size: .85rem}
#navarea nav ul li.logoli , #navarea nav ul li.logoli a{ width: 20%; }


#navarea nav ul li a{transition: all .3s; width: 100%; width: 200px; }
#navarea nav ul li a:hover ,#navarea nav ul li a.on{background-color: rgba(243, 217, 208,0.8); color: #70311a; }
#navarea nav ul li span{ display: block; font-size: .55rem; color: #70311a; text-transform: uppercase;}
#navarea nav ul li img{ width: +85%; padding: 0 10%; }




/*=================================================
TOP
===========================*/
/*MV*/
.mv_area{ position: relative; }
#mv_txt .d-inline-block{ background-color: rgba(255,255,255,.8); }
#pc_mv #mv_txt{ text-align: center; position: absolute; left: 0; right: 0; margin: auto; bottom: 30px; }
.home_mv_logo{ max-width: 320px; }
#sp_mv #mv_txt{ text-align: center; }



@media (min-width: 768px) {
    #sp_mv{ margin-bottom: 10rem; }
    #sp_mv #mv_txt{ position: absolute; left: 0; right: 0; margin: auto; bottom: -150px; }
}
@media (max-width: 767.98px) {
    #sp_mv #mv_txt{background: #FFC107; background: -webkit-linear-gradient(to right, #FFC107, #fff3d7); background: linear-gradient(to right, #FFC107, #fff3d7); }
}



a.read-more{ text-decoration: underline; }
a.read-more:hover{ text-decoration: none; }
.day{ font-size: .8rem; }
.cat_label a:hover{ color: #fff; opacity: .7;}

.more_btn a{ display: inline-block; background: #f1b29b; box-shadow: 3px 3px 0 #ccc; padding: 10px 50px; color: #fff;}
.more_btn a:hover{ color: #fff; background: #da6f49; text-decoration: none; }

.more_btn2 a{ display: inline-block; padding: 10px 50px; color: #fff; background: #e46d00; border: #da6f49 1px solid; }
.more_btn2 a:hover{ color: #da6f49; background: #ffffff; text-decoration: none; box-shadow: 0 0 .5rem rgba(0, 0, 0, 0.20); border: #da6f49 1px solid; }




/*特徴*/
#feature .num{ font-size: 1.1rem; color: #da6f49; }
#feature h2{ line-height: 3.5rem; font-weight: bold; }
#feature .feanum{ position: relative; }
#feature .feanum:after{ position: absolute; bottom:6px; left:0; content: ""; height: 2px; width: 75px; /*left: 50%; margin-left: -35px;*/ background: #f1b29b; }
#feature #feature1 .num , #feature #feature2 .num , #feature #feature3 .num { margin-bottom: 1rem; padding-bottom: 1rem; }


/*新着*/
#newspost h2{ font-size: 1rem; padding: 20px 1rem 15px; margin: 0; }
#newspost h2.main_ttl{ font-size: 2rem; }
#newspost .cat_label a {display: block; padding: 3px 20px; color: #fff; font-size: .8rem; border-radius: 2px; text-align: center; width: 100%; }


/*声*/
#voice h2{ position: relative; margin-top: 55px; }
#voice h2:after{ position: absolute; content: ""; height: 48px; width: 2px; background: #333; margin: 0 auto; left:0 ; right:0; top:-55px; }
#voice h2 span{ text-transform: uppercase; display: block; color: #da6f49; font-size: 1rem; margin-bottom: 5px; }
#voice .voice_box a:hover{ opacity: .6;  z-index: -1;}
#voice .voice_box img{ width: 100%; }
#voice .voice_box { position: relative; }
#voice .voice_box .voice_name{ position: absolute; top:-20px; left:10px; background: #da6f49; padding: 5px 10px;  z-index: 10;}
#voice .location{ font-size: .85rem; }
#voice .chtxt{ background-color: rgba(71,103,170, 0.9); padding: 10px; z-index: 9; position: absolute; bottom: 0; margin-bottom: 0; width: 100%; text-align: center; color: #fff; font-size: .9rem; }
#voice .chtxt a , #voice .chtxt a:hover{ color: #fff; }


@media (min-width: 576px)  {
    #feature #feature1{ background: url(images/top_img01.png) right bottom; background-size: cover;}
    #feature #feature2{ background: url(images/top_img02.png) left bottom ; background-size: cover;}
    #feature #feature3{ background: url(images/top_img03.png) right bottom ; background-size: cover;}
    #newspost .cat_label { width: 15%; text-align: center; margin-right: 2rem; }
    #feature #feature2 .num{ margin-top: -70px; }
    #feature #feature3 .num{ margin-top: -40px; }
}
@media (max-width: 575.98px) {
    #feature .feanum:after{ left: 50%; margin-left: -35px; }
    #feature #feature1 { padding-top: 3rem; }
    #feature #feature2 { padding-top: 1rem; }
    #feature #feature3 { padding-top: 0; }
    #feature #feature1{ background: url(images/top_img01sp.png) no-repeat bottom right ; background-size: cover;}
    #feature #feature2{ background: url(images/top_img02sp.png) no-repeat bottom left ; background-size: cover;}
    #feature #feature3{ background: url(images/top_img03sp.png) no-repeat bottom right ; background-size: cover;}
    #feature h2{ font-size: 1.3rem; font-weight: bold; line-height: 1.9rem; }
    #feature .more_btn2 a{ display: block; padding: 10px 0; width: 100%; font-size: .8rem; }

    #newspost .cat_label , #newspost .day{ display: inline-block; }
    #newspost .cat_label { margin-right: 1rem; }
    #newspost h2 a{ text-decoration: underline;}


}



@media (max-width: 991.98px) {
    #newspost .col-6:nth-child(odd){ padding-left: 10px !important; padding-right: 5px !important; }
    #newspost .col-6:nth-child(even){ padding-left: 5px !important; padding-right: 10px !important; }
}


/*=================================================
投稿
===========================*/
a.read-more{ text-decoration: underline; }
a.read-more:hover{ text-decoration: none; }
.day{ text-align: right; font-size: .8rem; }
.card-body{ padding: 0 !important; }
.card-body h2 , .card-body p , .card-body .day{ padding: 0 1rem; }
.card-body h2 { position: relative; }
.cat_label a{ display: inline-block; padding: 3px 20px; color: #fff; font-size: .8rem; border-radius: 2px;}
.cat_label a:hover{ color: #fff; opacity: .7;}
.newpost{ position: absolute; top:-5px; right: -5px; }

.more_btn a{ display: inline-block; background: #da6f49; box-shadow: 3px 3px 0 #ccc; padding: 10px 50px; color: #fff;}
.more_btn a:hover{ color: #fff; background: #ff9900 /*63abd5*/; text-decoration: none; }



/*=================================================
タイトルセット
===========================*/
h2.main_ttl{ text-align: center; color: #fff; text-transform: uppercase; background: url(images/bg_ttl.png ) no-repeat center center #da6f49; line-height: 6rem; }



/*=================================================
footer
===========================*/
#footer{ background-color: #f5f5f5; padding: 30px 0 0; margin-top: 250px; box-shadow: 0 -1px 3px #c3c3c3}
.footer_ttl { font-size: 1.7em; font-family: ten-mincho-text,serif; font-weight: 400; font-style: normal; margin-bottom: 0; color: #fff;}
.footer_ttl span{ font-size: 1.4rem; }
#footer ul li{ margin: 6px 0; }
#footer ul li.second{ margin-left: 6px; }
#footer a{ color: #333; }
#footer a:hover{ text-decoration: underline; }

/*　facebook埋め込み：レスポンシブ対応*/
.fb-page {display:block !important; width:100%; max-width:500px; margin-left:auto; margin-right:auto; height:300px; }
#footer_copy { background-color: #593512;  }
#footer_copy a{ color: #fff; font-size: .9rem; }
@media (max-width: 575.98px) {
    .footer_logo img{ width: 40%; margin: 0 auto 30px; }
}
@media (max-width: 575.98px) {
    #footer ul{ padding-bottom: 20px; }
    ul.footer_nav{ border-top:#949494 1px solid; }
    #footer ul li a{ display: block; width: 100%; border-bottom: #949494 1px solid; padding: 10px 20px; }
}


/*=================================================
固定ページ
===========================*/
/*想い*/
.message_bg {background: url(images/message_bg.jpg) top center no-repeat; background-size: cover; }
#page.message p.line{ line-height: 2rem; }

/*会社概要*/
#page.company .bg{ background: url(images/company_bg.png) bottom center no-repeat; background-size: contain; }
#page.company h3 span{ font-size: 1.6rem; padding: 0.5em 0; border-top: solid 3px #da6f49; border-bottom: solid 3px #da6f49; }
#page.company p.line{ line-height: 3rem; }
#page.company h4{border-bottom: solid 4px #ddd; position: relative; margin-bottom: 1rem; padding-bottom: .5rem;}
#page.company h4:after {position: absolute; content: " "; display: block; border-bottom: solid 4px #da6f49; bottom: -4px; width: 20%; }
#page.company img{ border-radius: 2px; }


/*システム概要*/
#page.system h2{ line-height: 4rem; }
#page.system .ser_box{ padding: 0; position: relative; margin-bottom: 10rem; margin-top: 5rem; }
#page.system .ser_box:after{ position: absolute; content: ''; z-index: -10; top: 0; right: 0; bottom: 30px; left: 0; transform: skewY(5deg); }
#page.system .ser_box.serodd:after{background: #ffebec;}
#page.system .ser_box.sereven:after{background: #f3f3f3;}
#page.system .ser_box.sereven .read{ background: rgb(255, 235, 236);}

.mask{ transform: skewY(5deg); overflow: hidden;}
.mask img{transform: skewY(-5deg); margin-bottom: -3rem; max-width: 800px; width: 100%; height: auto;}

.feel01 , .feel02 , .feel03{ width: 300px; }

@media (min-width: 1200px) {
    #page.system h2.pb-100{ padding-bottom: 100px; }
    .mask{ padding-top: 3rem; }
    .feel{ position: relative;}
    .feel01 , .feel02 , .feel03{ position: absolute; }
    .feel01 { top: 0; left: -100px;}
    .feel02 { top: -80px;  right: 0;}
    .feel03 { top: 130px; right: -150px; }
}
@media (max-width: 1199.98px) {
    .mask{ padding-top: 2rem; margin-top: -2.5rem; }
    .feel01 {text-align: left;}
    .feel02 { text-align: right;}
    .feel03 { text-align: left;}

}
@media (max-width: 575.98px) {
    #page.system h2{ line-height: 2rem; font-size: 1.5rem; }
    .mask img{ margin-bottom: -1rem; }
    .feel01 , .feel02 , .feel03{ width: 80%; }
}




/*サービス*/
.ser_ttl{ font-size: 1.2rem; color: #da6f49;}
#page.service .ser_box{ padding: 0; position: relative; margin-bottom: 10rem; margin-top: 5rem; }
#page.service .ser_box:after{ position: absolute; content: ''; z-index: -10; top: 0; right: 0; bottom: 30px; left: 0; transform: skewY(5deg); }

#page.service .ser_box .sernum{ color: #da6f49; margin-bottom: .5rem; display: inline-block; }

#page.service .ser_box h2{ position: relative; color: #fff; font-weight: bold; padding: 5px 0; margin-bottom: 2rem; }
#page.service .ser_box h2:after{ /*position: absolute; content: ""; background: #000; z-index: -10; top: 0; bottom: 0;*/}

#page.service .ser_box.serodd h2:after{ right: 0; left: -80%;}


#page.service .ser_box .serimg{ z-index: 10; }
#page.service .ser_box .serimg img , #page.service .ser_box .serimg .movie-wrap{ box-shadow: 5px 5px 0 rgba(0,0,0,.5);}

#page.service .ser_box .read{ border:1px solid #fff; background: rgb(255, 249, 249); padding: 1.5rem; margin-top: 2rem; }
#page.service .ser_box .read img{ width: 200px; }


#page.service .ser_box.serodd:after{background: #ffebec;}
#page.service .ser_box.sereven:after{background: #f3f3f3;}
#page.service .ser_box.sereven .read{ background: rgb(255, 235, 236);}

@media (min-width: 576px) {
    #page.service .ser_box .serimg img{  margin-top: -3rem; width: 90%; }
    #page.service .ser_box.sereven h2:after{ right: 0; left:-10px; width: 120%; }

}
@media (max-width: 575.98px) {
    #page.service .ser_box:after{transform: skewY(10deg);}
    #page.service .ser_box .serimg{  margin-bottom: 2rem; }
    #page.service .ser_box .serimg img{  margin-top: -3rem; }
    #page.service .ser_box.sereven h2:after{ right: 0; left: -80%; }
}

/*導入シュミレーション*/
.secttl{
    /*background: -webkit-linear-gradient(rgba(255,0,15,.9), rgba(255,0,15,.9)),
url(images/pc02.png) no-repeat right center ;*/
    /*background: url(images/pc03.jpg) no-repeat right center rgba(233,69,79,.8);*/
    background: linear-gradient(0deg, #da6f49 , #f1b29b);
    background-size: contain; color: #fff; text-align: center; }
.secttl {position: relative; display: block; margin: 1.5em 0; padding: 7px 10px; width: 100%;}
.secttl:before {content: ""; position: absolute; top: 100%; left: 50%; margin-left: -15px; border: 15px solid transparent; border-top: 15px solid #da6f49; }
.secttl:after {content: ""; position: absolute; top: 0; left: 50%; margin-left: -15px; border: 15px solid transparent; border-top: 15px solid #ffffff; }
.secttl p {margin: 0; padding: 0; }
.simulation .secttl .midashi{ font-size: 6rem; display: inline-block; line-height: 9rem; padding-top: 1rem; }
.price{ position: relative; display: inline-block; margin: 0 auto; }
.price_txt{ position: absolute; left:-5rem; }


.simulation .se01 h3{ border-bottom: #da6f49 1px solid; margin: 4rem 0 2rem; display: table; width: 100%; }
.simulation .se01 h3 span.ttl{background-color: #da6f49; color: #fff; font-weight: bold; font-size: 1.3rem; padding: .5rem 2rem; display: inline-block;}
.simulation .se01 h3 span.sup{ display: table-cell; vertical-align: middle; text-align: right; font-size: .8rem; }
.simulation .se01 table th , .simulation .se01 table td{ font-size: 1.3rem; font-weight: normal; }
.simulation .se01 table td{ text-align: right; font-family: Arial;  }

.simulation .se02 h3{ line-height: 3rem; }
.second{ position: relative; text-align: center; display: inline-block; margin-right: 2rem; }
.second h3 {color: #fff; font-size: 20px; padding: 0 3rem; margin: auto; display: inline-block; z-index: 3; position: relative;}
.second::before {content: ''; position: absolute; top: 0; bottom: 0; right: 0; left: 0; background-color: #da6f49; z-index: 2; transform: skew(-30deg); }
.simulation  .se02 table th , .simulation table td{ font-weight: normal; }
.simulation  .se02 table .line th , .simulation table .line td{ border-bottom: #c8c8c8 2px dotted; padding: 20px 10px; }
.simulation  .se02 table .lineno th , .simulation table .lineno td{ border-bottom: none; }
.simulation  .se02 table td{ font-family: Arial; }
.bg-light{ z-index: 1; }

@media (max-width: 767.98px){
    .simulation .se01 h3 span.sup{ text-align: left; }
    .second{ margin-bottom: 1rem; margin-left: .5rem; }

}


/*よくある質問*/
#page.faq dl{ border-bottom: 1px solid #000; }
#page.faq dt span.qu {color: #da6f49; font-size: 1.5em; display: inline-block; padding-right: 1rem;}
#page.faq  dd span.an {color: #5BC013; font-size: 1.5em; display: inline-block; padding-right: 1rem;}

#page.faq dt{ position: relative; border-top: 1px solid #000; padding: 1rem 3rem 1rem 1rem; cursor: pointer;}
#page.faq dt:hover{ color: #da6f49; }
#page.faq dd{ border-top: 1px dotted #000; padding: 1rem; }



#page.faq dt p , #page.faq dd p{ padding-left: 1em; text-indent: -1em;}

#page.faq dt:after{ font-family: FontAwesome; content: '\f078'; position: absolute; right: 0; top:25px; }
/*#page.faq dt:first-child:after ,
#page.faq dt[aria-expanded="true"]:after{ font-family: FontAwesome; content: '\f077'; position: absolute; right: 0; top:25px; }*/




/*お問い合わせ*/
#page.contact .box1{ font-size: 1.4rem; font-weight: bold; line-height: 2rem; border-top: 1px solid #da6f49; border-bottom: 1px solid #da6f49; }
#page.contact .box{ background: #da6f49; color: #fff; border-radius: 2px; }
#page.contact .box2 li{ list-style: disc; margin-left: 1rem; }
#page.contact .bor{ border: 10px solid #fff1e5; box-sizing: border-box;}
#page.contact table {border-spacing: 0; border-collapse: collapse; }
#page.contact table tr{ border-bottom: 1px solid #ddd; }
#page.contact table th , #page.contact table td{ border:none; color:#6e767a; }
#page.contact table th {
    font-weight: 400;
    line-height: 40px;
    display: inline-block;
    vertical-align: middle;
    letter-spacing: .06em;
    color: #6e767a;
}
input[type=text],
input[type=email],
input[type=tel] {
    font-weight: 400;
    width: 100%;
    height: 48px;
    padding: 0 12px;
    letter-spacing: .1em;
    border: none;
    background: #f2f2f2;
}
textarea {
    font-weight: 500;
    line-height: 1.5;
    width: 100%;
    height: 200px;
    margin-top: -3.5px;
    margin-bottom: -3.5px;
    padding: 12px;
    letter-spacing: .1em;
    border: none;
    background: #f2f2f2;
}
#page.contact table label{display: block; letter-spacing: .1em; color: #6e767a;  margin-bottom: 1px;}
.sosin{ background: #da6f49; }


.mw_wp_form{ padding-top: 1rem; }
.form-check{ padding-left: 0; }
.mwform-checkbox-field label, .mwform-radio-field label{ padding: 10px 20px ; background-color: #f5e3e4; border-radius: 5px; display: block; width: 100%; height: 100%; }
.mwform-checkbox-field label:hover, .mwform-radio-field label:hover{ cursor: pointer; }
.back {background-color: #888; border-radius: 3px; }
.sosin , .back {transition: .5s; margin: 0 auto;}
.sosin:hover , .back:hover{ opacity: 0.4; filter: alpha(opacity=60);}


@media (min-width: 768px) {
    #page.service img.main_img{ width: 70%; margin: 0 auto; }

}
@media (max-width: 575.98px) {
    #page.company img{ width: 50%; margin: 0 auto; margin-bottom: 2rem; }
    #page.contact table , #page.contact table th , #page.contact table td{ display: block; width: 100%; }
    #page.contact table th{ padding: 0; }
    #page.contact table td{ padding: 0 0 15px 0; }
    #page.contact .sosin , #page.contact .back{ width: 100%; }
    .mw_wp_form.mw_wp_form_preview{ padding-top: 5rem; }
}



/*=================================================
新着情報
===========================*/
.post_list_box{ border-top: 3px solid #d2d2d2; box-sizing:border-box; padding: 1rem 0; }
.post_list_box h3{ font-size: 1.2rem; font-weight: bold; }
.post_list_img{ position: relative; }

.post_list_more a{ border: 1px solid #777; display: inline-block; padding: .5rem 2rem; font-size: .85rem;  }
.post_list_more a:hover{ background-color: #da6f49; border-color:#da6f49; color: #fff; text-decoration: none; }
.bor_b{ border-bottom: 1px solid #ddd; margin-bottom: 10px; }

#single h2{ font-weight: bold; font-size: 1.4rem; }
#single .post_list_img .cat_label{ position: absolute; top:10px; left:-10px; }

#side ul { padding: 0 15px; }
#side ul li { border-bottom: 1px dotted #ddd; padding: 10px 0 ; margin: 10px 0; }
#side ul li h4{ font-size: 1rem; font-weight: bold;}
#side ul li .cat_color_icn{ height: 1rem; width: 1rem; border-radius: 2px; display: inline-block; margin-right: 10px; }
#side ul li h4 a , #side .category-list li a{ display: block; width: 100%; height: 100%; }
#side .cat_label a{ padding: 0 10px; margin-right: 5px;}


@media (max-width: 575.98px) {
    .bor_b{ margin-top: 1rem; }
    .post_list_img img{ width: 100%; }
    .bor_b h3{ width: 70%; }
    .bor_b .cat_label{ width: 28%; }
    #side { border-top: 5px solid #ddd; margin-top: 30px; padding-top: 20px; }
}


/*=================================================
声
===========================*/
#arc_voice .voive_box{ border-top: 3px solid #d2d2d2; box-sizing:border-box; padding: 1rem 0 3rem;  }
#arc_voice .chtxt{ font-size: 1.3rem; padding: 1rem 0 ; }
#arc_voice .bg{ background-color: #da6f49; padding: .5rem 1rem; border-radius: 2px; }
#arc_voice .details{ border:1px solid #d2d2d2; padding: 2rem 1rem 1rem 0; margin-top: -2rem; margin-left: 1rem; font-size: .9rem;}
#arc_voice .link a{ background-color: #da6f49; padding: 5px 20px; color:#fff; border-radius: 2px }

.item span{ background-color: #da6f49; color: #fff; padding: 0 10px; display: inline-block; margin-left: 20px; border-radius: 50px; line-height: 130%; font-size: .8rem; margin-left: 20px; margin-right: 5px;}

#side_voice h3{ line-height: 1.2rem; border-top: 4px solid #ddd; padding-top: 15px; margin-top: 15px;}
#side_voice h3 a{ font-size: 1rem; font-weight: bold; }
#side_voice .img{ width: 30%; padding-right: 5%;}
#side_voice .img img{ border-radius: 5px; }
/*.side_voice_box{ border-top: 3px solid #ddd; padding-top: 10px; margin-top: 20px; }*/



@media (max-width: 575.98px) {
    #arc_voice .link a{ display: block; }
    #arc_voice .ch { width: 30%; padding-right: 15px; padding-bottom: 15px;}
    #arc_voice .ch img{  border-radius: 3px; }

}

/*=================================================
カード・ページネーション
===========================*/
.card .img img{ width: 100%;}

#pagination ul li{display: inline-block;}
#pagination ul li span.current ,
#pagination ul li a{
    color: #fff;
    display: block;
    margin: 0 2px;
    padding: 0;
    background:#777;
    width: 50px;
    line-height: 50px;
    text-align: center;
    /*position: relative;*/
    border-radius: 2px;
    text-align: center;
}
#pagination ul li span.current { background-color: #da6f49; color: #fff; }
#pagination ul li a:hover{ text-decoration: none; background-color: #f6e6e6; color: #777;}
#pagination ul li a.prev ,#pagination ul li a.next { font-size: .8rem; }



/*=================================================
タイトルセット
===========================*/
.indexttl{ font-weight: bold; color: #fff; text-align: center; margin-top: -2rem; margin-bottom: 1rem;}
.indexttl h2{ display: inline-block; margin: 0 auto; background-color: rgba(0, 0, 0, 0.9); padding: 10px; z-index: 9; box-shadow: 3px 3px 0 #ccc; padding: .8rem 5rem;}
.indexttl .slug{ font-size: .9rem; font-family: "Montserrat","游ゴシック",YuGothic,"ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,sans-serif; color: #f1b29b; display: block; margin-top: 5px; font-weight: normal; text-transform: uppercase; }
#pan{ padding-bottom: 1rem; font-size: .8rem; }

@media (max-width: 575.98px) {
    .indexttl h2{ font-size: 1.5rem;  }
}



/*=================================================
テキストアニメーション
===========================*/
.animate , .animate1 , .bottom , [data-sr] { visibility: hidden; }


.txt_animate {
  opacity: 0;
}
.txt_animate span {
  position: relative;
  top: 10px; /* left: 10px; topとleft同時指定で斜めの動き*/
  opacity: 0;
}