/*! =========================================================
 _compass
========================================================= */
#melfa_contents_1col.compass { width: 100%; }
#melfa_contents_1col.compass #melfa_main_area { width: 100%; }
#melfa_contents_1col.compass .fa-pagetop { width: 980px; margin-left: auto; margin-right: auto; }
#melfa_contents_1col.compass div#content_footer.meganav { width: 980px; margin-left: auto; margin-right: auto; }

@media only screen and (max-width: 768px){
#melfa_contents_1col.compass .fa-pagetop { width: 100%; box-sizing: border-box; }
#melfa_contents_1col.compass div#content_footer.meganav { width: auto; }
}



/*! =========================================================
 _head
========================================================= */
.fa-cmp_head { padding: 20px 0 10px; background: #21262a; }
.fa-cmp_head_inner { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; justify-content: space-between; align-items: flex-end; width: 100%; max-width: 980px; margin: 0 auto; }

.fa-cmp_head_title {}
.fa-cmp_logo { float: left; }
.fa-cmp_logo img { display: inline-block; width: 257px; vertical-align: bottom; }
.fa-cmp_lead { float: left; margin-top: 70px; margin-left: 25px; color: #fff; font-size: 12px; line-height: 1.8; }

.fa-cmp_category_nav { padding-bottom: 15px; }
.fa-cmp_category_nav_list {}
.fa-cmp_category_nav_list li { display: inline-block; white-space: nowrap; }
.fa-cmp_category_nav_list li + li { margin-left: 20px; }
.fa-cmp_category_nav_list li a { display: inline-block; padding-bottom: 10px; color: #fff; border-bottom: 2px solid #21262a; }
.fa-cmp_category_nav_list li a:hover,
.fa-cmp_category_nav_list li a.active,
.fa-cmp_category_nav_list li a.active:hover { border-bottom: 2px solid #ff0000; text-decoration: none; }

@media only screen and (max-width: 768px){
.fa-cmp_head { margin-left: -16px; margin-right: -16px; padding: 16px; }
.fa-cmp_head_inner { display: block; }

.fa-cmp_logo { float: none; text-align: center; }
.fa-cmp_logo img { width: 149px; margin: 0 auto; }
.fa-cmp_lead { float: none; margin-top: 5px; margin-left: 0; text-align: center; }

.fa-cmp_category_nav { margin-top: 8px; padding-bottom: 0; }
.fa-cmp_category_nav_list { text-align: center; }
.fa-cmp_category_nav_list li { font-size: 12px; }
.fa-cmp_category_nav_list li + li { margin-left: 4px; }
.fa-cmp_category_nav_list li a { padding-bottom: 8px; }
}



/*! =========================================================
 _main
========================================================= */
.fa-cmp_main { width: 100%; max-width: 980px; margin: 0 auto; }



/*! =========================================================
 _heading
========================================================= */
.fa-cmp_heading_lv1 { margin-top: 55px; text-align: center; font-size: 30px; font-weight: bold; color: #a91d24; }
.fa-cmp_heading_lv2 { position: relative; margin-bottom: 30px; text-align: center; }
.fa-cmp_heading_lv2:before { position: absolute; top: 50%; left: 0; content: ''; width: 100%; height: 1px; background: #c2c2c2; z-index: 0; }
.fa-cmp_heading_lv2 span { position: relative; display: inline-block; padding: 0 20px; background: #fff; font-size: 24px; font-weight: bold; color: #a91d24; z-index: 1; }

@media only screen and (max-width: 768px){
.fa-cmp_heading_lv2 { margin-bottom: 25px; }
.fa-cmp_heading_lv2 span { font-size: 16px; }
}



/*! =========================================================
 _card
========================================================= */
.fa-cmp_card_img { display: block; position: relative; }
.fa-cmp_card_img img { display: block; width: 100%; }
.fa-cmp_card_title { font-weight: bold; color: #000; }
.fa-cmp_card_text { font-size: 14px; }
.fa-cmp_card_tag_list { margin-top: 12px; }
.fa-cmp_card_tag_list li { display: inline-block; white-space: nowrap; font-size: 12px; }
.fa-cmp_card_tag_list li:before { content: '/'; color: #a91d24; margin-right: 5px; }
.fa-cmp_card_tag_list li a { color: #666; }
.fa-cmp_card_date { margin-top: 12px; font-size: 12px; color: #a8adb0; }

@media only screen and (max-width: 768px){
.fa-cmp_card_text { font-size: 12px; }
.fa-cmp_card_tag_list { margin-top: 8px; }
.fa-cmp_card_date { margin-top: 8px; }
}



/*! =========================================================
 _pickup_list
========================================================= */
.fa-cmp_pickup_list { padding: 10px 0 55px; background: linear-gradient(180deg, #21262a 0%, #21262a 60%, #f3f5f6 60%, #f3f5f6 100%); }
.fa-cmp_pickup_list_inner { width: 100%; max-width: 980px; margin: 0 auto; }
.fa-cmp_pickup_list .fa-card { margin: 0 -8px; }
.fa-cmp_pickup_list .fa-card_item { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin-bottom: 0; padding: 0 8px; }
.fa-cmp_pickup_list .fa-card_item_inner { width: 100%; background: #fff; padding: 0 20px 40px; }
.fa-cmp_pickup_list .fa-cmp_card_img { margin-left: -20px; margin-right: -20px; }
.fa-cmp_pickup_list .fa-cmp_card_category { margin-top: 25px; font-size: 14px; font-weight: bold; color: #a91d24; }
.fa-cmp_pickup_list .fa-cmp_card_title { margin-top: 10px; font-size: 24px; line-height: 1.3; letter-spacing: -1px; }
.fa-cmp_pickup_list .fa-cmp_card_title a { color: #000; }

/* hover */
.fa-cmp_pickup_list .fa-card_item_inner { transition: background-color 0.3s; }
.fa-cmp_pickup_list .fa-card_item_inner .fa-cmp_card_category,
.fa-cmp_pickup_list .fa-card_item_inner .fa-cmp_card_title a,
.fa-cmp_pickup_list .fa-card_item_inner .fa-cmp_card_tag_list li:before,
.fa-cmp_pickup_list .fa-card_item_inner .fa-cmp_card_tag_list li a,
.fa-cmp_pickup_list .fa-card_item_inner .fa-cmp_card_date { transition: color 0.3s; }
.fa-cmp_pickup_list .fa-card_item_inner:hover { background: #f00; }
.fa-cmp_pickup_list .fa-card_item_inner:hover .fa-cmp_card_category,
.fa-cmp_pickup_list .fa-card_item_inner:hover .fa-cmp_card_title a,
.fa-cmp_pickup_list .fa-card_item_inner:hover .fa-cmp_card_tag_list li:before,
.fa-cmp_pickup_list .fa-card_item_inner:hover .fa-cmp_card_tag_list li a,
.fa-cmp_pickup_list .fa-card_item_inner:hover .fa-cmp_card_date { color: #fff; }

@media only screen and (max-width: 768px){
.fa-cmp_pickup_list { margin-left: -16px; margin-right: -16px; padding: 0 16px; background: linear-gradient(180deg, #21262a 0%, #21262a 10%, #fff 10%, #fff 100%); }
.fa-cmp_pickup_list .fa-card_item { margin-bottom: 20px; }
.fa-cmp_pickup_list .fa-card_item_inner { padding: 0; }
.fa-cmp_pickup_list .fa-cmp_card_img { margin: 0; }
.fa-cmp_pickup_list .fa-cmp_card_title { margin-top: 5px; font-size: 18px; }
}



/*! =========================================================
 _item_list
========================================================= */
.fa-cmp_item_list { margin-top: 50px; }
.fa-cmp_item_list .fa-card { margin: 0 -20px; }
.fa-cmp_item_list .fa-card_item { padding: 0 20px; }
.fa-cmp_item_list .fa-cmp_card_category { position: absolute; left: 0; bottom: -13px; }
.fa-cmp_item_list .fa-cmp_card_category span { position: relative; display: inline-block; padding: 5px 10px 4px 15px; background: #a91d24; font-size: 14px; color: #fff; z-index: 0; }
.fa-cmp_item_list .fa-cmp_card_category span:before { position: absolute; top: 0; bottom: 0; right: -5px; content: ''; width: 20px; background: #a91d24; transform: skew(-20deg); z-index: -1; }
.fa-cmp_item_list .fa-cmp_card_title { margin-top: 22px; font-size: 20px; line-height: 1.4; }
.fa-cmp_item_list .fa-cmp_card_title a { color: #000; transition: color 0.3s; }
.fa-cmp_item_list .fa-cmp_card_title a:hover { color: #a91d24; }

.fa-cmp_item_list_more { text-align: center; }
.fa-cmp_item_list_more a { display: inline-block; padding-left: 35px; background: url(../img/ico_arrow_down.png) 0 50% no-repeat; color: #000; }
.fa-cmp_item_list_more a.is-disabled { display: none; }

@media only screen and (max-width: 768px){
.fa-cmp_item_list { margin-top: 35px; }
.fa-cmp_item_list .fa-card { margin: 0 -16px; }
.fa-cmp_item_list .fa-card_item { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; align-items: flex-start; margin-bottom: 30px; padding: 0 16px; }
.fa-cmp_item_list .fa-cmp_card_img { width: 45%; padding-right: 10px; }
.fa-cmp_item_list .fa-cmp_card_category { bottom: -10px; }
.fa-cmp_item_list .fa-cmp_card_category span { padding: 5px 8px 4px 13px; font-size: 11px; }
.fa-cmp_item_list .fa-cmp_item_list_text { width: 55%; padding-left: 10px; }
.fa-cmp_item_list .fa-cmp_card_title { margin-top: 0; font-size: 16px; }
}



/*! =========================================================
 _attention
========================================================= */
.fa-cmp_attention { margin-top: 60px; padding: 30px; background: #f3f5f6; }
.fa-cmp_attention .fa-cmp_heading_lv2 span { background: #f3f5f6; }
.fa-cmp_attention .fa-card { margin: 0 -10px; }
.fa-cmp_attention .fa-card_item { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin-bottom: 0; padding: 0 10px; }
.fa-cmp_attention .fa-card_item_inner { background: #fff; padding: 0 20px 20px; }
.fa-cmp_attention .fa-cmp_card_img { margin-left: -20px; margin-right: -20px; }
.fa-cmp_attention .fa-cmp_card_img:before { content: ""; background-color: #a1acb1; display: block; width: 100%; padding-top: 50%; }
.fa-cmp_attention .fa-cmp_card_img img { position: absolute; top:0; left: 50%; transform:translateX(-50%); width: auto; height: 100%; }
.fa-cmp_attention .fa-cmp_card_category { margin-top: 15px; font-size: 12px; font-weight: bold; color: #a91d24; }
.fa-cmp_attention .fa-cmp_card_title { margin-top: 5px; font-size: 16px; line-height: 1.4; }
.fa-cmp_attention .fa-cmp_card_title a { color: #000; }
.fa-cmp_attention .fa-cmp_card_date { margin-top: 8px; }

@media only screen and (max-width: 768px){
.fa-cmp_attention { margin-top: 40px; margin-left: -16px; margin-right: -16px; padding: 30px 16px 20px; }
.fa-cmp_attention .fa-card { margin: 0 -16px; }
.fa-cmp_attention .fa-card_item { display: block; margin-bottom: 20px; padding: 0 16px; }
.fa-cmp_attention .fa-card_item_inner { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin-bottom: 0; padding: 0 16px; background: none; padding: 0; }
.fa-cmp_attention .fa-cmp_card_img { width: 30%; margin-left: 0; margin-right: 16px; }
.fa-cmp_attention .fa-cmp_card_img:before { content: none; }
.fa-cmp_attention .fa-cmp_card_img img { position: static; top:0; left: 0; transform:translateX(0); width: 100%; height: auto; }
.fa-cmp_attention .fa-cmp_attention_text { position: relative; width: 70%; }
.fa-cmp_attention .fa-cmp_card_category { margin-top: 0; }
.fa-cmp_attention .fa-cmp_card_title { font-size: 14px; line-height: 1.6; }
.fa-cmp_attention .fa-cmp_card_date { position: absolute; top: 0; right: 0; margin-top: 0; }
}



/*! =========================================================
 _related
========================================================= */
.fa-cmp_related { margin-top: 60px; }
.fa-cmp_related .fa-card { margin: 0 -20px; }
.fa-cmp_related .fa-card_item { padding: 0 20px; }
.fa-cmp_related .fa-cmp_card_title { margin-top: 15px; font-size: 18px; line-height: 1.4; }
.fa-cmp_related .fa-cmp_card_title a { color: #000; }

@media only screen and (max-width: 768px){
.fa-cmp_related { margin-top: 40px; }
.fa-cmp_related .fa-card { margin: 0 -8px; }
.fa-cmp_related .fa-card_item { margin-bottom: 20px; padding: 0 8px; }
.fa-cmp_related .fa-cmp_card_title { margin-top: 5px; font-size: 14px; }
}



/*! =========================================================
 _members
========================================================= */
.fa-cmp_members { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; flex-wrap: wrap; justify-content: space-between; position: relative; margin-top: 60px; padding: 60px 60px 20px; background: #f3f5f6; border-top: 6px solid #c5cdd1; }
.fa-cmp_members:before { position: absolute; top: -6px; left: 0; width: 420px; height: 6px; content: ''; background: #af000e; }

.fa-cmp_members_regist { order: 1; width: 360px; }
.fa-cmp_members_title { font-size: 30px; font-weight: bold; color: #a91d24; }
.fa-cmp_members_text { font-size: 18px; margin-top: 30px; }
.fa-cmp_members_link { margin-top: 10px; }
.fa-cmp_members_link a { font-size: 14px; color: #000; text-decoration: underline; }

.fa-cmp_members_benefit { order: 2; width: 405px; }
.fa-cmp_members_sub_title { font-weight: bold; }
.fa-cmp_members_lead { margin-top: 15px; padding-left: 40px; background: url(../img/members_lead.png) 0 50% no-repeat; font-size: 18px; font-weight: bold; }
.fa-cmp_members_benefit_list { margin-top: 15px; margin-left: 20px; list-style-type: decimal; }
.fa-cmp_members_benefit_list li { margin-top: 5px; font-size: 14px; }

.fa-cmp_members_benefit_icon { order: 4; margin-top: 20px; width: 405px; }
.fa-cmp_members_benefit_icon li { display: inline-block; }
.fa-cmp_members_benefit_icon li + li { margin-left: 25px; }
.fa-cmp_members_benefit_icon li img { width: 82px; }

.fa-cmp_members_regist_btn { order: 3; width: 360px; margin-top: 40px; }
.fa-cmp_members_regist_btn a { display: block; width: 100%; padding: 16px; box-sizing: border-box; background: #fff; border-radius: 30px; box-shadow: 0 15px 25px -20px #ff4c69; text-align: center; font-size: 18px; font-weight: bold; color: #af000e; }

.fa-cmp_members_mail { order: 5; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; align-items: center; justify-content: space-between; width: 100%; margin-top: 35px; margin-left: -40px; margin-right: -40px; padding: 20px 40px; background: #a1acb1; }
.fa-cmp_members_mail_text { font-size: 16px; font-weight: bold; color: #fff; }
.fa-cmp_members_mail_btn { width: 360px; }
.fa-cmp_members_mail_btn a { display: block; width: 100%; padding: 16px; box-sizing: border-box; background: #fff; border-radius: 30px; text-align: center; font-size: 18px; font-weight: bold; color: #af000e; }
.fa-cmp_members_mail_btn_small { font-size: 12px; }


@media only screen and (max-width: 768px){
.fa-cmp_members { margin-top: 45px; margin-left: -16px; margin-right: -16px; padding: 25px 20px 0; border-top: 6px solid #af000e; }
.fa-cmp_members:before { display: none; }

.fa-cmp_members_regist { order: 1; width: 100%; }
.fa-cmp_members_title { font-size: 20px; text-align: center; }
.fa-cmp_members_text { font-size: 14px; margin-top: 15px; text-align: center; }
.fa-cmp_members_link { margin-top: 15px; text-align: center; }

.fa-cmp_members_benefit { order: 2; width: 100%; margin-top: 35px; }
.fa-cmp_members_sub_title { text-align: center; }
.fa-cmp_members_lead { margin-top: 15px; padding-top: 40px; padding-left: 0; background-position: 50% 0; text-align: center; font-size: 16px; }
.fa-cmp_members_benefit_list li { font-size: 12px; }

.fa-cmp_members_benefit_icon { order: 3; width: 100%; text-align: center; }
.fa-cmp_members_benefit_icon li + li { margin-left: 20px; }
.fa-cmp_members_benefit_icon li img { width: 60px; }

.fa-cmp_members_regist_btn { order: 4; width: 100%; margin-top: 25px; }
.fa-cmp_members_regist_btn a { font-size: 16px; }

.fa-cmp_members_mail { order: 5; flex-wrap: wrap; width: 100%; margin-top: 45px; margin-left: -20px; margin-right: -20px; padding: 20px 20px 40px; }
.fa-cmp_members_mail_text { width: 100%; text-align: center; }
.fa-cmp_members_mail_btn { width: 100%; margin-top: 15px; }
.fa-cmp_members_mail_btn a { font-size: 12px; }
}



/*! =========================================================
 _error
========================================================= */
.fa-cmp_error { display: none; margin-top: 150px; margin-bottom: 150px; }
.fa-cmp_error p { text-align: center; }



/*! =========================================================
 _banner
========================================================= */
.fa-cmp_banner { width: 100%; max-width: 980px; margin: 45px auto 0 !important; }
.fa-cmp_banner img { width: 100% !important; max-width: 100% !important; vertical-align: bottom; }

@media only screen and (max-width: 768px){
.fa-cmp_banner { margin-top: 30px !important; }
}



/*! =========================================================
 _almighty
========================================================= */
.fa-cmp_pc_only { display: inline-block; }
.fa-cmp_sp_only { display: none; }

@media only screen and (max-width: 768px){
.fa-cmp_pc_only { display: none; }
.fa-cmp_sp_only { display: inline-block !important; }
}



/*! =========================================================
sns share
========================================================= */
#content_compass #contents_main .sns_section { margin-top: 40px; padding: 10px 15px 17px; }
#content_compass #contents_main .sns_section p { margin-top: 5px; text-align: center; }
#content_compass #contents_main .sns_section p a:hover { opacity: .7; }
#content_compass #contents_main .sns_section p img { width: auto; height: 45px; margin: 0 5px; }



/*! =========================================================
The art of manufacturing
========================================================= */
.fa-cmp_aom { margin-top: 25px; }
.fa-cmp_aom_title { display: block; max-width: 100%; }
.fa-cmp_aom_card { margin: 30px -15px 0 -15px; display: flex; }
.fa-cmp_aom_cardLink { display: flex; width: 100%; padding: 0 15px; }
.fa-cmp_aom_cardLink:hover { color: #000; cursor: pointer; }
.fa-cmp_aom_cardImg img { display: block; width: 180px; }
.fa-cmp_aom_cardBody { margin-left: 30px; }
.fa-cmp_aom_cardBody a:link { color: #000; }
.fa-cmp_aom_cardBody a:visited { color: #000; }
.fa-cmp_aom_cardBody a { display: block; }
.fa-cmp_aom_cardTitle { font-size: 20px; font-weight: bold; color: #000; }
.fa-cmp_aom_cardList { margin-top: 15px; font-size: 14px; color: #000; list-style: disc; padding-left: 1.5em; }

@media only screen and (max-width: 768px){
.fa-cmp_aom_cardImg img { display: block; width: 120px; }

.fa-cmp_aom_card { margin: 5px 0 0; display: block; }
.fa-cmp_aom_cardLink { display: flex; width: 100%; padding:20px 0 0; }
.fa-cmp_aom_cardBody { margin-left: 10px; }
.fa-cmp_aom_cardTitle { font-size: 14px;  }
.fa-cmp_aom_cardList { margin-top: 5px; font-size: 12px; }
}
