/*!
 * Product Common Css file for 'www.aiphone.net'
 */
 @charset "utf-8";



/* content block
-------------------------------------- */
/* content block End
-------------------------------*/


/* brochure block
-------------------------------------- */
div.brochure-area{margin-top:0;}
div.brochure-area a{color:unset;color:auto;}
div.brochure-area img{width:50%; max-width:8rem; border:solid #dddddd 1px;}
div.brochure-area h5{display:inline;}
/* brochure block End
-------------------------------*/


/* Card block (Product List) (Bootstrap Customize)
-------------------------------------- */
/* For IE9 */

.menu-list-products .row:after{display: block; clear: both; content: "";}

.menu-list-products .row > .col-md-3.col-sm-6 {margin-bottom:20px;}
.menu-list-products .row > .col-md-3.col-sm-6 > a {color:inherit; font-weight:500;}
.menu-list-products .row > .col-md-3.col-sm-6 > a .card-link {color:inherit; font-weight:700;}
.menu-list-products .row > .col-md-3.col-sm-6 > a:hover {text-decoration:none;}
.menu-list-products .card{transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;}
.menu-list-products .card .card-imgbox{ text-align:center; padding:1rem 1rem 0;}
.menu-list-products .card .card-body{ padding:1rem;}
.menu-list-products .card .card-imgbox > img{ margin:0 auto;}
.menu-list-products .card .card-body .card-title{ font-size:1.2rem;}
.menu-list-products .card .card-body .card-text{font-size:0.9rem;}
.menu-list-products .card .card-body .card-desc{font-size:0.9rem; color:#888;}
.components-list .card .card-body .card-desc,.menu-list-products .card .card-body .card-title,.menu-list-products .card .card-body .card-text,.menu-list-products .card .card-body .card-img{ margin-bottom:0.5rem;}
.menu-list-products .card:hover .card-body .card-link{text-decoration:underline;}
.menu-list-products .card:hover{border:1px solid rgba(0,0,0,.255);}
.card-deck a, .card-deck a:hover {color:inherit}
@media (min-width: 576px) {
}
@media (min-width: 640px) {
    .menu-list-products .card .card-imgbox{ padding:1rem;}
    .menu-list-products .card .card-body{ padding:1rem;}
}
@media (min-width: 768px) {
}
@media (min-width: 992px) {
}
@media (min-width: 1200px) {
}


/* Card block (Components List) (Bootstrap Customize)
-------------------------------------- */

.components-list .row:after{display: block; clear: both; content: "";}
.components-list .row > .col-sm-6 {margin-bottom:20px;}


.components-list .card .card-imgbox{ text-align:center; padding:1rem 1rem 0;}
.components-list .card .card-body{ padding:1rem;}
.components-list .card .card-imgbox > img{ margin:0 auto; max-width:80%;}
.components-list .card .card-body .card-title{ font-size:1.2rem;}
.components-list .card .card-body .card-text{font-size:0.9rem;}
.components-list .card .card-body .card-desc{font-size:0.9rem; color:#888;}
.components-list .card .card-body .card-desc p{margin-bottom:0;}
.components-list .card .card-body .card-desc,.components-list .card .card-body .card-title,.components-list .card .card-body .card-text,.menu-list-products .card .card-body .card-img{ margin-bottom:0.5rem;}
.components-list .card:hover .card-body .card-link{text-decoration:underline;}
.card-deck a, .card-deck a:hover {color:inherit}
@media (min-width: 576px) {
    
}
@media (min-width: 640px) {
    .components-list .card .card-imgbox{ padding:1rem;}
    .components-list .card .card-body{ padding:1rem;}
}
@media (min-width: 768px) {
}
@media (min-width: 992px) {
}
@media (min-width: 1200px) {
}






/* Article List START
-------------------------------------- */
/* .menu-list-products.article-list > a > div > div >  */
.article-list > a > div > div > div.article-list-imgbox:before{width:100%; height:100%;content:''; display:block; padding-top: 100%;}
.article-list > a > div > div > div.article-list-imgbox{background-repeat:no-repeat; background-size:cover; background-position:center; width:100%; height:100%; background-color:rgba(255,255,255,0); transition:background-color .2s ease-out;}

.article-list > a {border:1px solid rgba(0,0,0,.2); display:block; border-radius:.25rem; text-decoration: none;}
.article-list > a:hover {border:1px solid rgba(0,0,0,.5); display:block;}
.article-list > a:hover > div > div > div.article-list-imgbox{background-color:rgba(255,255,255,0.2);background-blend-mode:lighten;  }

.article-list > a > div > div.article-list-text{padding:1rem 1.5rem 1.5rem;}
.article-list > a > div > div.article-list-text .article-list-text_title{font-size:1.3rem; font-weight:500;}
.article-list > a:hover > div > div.article-list-text .article-list-text_title{text-decoration:underline;}
.article-list > a > div > div.article-list-text .article-list-text_category{font-size:.8rem; font-weight:300; margin-bottom:0;}
.article-list > a:hover > div > div.article-list-text .article-list-text_category{text-decoration:none;}
/*
.menu-list-products.article-list div.row .col-md-6:after{ position: relative; display: inline; speak: none; font-family: 'Icons'; font-style: normal; font-weight: normal; content: 'MORE \e02f'; white-space:nowrap; vertical-align:middle; line-height:0; font-size: .8em; margin: 0; top:-2.0rem; left:calc(100% - 5em); color:#777; }
*/
.menu-list-products.article-list div.row .col-md-6:after{ position: relative; display: inline; speak: none; font-family: 'Icons'; font-style: normal; font-weight: 600; letter-spacing: .08em; content: 'READ MORE \e02f'; white-space: nowrap; vertical-align: middle; line-height: 0; font-size: .8em; margin: 0; top: -2.3rem; left: calc(100% - 9.2em); color: #666;}





.menu-list-products.article-list div.row .col-md-6:hover:after{color:#000;}

@media (min-width: 576px) {
    .article-list > a > div > div.article-list-text .article-list-text_title{font-size:1rem; font-weight:500;}
}
@media (min-width: 640px) {
}
@media (min-width: 768px) {
    .article-list > a > div > div.article-list-text{padding:1.2rem 1.2rem 1.2rem .8rem; }
}
@media (min-width: 992px) {
    .article-list > a > div > div.article-list-text{padding:1.2rem 1.8rem 1.2rem .8rem; }
    .article-list > a > div > div.article-list-text .article-list-text_title{font-size:1.2rem; }
}
@media (min-width: 1200px) {
}

/* Article List END
-------------------------------*/