@charset "utf-8";

#mainContents .p_catalogbox p a {font-size: 12px;line-height: 30px;}
#mainContents .p_catalogbox {width: 260px;margin: 0 0 20px auto;}
.productLook_strength {margin: 15px 0;width: 100%;padding: 10px;}

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
Micro Mistシリーズ TOP
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/

.flex-block {display: flex;justify-content: space-between;width: 100%;}
#mmseries-top {padding: 25px 0 30px 0}
#mmseries-top h2 {font-size:21px;padding-bottom: 5px;color: #333333;margin-bottom: 15px;font-weight: normal;}
#mmseries-top dl {border: 1px solid #ccc;width:49%;box-sizing: border-box;}
#mmseries-top dl dt {background-color: #efefef;box-sizing: border-box;display: flex;}
#mmseries-top dl dt .product-title{display: flex;align-items: center;}
#mmseries-top dl dt h3 {font-size: 18px;line-height: 1.3;padding:0 10px 0 0;border-left:0px;padding: 20px 0px 20px 20px;margin-top: 0px;margin-bottom: 0px;}
#mmseries-top dl dt img{height: 86px;padding: 5px 32px;}
#mmseries-top dl a:hover img{opacity: 0.6}
#mmseries-top dl a:hover h3{color:#c01443}
#mmseries-top dl a span::before {content:"";left: -3px;top:20px;width: 7px;height: 7px;border-top: 2px solid #c01443;border-right: 2px solid #c01443;-webkit-transform: rotate(45deg);transform: rotate(45deg);position: absolute;}
#mmseries-top dl dd {padding: 10px;box-sizing: border-box;}
#mmseries-top dl dd a {font-size: 15px;display: block;line-height: 1.3;}
#mmseries-top dl dd a:hover {text-decoration: underline;color:#c01443}
#mmseries-top dl dd table {margin: 0 auto;}
#mmseries-top dl dd table tr{height:50px;vertical-align: middle;}
#mmseries-top dl dd table tr td {width: 55%;padding: 0 15px;vertical-align: middle;position: relative;text-align: left;box-sizing: border-box;}

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
モーダル
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/

