@charset "utf-8";
/*===============================================
 *	Example_list
===============================================*/
@media only screen and (max-width: 568px) {
#second-visualcontents {height: 130px;}
}

/*-----------------------------------------------
 *	一覧
-----------------------------------------------*/
.ttl-main_voice{max-width: 810px;margin: 0 auto;}
.voice-box{display: flex;justify-content:space-between;flex-wrap: wrap;}
.voice-box figure{line-height: 0;}
.voice-box .article {background: #fff;border: #346bb6 2px solid;max-width: 310px;box-shadow: 0 0 10px rgba(0,0,0,.3);margin-bottom: 2vw;display: flex;flex-direction: column;position: relative;}
.voice-box .article::before, .voice-box .article::after {content: '';width: 30px;height: 30px;position: absolute;}
.voice-box .article::before {border-left: solid 6px #346bb6;border-top: solid 6px #346bb6;top: 0;left: 0;}
.voice-box .article::after {border-right: solid 6px #346bb6;border-bottom: solid 6px #346bb6;bottom: 0;right: 0;}
@media all and (-ms-high-contrast: none) {
.voice-box .article {display: block;}
}
.voice-box .article-info{padding: .5em 1em 0;}
.voice-box .article-ttl{font-size: 16px;font-weight: bold;margin-bottom: 2em;padding-top: .5em;position: relative;text-align: center;}
.voice-box .article-ttl:after {content: "";position: absolute;left: 0;bottom: -10px;width: 100%;height: 4px;background: -webkit-repeating-linear-gradient(-45deg, #346bb6, #346bb6 2px, #fff 2px, #fff 4px);background: repeating-linear-gradient(-45deg, #346bb6, #346bb6 2px, #fff 2px, #fff 4px);}
.voice-box .article img {object-fit: cover;height: 150px;overflow: hidden;}
.voice-box p{margin-bottom: 1em;}
.articleBtn{display: block;background: #fff;color: #346bb6;margin: auto 1em 1em auto;border: #346bb6 2px solid;padding: 10px 0;text-align: center;width: 150px;}
.articleBtn:hover{background: #346bb6;color: #fff;}
@media only screen and (max-width: 768px) {
.ttl-main_voice {margin: 0 3%;}
}
@media only screen and (max-width: 568px) {
.voice-box .article {max-width: inherit;margin-bottom: 6vw;width: 100%;}
.voice-box figure {line-height: 0;margin: 10px 0 0;width: 100%;}
.voice-box .article-ttl {font-size: 15px;}
.articleBtn {margin: 0 auto 1em;width: 70%;}
}
@media only screen and (max-width: 320px) {
.voice-box .article-ttl {font-size: 13px;}
.articleBtn {padding: 5px 0;}
}
/*-----------------------------------------------
 *	詳細
-----------------------------------------------*/
.pic {display: table;float: right;width: 270px;margin: 0 0 25px 25px;height: 272px;border: 1px solid #dcdcdc;box-shadow: 0 0 0 4px #fff inset;background: #eee;box-sizing: border-box;text-align: center;}
.pic a {display: table-cell;position: relative;height: 100%;padding: 10px 20px;vertical-align: middle;}
.pic a:after {position: absolute;bottom: -1px;right: -1px;width: 30px;height: 30px;background: url(../img/icon-glass.png) no-repeat;content: '';}
.price-box{position: relative;background: linear-gradient(-45deg,#fff 25%, #fbc6cc 25%,#fbc6cc 50%, #fff 50%,#fff 75%, #fbc6cc 75%,#d8e0ff);background-size: 8px 8px;padding: 8px;}
.price-inbox {background: #FFF;padding: .5em;text-align: center;}
.price-ttl {color: #f34f61;margin: 0 0 .5em;font-size: 20px;font-weight: bold;display: inline;padding-right: 1em;}
.price-ttl em{color: #f39801;font-size: 40px;font-weight: bold;}
.detail-txt{margin-bottom: 1em;}
.detail-txt p{margin-bottom: 1em;}
.detail-txt strong {font-weight: bold;}
.post_under_nav {color: #fff;background: #346bb6;margin: 0 0 15px;}
.post_under_nav ul {display: table;width: 100%;table-layout: fixed;}
.post_under_nav li {display: table-cell;text-align: center;}
.post_under_nav li span, .post_under_nav li a {display: block;padding: 15px;color: #fff;}
.post_under_nav li a:hover {background: rgba(255, 255, 255, 0.3);}
.post_under_nav .nav-left {text-align: left;}
.post_under_nav .nav-center {text-align: center;border-right: 1px solid rgba(255, 255, 255, 0.3);border-left: 1px solid rgba(255, 255, 255, 0.3);}
@media only screen and (max-width: 568px) {
.pic {width: 160px;margin: 0 0 10px 10px;height: initial;}
.pic a {padding: 10px;}
.price-ttl {font-size: 18px;}
.price-ttl em {font-size: 28px;}
}


