/*
Theme Name: 成績Ap[写メQ先生ネクスト]
Description:成績Ap[写メQ先生ネクスト]テンプレートです
*/

@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; }

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: #77C260; text-decoration: none;}
main a:hover {color: #77C260; 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: #519dd2 1px solid; padding: 10px; margin: 10px; }
.att02 span{ background: #fff; border-radius: 5px; padding: 10px; margin: 10px; }

.red{ color: #d2343e/*#c0667a*/ !important;}
.yew{ color: #946700  !important; }
.green {color: #6AB950!important; }
.bl {color: #0072d0!important; }
.pink {color: #bf0000!important; }
.purple{color:#6f5ea2!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; line-height: 2.5rem; }
.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;}
.font25{ font-size: 2.5rem; line-height: 3.2rem;}
.font30{ font-size: 3rem; line-height: 4rem;}

.underline {background:linear-gradient(transparent 70%, #FFFF00 0%); }
.underline_red {background:linear-gradient(transparent 70%, #f28f95 0%); }
.underline02 {
    background: linear-gradient(transparent 35%, #ffdc00 35%);
    font-weight: bold;
    border-radius: 6px;
}
.underline03{ border-bottom: #3c3c3c 2px solid ; padding-bottom: 10px; display: inline-block; }
.bg_border{ /*background-color: #ddd;*/ border: #74bd58 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; }

.mb-10{ margin-bottom: 1rem; }
.mb-20{ margin-bottom: 2rem; }
.mt-20{ margin-top: 2rem; }
.mt-30{ margin-top: 3rem; }
.mt-50{ margin-top: 5rem; }
.mt-100{ margin-top: 10rem; }
.pt-50{ padding-top: 5rem; }
.pt-100{ padding-top: 10rem; }
.pb-20{ padding-bottom: 2rem; }
.mt--20{ margin-top: -2rem; }

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






/*=================================================
header + MV
===========================*/
#he_line{ background: #000; height: 35px; width: 100%;}
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: #7ac262;}

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(122, 194, 99, 1); 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: #000; width: 100%; height: 100%; display: table-cell; width: 11.42857%; height: 80px; vertical-align: middle; margin: 0; padding: 0; overflow: hidden; font-size: 1rem}
#navarea nav ul li.logoli , #navarea nav ul li.logoli a{ width: 20%; }
#navarea nav ul li.logoli a img{ width: 100%; padding: 0 10%; }/*width: 75%;*/

#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: rgb(107 150 93 / 100%); }
#navarea nav ul li span{ display: block; font-size: .55rem; color: #ecffe7; text-transform: uppercase;}





/*=================================================
TOP
===========================*/
/*TOP-MV*/
/*スマホ*/
@media (max-width: 767.98px) {
    #top-mv{ position: relative; }
    #movie_sp_wrap { position: relative;}
    #movie { position: relative;}
    #movie:before { position: absolute; content: ""; height: 100%; width: 100%; background: url(images/mv_sp_bk02.png) bottom left repeat-x;  }
    #movie_sp_wrap h2{ position: absolute; bottom: -4.5rem; left:20px; font-size: 1.5rem; font-weight: bold; line-height: 2.5rem; }
    #top-mv_txt p { font-size: 1.2rem; line-height: 2rem; font-weight: bold; }
    #top-mv_txt p.top-mv_txt1{ padding-top: 6rem;  }
    #top-mv_txt p.top-mv_txt2{ /*font-size: 1rem; line-height: 1.5rem;*/ }
     #top-mv_cap{ background: rgb(230,243,226); background: linear-gradient(0deg, rgba(230,243,226,1) 0%, rgba(255,255,255,1) 100%);}
     #top-mv_img{ margin-top: 4rem; }
     #top-mv_cap img{ width: 100%; height: auto; }
}



@media (max-width: 375px) {
    #movie_sp_wrap h2{ font-size: 1.2rem; }
     #top-mv_txt p.top-mv_txt1{ font-size: 1rem; }
    #top-mv_txt p.top-mv_txt2{ font-size: 1rem; }
}

/*PC + タブレット*/
@media (min-width: 768px) {
    #top-mv{ margin-top: 0; position: relative; }
    #movie { position: relative; display: inline-block; width: 80%;}
    #movie video{  }
    #movie:before { position: absolute; content: ""; height: 100%; width: 100%; background: url(images/mv_sp_bk.png) top right repeat-y;  }
    #top-mv_txt h2{ font-size: 2rem; padding: 1rem 0; font-weight: bold; }
    #top-mv_txt p { font-size: 1rem; line-height: 2rem; font-weight: bold;}
    #top-mv_txt p.top-mv_txt2{ font-size: 1rem; line-height: 2rem; }

    #top-mv_cap{ position: absolute; top: 3rem; right: 0; }
    #top-mv_cap .col-md-12{ text-align: right;}
    #top-mv_cap #top-mv_txt{ display: inline-block;}
    #top-mv_img{ width: 30%; margin-left: 70%;}
    #top-mv_cap img{ width: 40%; height: auto;  margin-right: 1rem; }
}
@media (min-width: 992px) {
    #top-mv{ margin-top: 5rem; position: relative; }
    #top-mv_img{ width: 40%; margin-left: 55%;}
    #top-mv_txt p { font-size: 1.5rem; line-height: 2rem; font-weight: bold;}
    #top-mv_txt p.top-mv_txt2{ font-size: 1.4rem; line-height: 2rem; }
}
@media (min-width: 1200px) {
    #movie { width: 80%;}
    #top-mv_txt h2{ font-size: 2.8rem; padding: 1rem 0;}
    #top-mv_txt p { font-size: 2rem; line-height: 3rem;}
    #top-mv_txt p.top-mv_txt2{ font-size: 1.4rem; line-height: 2rem; }
    #top-mv_cap img{ width: 30%;  }
}

#feature1 .feature_box{ margin-top: -2rem; }



/*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; }
#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{}
}


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: #e2777e; box-shadow: 3px 3px 0 #ccc; padding: 10px 50px; color: #fff;}
.more_btn a:hover{ color: #fff; background: #77C260; text-decoration: none; }

.more_btn2 a{ display: inline-block; padding: 10px 50px; color: #77C260; border: 1px solid #77C260; }
.more_btn2 a:hover{ color: #fff; background: #77C260; text-decoration: none; }


/*特徴*/
#feature .num{ font-size: 1.1rem; color: #77C260; }
#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; background: #99cc8a; }*/

#feature #feature1 .num , #feature #feature2 .num , #feature #feature3 .num { /*margin-bottom: 1rem; padding-bottom: 1rem;*/ background: #1b1b1b; color: #fff; display: inline-block; box-shadow: 7px 7px 1px #89a580;}



/*新着*/
#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: #77C260; 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:-50px; left:10px; background: #77C260; padding: 5px 10px;  z-index: 10;}
#voice .location{ font-size: .85rem; }
#voice .chtxt{ background-color: rgba(77, 77, 77, 0.78); 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;}
    #feature #feature2 .num{ position: absolute; top: -2rem; }

    #newspost .cat_label { width: 15%; text-align: center; margin-right: 2rem; }
}
@media (max-width: 575.98px) {
    #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 h2 .font20{ font-size: 1.6rem; }
    #feature #feature1 p{ padding-right: 35%; }
    #feature #feature2 p{ padding-left: 45%; }
    #feature .more_btn2 a{ display: block; padding: 10px 0; width: 100%; font-size: .8rem; background: #fff;}

    #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: #77C260; box-shadow: 3px 3px 0 #ccc; padding: 10px 50px; color: #fff;}
.more_btn a:hover{ color: #fff; background: #b5dc39 /*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 #77C260; line-height: 6rem; }



/*=================================================
footer
===========================*/
#footer{ background-color: #f5f5f5; padding: 30px 0 0; margin-top: 150px; 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: #64a150;  }
#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; }
}


/*=================================================
サービス
===========================*/
.ser_ttl{ font-size: 1.2rem; font-weight: bold; color: #fff; background-color: #7ac262 ; padding: 1rem; text-align: center;}

#service h4{font-size: 1rem; font-weight: bold; margin: 2rem 0 0 0; padding-bottom: 0;}

#service table {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
}




#service table th {
    padding: 2%;
    background: #edfbe9;
    border: 1px solid #dcdcdc;
    text-align: left;
    color: #000;
    font-weight: normal;
    vertical-align: middle;
    text-align: center;

}
#service table th.bg_none { background-color: #ccc;}
#service table.first th{ width: 25%; }
#service table.second th{ width: 33.33333%; }

#service table td {
    padding: 2%;
    border: 1px solid #dcdcdc;
    vertical-align: middle;
    text-align: center;
}

.free{ font-size: 2rem; font-weight: bold; color: #bf0000; }
.free .num{ font-size: 3rem; }






@media (max-width: 767.98px){

}
@media (max-width: 575.98px) {
    #service table th {font-size: .8rem;}
}



/*よくある質問*/
#page.faq dl{ border-bottom: 1px solid #000; }
#page.faq dt span.qu {color: #77C260; 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: #77C260; }
#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 #77C260; border-bottom: 1px solid #77C260; }
#page.contact .box{ background: #77C260; color: #fff; border-radius: 2px; }
#page.contact .box2 li{ list-style: disc; margin-left: 1rem; }
#page.contact .bor{ border: 10px solid #c3e3ba; 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;}
.sosin{ background: #77C260; border: none; }



.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; border: none;}
.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; }
    .mw_wp_form{ padding:.5rem 4rem; }
    .tel_size{ width: 50%; }

}
@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; }
    .mw_wp_form{ padding:.5rem; }
    .tel_size{ width: 90%; }
}



/*=================================================
新着情報
===========================*/
.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: #77C260; border-color:#77C260; 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: #77C260; 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: #77C260; padding: 5px 20px; color:#fff; border-radius: 2px }

.item span{ background-color: #77C260; 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: #77C260; 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; }




/*=================================================
利用規約 + 特定商取引
===========================*/
h2.page_ttl{ font-size: 1.2rem; font-weight: bold; border-bottom: 1px solid #000; padding-bottom: .5rem; margin-bottom: 2rem; }

#termsofuse ol { padding:0; marks: 0;}
#termsofuse ol li {list-style: none;padding-left: 1.3em; text-indent: -1.3em;}

#termsofuse ol li span { padding-right: 5px; }
#termsofuse  table{ width: auto; margin:  auto; }
#termsofuse table th, #termsofuse table td {
    padding: 10px;
    border: #c8c8c8 1px solid;
}

#mailimg{ max-width: 100%; width: 200px; }

#termsofuse a , #low a{ color: #77C260; text-decoration:underline; }
#termsofuse a:hover , #low a:hover{ text-decoration: none; }


/*=================================================
タイトルセット
===========================*/
.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: #77C260; 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;  width: 90%; padding: 1.3rem .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;
}