/* モーダル ボタン*/
.l-product-f{margin-bottom: 30px;display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-webkit-justify-content: space-between;-ms-flex-pack: justify;justify-content: space-between;-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;flex-wrap: wrap;}
.l-product-f::after{content: "";display: inline-block;width:31.5%}
.l-product-f-box{width: 31.5%;border-top: 5px solid #efefef;border-right: 1px solid #efefef;border-left: 1px solid #efefef;border-bottom: 1px solid #efefef;margin-bottom: 30px}
.l-product-f-box-inner{box-sizing: border-box;padding: 10px}
.m-product-smn{width: 100%;border-bottom: 1px solid #efefef;cursor: pointer;transition: 0.3s;box-sizing: border-box;background-color: #000000;display: inline-block;overflow: hidden;}
.m-product-smn img{width: 100%;transition: 0.3s;}
.m-product-smn img:hover{opacity: 0.9;transform: scale(1.1);}
.m-product-about{height: 35px;display: block;}
.m-product-about:hover{text-decoration: underline;}
.m-product-type{color: #0348a6; font-size: 12px;display: block;margin-bottom: 10px}
.m-product-name{font-size: 15px;font-weight: bold;line-height: 1.2;display: block;margin: 0 0 10px 0;border: none;color: #000;}
.m-product-size{font-size: 11px;display: block;margin-bottom: 10px;height: 70px;}
.btn-product-about{font-size: 14px;box-sizing: border-box;margin-right: 10px;padding: 5px 8px;background-color: #efefef;border: 1px solid #ddd;cursor: pointer;transition: 0.3s;display: inline-block;}
.btn-product-about:hover{opacity: 0.7}
.btn-product-pdf{font-size: 14px;padding: 5px;margin: 0 5px;box-sizing: border-box;cursor: pointer;transition: 0.3s;display: inline-block;text-decoration: underline;position: relative;}
.btn-product-pdf:hover{opacity: 0.7;text-decoration: none;}
.btn-product-movie{font-size: 14px;padding: 5px 4px;box-sizing: border-box;cursor: pointer;transition: 0.3s;display: inline-block;text-decoration: underline;position: relative;}
.btn-product-movie:hover{opacity: 0.7;text-decoration: none;}
.btn-product-pdf::before, .btn-product-movie::before {content: url(/images/triangle.gif);position: absolute;left: -5px;display: inline-block;padding: 4px 0;}

@media screen and (max-width: 768px) {
  .l-product-f::after{width:48%}
  .l-product-f-box{width: 48%;}
  .btn-product-pdf::before, .btn-product-movie::before {padding: 8px 0;}
}

@media screen and (max-width: 550px) {
  .l-product-f{margin-bottom: 40px}
  .l-product-f-box{align-items: flex-start;align-items: center;display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-webkit-justify-content: space-between;-ms-flex-pack: justify;justify-content: space-between;-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;flex-wrap: wrap;}
  .l-product-f::after{content: none;}
  .l-product-f-box{width: 100%;margin-bottom: 5px;border-top: 1px solid #efefef;}
  .m-product-smn{width: 35%;border-bottom: none;background-color: #FFF}
  .l-product-f-box-inner{width: 65%;}
  .m-product-about{height: auto;}
}

/*モーダル 仕組み*/
body.is-modal-active {overflow: hidden;position:fixed;width: 100%;left:0;}/*背景スクロール防止*/
.modal {position: fixed;width:100%;height:100%;top:0;left:0;display:none;z-index:200;}
.overLay {position:absolute;top:0;left:0;background:rgba(0,0,0,0.8);width:100%;height:100%;z-index:300;}
.modal__inner {position:fixed;width: 80%;max-width: 980px;max-height: 100vh;z-index:400;margin-top:80px;margin-left: 50%;transform: translateX(-50%);top:0;left:0;overflow-y: auto;-ms-overflow-style: none;scrollbar-width: none;}
.modal__inner::-webkit-scrollbar {display: none;}
.modal__inner::after{content: "";display: inline-block;height: 200px}
.l-modalClose{display: inline-block;position: fixed;z-index:  500;margin-top: 80px;right:10%;text-align: right;transform: translateX(150%)}
.l-modalClose img{cursor: pointer;transition: 0.3s}
.l-modalClose img:hover{opacity: 0.7}
.l-modalClose-pc{position: relative;width: 100%;background-color: #4a4a4a;color: #FFF ;background-color: #FFF;text-align: center;}
.l-modalClose-pc p {background-color: #4a4a4a;display: inline-block;box-sizing: border-box;padding: 15px 0;width: 50%;max-width: 250px;margin: 20px auto 40px auto;cursor: pointer;transition: 0.3s}
.l-modalClose-pc p:hover {opacity: 0.7}
.modal__inner-footer{height: 200px}
@media only screen and (max-width: 768px){
  .l-modalClose-sp{position: relative;width: 100%;max-width: 400px;margin: 40px auto 0 auto;background-color: #4a4a4a;color: #FFF;text-align: center;}
  .l-modalClose-sp p{margin: 0 ;padding: 15px;font-weight: normal;;font-size: 17px;}
  .l-modalClose{margin-top: 60px;transform: translateX(0%);right:5%}
  .modal__inner {margin-top:100px;width: 90%;}
}
@media only screen and (max-width: 480px){
  .l-modalClose{margin-top: 13%}
}

/*モーダル 中身*/
.modal__inner article{padding: 50px 25px;box-sizing: border-box;background-color: #FFFFFF;}
.modal__inner article h1{border-left: 5px solid #c01443;font-size: 20px;font-weight: bold;padding-left: 15px;box-sizing: border-box;margin-bottom:10px;}
.modal__inner article .btn-prodct-contact{border: 1px solid #ffe78a;background-color: #ffe78a;display: block;max-width: 500px;width: 100%;padding: 10px;text-align: center;margin: 0 auto;font-weight: bold;box-sizing: border-box;}
.modal__inner article .btn-prodct-contact:hover{color: #000;border: 1px solid #bf1544;opacity: 0.7}
.modal__inner article .btn-prodct-contact-min{font-size: 12px;border: 1px solid #ffe78a;background-color: #ffe78a;display: block;padding: 3px;text-align: center;margin: 0 0 40px auto;font-weight: normal;box-sizing: border-box;width: 170px}
.modal__inner article .btn-prodct-contact-min:hover{color: #000;border: 1px solid #bf1544;opacity: 0.7}
.modal__inner article .modal__inner-flex{margin-bottom: 50px;display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-webkit-justify-content: space-between;-ms-flex-pack: justify;justify-content: space-between;-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;flex-wrap: wrap;}
.modal__inner article .modal__inner-flex-left{width: 40%}
.modal__inner article .modal__inner-flex-left img{width: 100%}
.modal__inner article .modal__inner-flex-right{width: 60%}
.modal__inner-table{border-top: 1px solid #dddddd;border-left: 1px solid #dddddd;border-right: 1px solid #dddddd;box-sizing: border-box;border-collapse: collapse;border-spacing: 0;font-size: 14px;display:block;width: 100%}
.modal__inner-table tr{border-bottom: 1px solid #dddddd;}
.modal__inner-table tr th{border-right: 1px solid #dddddd;background-color: #efefef;padding: 10px 10px 10px 10px;font-weight: normal;font-size: 12px;}
.modal__inner-table tr td{padding: 10px 15px 10px 15px;}
.modal__inner-table ul li{margin: 10px 0;line-height: 1.2;padding-left: 1em;text-indent: -1em;}
.modal__inner-table-about tr th{width: 100px}
.thtd100,.thtd50,.thtd33{margin-top: 30px}
.thtd100 tbody, .thtd100 tr, .thtd100 th, .thtd100 td{display: block;width: 100%;box-sizing: border-box;text-align: center;}
.thtd50 tbody, .thtd50 tr{display: block;width: 100%;box-sizing: border-box;text-align: center;}
.thtd50 tr:first-child{background-color: #efefef;}
.thtd50 th, .thtd50 td{display: inline-block;width: 50%;box-sizing: border-box;text-align: center;}
.thtd50 th, .thtd50 td{border-right: 1px solid #dddddd;}
.thtd50 th:last-child, .thtd50 td:last-child{border-right: none;}

@media only screen and (max-width: 768px){
  .modal__inner article{padding: 50px 20px;}
  .modal__inner article .modal__inner-flex-left{width: 100%;margin-bottom: 40px}
  .modal__inner article .modal__inner-flex-right{width: 100%}
}

/*モーダル 中身 youtube*/
.modal__inner_youtube_16-9{position:relative;width:100%;height:0;padding-top:56.25%;}
.modal__inner_youtube_16-9 iframe{position:absolute;top:0;left:0;width:100%;height:100%;}
.modal__inner_youtube_4-3{position:relative;width:80%;height:0;padding-top:75%;}
.modal__inner_youtube_4-3 iframe{position:absolute;top:0;left:0;width:100%;height:100%;}