
/* =======================================================
*
* 	フレックスボックス使用のCSS
*	custom02
*
* ======================================================= */


.width100{width:100%;}

/* ===　business工場案内保留中　=== */

.photo_area{
width:100%;
    display: flex;              /* フレックスボックスにする */
    align-items:stretch;        /* 縦の位置指定 */
    justify-content:space-between;        /* 横の位置指定 */
    flex-wrap:wrap;
margin-bottom:30px;
}

.photo_area .photobox01{width:66%;}

.photo_area .photobox02{width:30%;
    display: flex;              /* フレックスボックスにする */
    align-items:stretch;        /* 縦の位置指定 */
    justify-content:space-between;        /* 横の位置指定 */
    align-content:space-between;        /* 折り返し後の揃え */
    flex-wrap:wrap;

}

.photo_area figure{margin-bottom:0;}
.photo_area figure figcaption,
.equipment_box figure figcaption{font-size:80%;font-style: italic;text-align:right;padding-right:10px; }
.photo_area img {width:100%;width:auto;}


/* ===　　product 製品案内　=== */

.product_category{width:100%;border:0px solid;margin-bottom:20px;border-bottom:0px solid ;}
.product_category h3{display:inline;}

.product_box{
width:100%;
    display: flex;              /* フレックスボックスにする */
    align-items:stretch;        /* 縦の位置指定 */
    justify-content:space-between;        /* 横の位置指定 */
    flex-wrap:wrap;
margin-bottom:40px;
}

.product_box_after{
width:100%;
    display: flex;              /* フレックスボックスにする */
    align-items:stretch;        /* 縦の位置指定 */
    justify-content:space-between;        /* 横の位置指定 */
    flex-wrap:wrap;
margin-bottom:40px;
}
.product_box_after::after {
display: block;
content:"";
width:31.5%;
}

.product_box p,product_box_after p,
.product_box h3,.product_box_after h3{  font-family: Arial, sans-serif;}

.product_box h3 i,.product_box_after h3 i{margin-right:5px;color:#666;}

.product_card{background:#fff;
width:31.5%;
margin-bottom:40px;
    display: flex;              /* フレックスボックスにする */
    align-items:stretch;        /* 縦の位置指定 */
    justify-content:space-between;        /* 横の位置指定 */
    align-content:space-between;        /* 折り返し後の揃え */
    flex-wrap:wrap;
}

.product_card img{
width:100%;margin-bottom:10px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  border-radius: 5px;
}

.product_card .card_text{
width:100%;
    display: flex;              /* フレックスボックスにする */
    align-items:sflex-start;        /* 縦の位置指定 */
    justify-content:flex-start;        /* 横の位置指定 */
    align-content:flex-start;        /* 折り返し後の揃え */
    flex-wrap:wrap;
}

.product_card .card_text h3{margin-bottom:10px;font-weight:600;color:#6699cc;}
.product_card .card_text p{font-size:100%;line-height:1.6;margin-bottom:10px;}

@media screen and (max-width: 768px) {
.product_card{width:100%; }
.product_card .card_text h3{margin-bottom:10px;font-size:140%;}
}




/* ===　製品情報「さらに詳しく」ボタン　　=== */
.btn_detail{width:100%;text-align:right;}


/* ===　contact お問合せ　　=== */

.phone_container{
width:100%;
    display: flex;              /* フレックスボックスにする */
    align-items:sflex-start;        /* 縦の位置指定 */
    justify-content:center;        /* 横の位置指定 */
    align-content:flex-start;        /* 折り返し後の揃え */
    flex-wrap:wrap;
}

.phone_container p.time{width:60%;text-align:right;}
.phone_container p.time span{font-size:90%;}

.phone_table{border-top:1px solid #848484;
width:60%;
}
.phone_table th{
padding:20px 15px;
background:#848484;
color:#fff;
border-bottom:1px solid #fff;
text-align:center;
font-weight:normal;
}
.phone_table td{
padding:20px;
background:#fff;
text-align:center;
border-bottom:1px solid #848484;border-right:1px solid #848484;
font-weight:bold;font-size:150%;
}


@media screen and (max-width: 768px) {
.phone_table{width:100%;}
.phone_container p.time{width:100%;text-align:left;}
.phone_table th{padding:15px 10px;}
.phone_table td{padding:15px 10px;}
}


/* ===　　　=== */

form#mailform {

}

.mailform_container{border:0px solid;
width:100%;
    display: flex;              /* フレックスボックスにする */
    align-items:sflex-start;        /* 縦の位置指定 */
    justify-content:center;        /* 横の位置指定 */
    align-content:flex-start;        /* 折り返し後の揃え */
    flex-wrap:wrap;
}

.mailform_table {border:1px solid #848484;

}



.mailform_table th{
padding:20px 20px;
background:#848484;
color:#fff;
border-bottom:1px solid #fff;
text-align:center;
font-weight:normal;
}
.mailform_table td{
padding:20px;
background:#fff;
text-align:left;
border-bottom:1px solid #848484;
}
.mailform_table td.form_btn{text-align:right;padding-top:30px;;}
.mailform_table td.form_btn span{width:30px;}

.form_name,
.form_phone,
.form_mail1,
.form_mail2,
.form_textarea{width:100%;}

@media screen and (max-width: 768px) {
.mailform_table {border:none;}
.mailform_table tr {
width:100%;
    display: flex;              /* フレックスボックスにする */
    align-items:sflex-start;        /* 縦の位置指定 */
    justify-content:center;        /* 横の位置指定 */
    align-content:flex-start;        /* 折り返し後の揃え */
    flex-wrap:wrap;
}
.mailform_table th{padding:10px 0 0;width:100%;background:transparent;text-align:left;color:#666;border:none;}
.mailform_table td{padding:10px 0;width:100%;background:transparent;border:none;}
.mailform_table td.form_btn{text-align:center;background:transparent;}
}

/* ===　　　=== */

