@charset "UTF-8";

/*---------------------------------
voice_style
---------------------------------*/
#asp_content .asp_voice_sub_title{text-align:left;border-bottom:1px solid #ddd;}
#asp_content .asp_voice_sub_title h2{font-size:20px;line-height:1.2;font-weight:700;margin-bottom:20px;}

#asp_content .asp_voice_box_wrap{display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin:40px 0 80px;}
#asp_content .asp_voice_box{display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;width:calc((100% - 50px)/3);text-decoration:none;margin:0 25px 25px 0;overflow:hidden;border-radius:8px;color:#000;background-color:#f9f9f9;position:relative;}
#asp_content .asp_voice_box:nth-child(3n){margin-right:0;}
#asp_content .asp_voice_box a{text-decoration:none;color:inherit;}
#asp_content .asp_voice_box .asp_voice_box_vol{display:inline-block;font-size:12px;padding:5px 10px;border-radius:2px 4px 2px 4px; color:#FFF;background-color:rgba(0,0,0,0.6);position:absolute;top:0;right:0;z-index:1;}
#asp_content .asp_voice_box .asp_voice_box_photo{display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:230px;text-align:center;overflow:hidden;}
#asp_content .asp_voice_box .asp_voice_box_photo img{width:100%;height:100%;object-fit:contain;vertical-align:top;}
#asp_content .asp_voice_box .asp_voice_box_photo + .asp_voice_box_body{border-top:1px solid #DDD;}
#asp_content .asp_voice_box .asp_voice_box_body{display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;flex:1;}
#asp_content .asp_voice_box .asp_voice_box_body .asp_voice_box_body_inner{height:100%;padding:15px 20px 15px;}
#asp_content .asp_voice_box .asp_voice_box_body .asp_voice_box_date{font-size:12px;line-height:1.4;text-align:right;color:#888;}
#asp_content .asp_voice_box .asp_voice_box_body .asp_voice_box_icon{display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;}
#asp_content .asp_voice_box .asp_voice_box_body .asp_voice_box_date + .asp_voice_box_icon{margin:2px 0 0;}
#asp_content .asp_voice_box .asp_voice_box_body .asp_voice_box_icon span{display:inline-block;font-size:12px;font-weight:700;margin:2px 3px 2px 0;padding:3px 10px;box-sizing:border-box;border-radius:2px;}
#asp_content .asp_voice_box .asp_voice_box_body .asp_voice_box_icon .asp_voice_box_icon_kind{color:var(--main-color)/*------------------- color -------------------*/;background-color:#FFF;border:1px solid var(--main-color)/*------------------- color -------------------*/;}
#asp_content .asp_voice_box .asp_voice_box_body .asp_voice_box_icon .asp_voice_box_icon_shop{color:#FFF;background-color:var(--main-color)/*------------------- color -------------------*/;border:1px solid var(--main-color)/*------------------- color -------------------*/;}
#asp_content .asp_voice_box .asp_voice_box_body .asp_voice_box_name{font-size:12px;text-align:left;margin:10px 0 0;color:#888;}
#asp_content .asp_voice_box .asp_voice_box_body .asp_voice_box_title{font-size:18px;font-weight:700;line-height:1.4;text-align:left;margin:10px 0 0;overflow:hidden;display:-webkit-box;text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:2;}
#asp_content .asp_voice_box .asp_voice_box_body .asp_voice_box_comment{font-size:13px;line-height:1.9;text-align:left;margin:5px 0 0;overflow:hidden;display:-webkit-box;text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:2;}
#asp_content .asp_voice_box .asp_voice_box_staff{display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;text-align:left;margin:auto 20px 0;padding:15px 0;box-sizing:border-box;border-top:1px solid #DDD;}
#asp_content .asp_voice_box .asp_voice_box_staff .asp_voice_box_staff_name{flex:1;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}
#asp_content .asp_voice_box .asp_voice_box_staff .asp_voice_box_staff_name dt{font-size:12px;padding:5px 10px;box-sizing:border-box;border-radius:2px;border:1px solid #DDD;}
#asp_content .asp_voice_box .asp_voice_box_staff .asp_voice_box_staff_name dd{flex:1;font-size:15px;font-weight:700;padding:0 0 0 10px;color:var(--main-color)/*------------------- color -------------------*/;}
#asp_content .asp_voice_box .asp_voice_box_staff .asp_voice_box_staff_photo{width:50px;height:50px;margin:0 0 0 10px;overflow:hidden;border-radius:100%;}
#asp_content .asp_voice_box .asp_voice_box_staff .asp_voice_box_staff_photo img{width:100%;height:100%;object-fit:cover;}

#asp_content .asp_voice_box{transition:background-color .2s;}
#asp_content .asp_voice_box:hover{background-color:#EEE;}
#asp_content .asp_voice_box .asp_voice_box_photo img{transition:opacity .2s;}
#asp_content .asp_voice_box:hover .asp_voice_box_photo img{opacity:0.6;}

/*---------------------------------
.asp_voice_pagination
---------------------------------*/
#asp_content .asp_voice_numb{font-size:14px;text-align:center;margin:-40px auto 0;}
#asp_content .asp_voice_numb span{font-size:18px;font-weight:700;color:#ea381c;}

#asp_content .asp_voice_pagination{margin: 35px 0;}
#asp_content .asp_voice_pagination ul{font-size:15px;text-align: center;}
#asp_content .asp_voice_pagination li{display:inline;margin:0 2px;padding:0;}
#asp_content .asp_voice_pagination li > span,
#asp_content .asp_voice_pagination li a{text-decoration:none;margin:3px;padding:10px 8px;background:#fff;border:1px solid #aaa;display:inline-block;vertical-align:middle;}
#asp_content .asp_voice_pagination li > span{ color:#fff; background-color:#777;}
#asp_content .asp_voice_pagination li a{ color:#000;}
#asp_content .asp_voice_pagination li a:hover{ background:#eee; border-color: #777;}

/*---------------------------------
#asp_voice_classification
---------------------------------*/
#asp_content #asp_voice_classification{margin:35px 0;padding:30px 30px;box-sizing:border-box;position:relative;min-height:100px;}
#asp_content #asp_voice_classification:before{ content: ''; z-index: 0; position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; background-color: var(--main-color)/*------------------- color -------------------*/; opacity: 0.1;}
#asp_content .classification{position: relative; z-index: 1;}
#asp_content .classification + .classification{margin-top:30px;}
#asp_content .classification .topics_list_title{ text-align: left; font-size:15px; line-height:1.2; font-weight:700; margin-bottom: 10px; color:var(--main-color)/*------------------- color -------------------*/;}
#asp_content .classification ul{ display: flex; justify-content: left; flex-wrap: wrap;}
#asp_content .classification ul li{ margin: 2px 0;}
#asp_content .classification ul li a{ font-size:13px; font-weight:700; line-height:25px; height:25px; display:block; padding:0 8px; box-sizing:border-box; border-radius:2px; margin-right:3px;  text-decoration:none; cursor:pointer; -webkit-transition: .2s; -ms-transition: .2s; transition: .2s;}
#asp_content .classification ul li a:hover{ opacity: 0.6;}
#asp_content #asp_voice_category_list.classification ul li a{background-color:#FFF;color:var(--main-color)/*------------------- color -------------------*/;border:1px solid var(--main-color)/*------------------- color -------------------*/;}
#asp_content #asp_voice_shop_list.classification ul li a{background-color:var(--main-color)/*------------------- color -------------------*/;color:#fff;border:1px solid var(--main-color)/*------------------- color -------------------*/;}