@charset "UTF-8";
/* CSS Document */
    /*最新消息start*/
    .news_grid_mb{
		display: grid;
		grid-template-columns:33.3% 33.3% 33.3%;
		padding-top: 20px;
		border-top: 1px solid rgba(0,0,0,0.1);
	}
	.news_block_mb{
		padding:14px;
		position: relative;
		border: 1px solid rgba(0,0,0,0);
	}	
	.news_block_mb:hover{
		border: 1px solid rgba(0,0,0,0.05);
		background-color: #fcfcfc;
		box-shadow: 8px 8px 14px rgba(0,0,0,0.1);
	}
	.news_text_mb{
		padding-top: 20px;
		padding-right: 8px;
		padding-left: 8px;
		padding-bottom: 20px;
	}
	.news_text_mb .text_rank_1_mb{
		margin-bottom: 10px;
	}
	.news_text_mb .link_mb{
		margin-top: 10px;
		color:rgba(0,0,0,0.4);
	}
	
	
	
	
	.pagination_mb{
		display: flex;
		justify-content: center;
		align-items: center;
		margin-top: 20px;
	}
	.pagination_prev_btn_mb{
		font-size: 14px;
		color: #282828;
		text-align: center;
		width: 33%;
		max-width: 90px;
		border-right: 1px solid rgba(0,0,0,0.1);
	}
	.pagination_next_btn_mb{
		font-size: 14px;
		color: #282828;
		text-align: center;
		width: 33%;
		max-width: 90px;
		border-left: 1px solid rgba(0,0,0,0.1);
		cursor: pointer;
	}
.pagination_select_mb {
	font-size: 14px;
	color: #282828;
	padding-left: 14px;
	padding-right: 14px;
	letter-spacing: 0.1em;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: 0px solid rgba(0,0,0,0);
	background-color: transparent;
	width: 33%;
	max-width: 90px;
	background-image: url("https://static.mabelle.com/images/arrow_down.png");
	background-repeat: no-repeat;
	background-size: 12px;
	background-position: right center;
	margin-right: 14px;
	margin-left: 14px;
	outline: none;
}
	@media(max-width:768px){
		.news_grid_mb{
		    grid-template-columns:50% 50%;
	    }
	}
	@media(max-width:576px){
		.news_grid_mb{
		    grid-template-columns:100%;
	    }
		.news_text_mb{
			border-bottom: 1px solid rgba(0,0,0,0.1);
		}
	}
    /*最新消息End*/







    /*公司資訊Start*/
    .company_swiper_img_mb{
		width: auto;
	}
	.company_swiper_img_mb img{
		height: 200px;
		width: auto;
	}
	.swiper-container {
        width: 100%;
        height: 100%;
    }
    .company_swiper_mb .swiper-slide {
        text-align: center;
        font-size: 18px;
        width: auto;

        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
    }
	.company_swiper_pagination_mb{
		position: relative;
		z-index: 3;
		margin-top: 18px;
	}
	.company_swiper_pagination_mb .swiper-pagination-bullet-active{
		background-color: #631549;
	}
	.company_bottom_flex_mb{
		padding: 20px;
		background-color: rgba(0,0,0,0.02);
	}
    /*公司資訊End*/



    /*企業責任Start*/
    .responsibility_logo_mb{
		width: 50%;
		border: 1px solid rgba(0,0,0,0.05);
		margin-right: 20px;
	}
	.company_top_flex_mb{
		display: flex;
		justify-content: flex-start;
		align-items:center;
		background-color: rgba(0,0,0,0.02);
		padding: 20px;
	}
	.company_second_flex_mb{
		padding: 20px;
		background-color: rgba(0,0,0,0.02);
	}
	
	.company_swiper_img_mb{
		width: auto;
	}
	.company_swiper_img_mb img{
		height: 200px;
		width: auto;
	}
	.swiper-container {
        width: 100%;
        height: 100%;
    }
    .company_swiper_mb .swiper-slide {
        text-align: center;
        font-size: 18px;
        width: auto;

        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
    }
	.company_swiper_pagination_mb{
		position: relative;
		z-index: 3;
		margin-top: 18px;
	}
	.company_swiper_pagination_mb .swiper-pagination-bullet-active{
		background-color: #631549;
	}
	.company_bottom_flex_mb{
		padding: 20px;
		background-color: rgba(0,0,0,0.02);
	}
	
	.generic_overflow_hidden_mb{
		overflow: hidden;
	}
	@media(max-width:576px){
		.company_top_flex_mb{
			display: block;
		}
		.responsibility_logo_mb{
			max-width: none;
			margin-bottom: 20px;
			width: 100%;
		}
	}
    /*企業責任End*/



    /*證書Start*/
    .trade_description_title_mb{
		margin-bottom: 5px;
		font-size: 16px;
		letter-spacing: 0.02em;
		color:#631549;
	}
	.trade_description_table_mb{
		width: 100%;
		margin-top: 10px;
		color: #282828;
		margin-bottom: 5px;
	}
	.trade_description_table_mb th{
		pointer-events: none;
		background-color: rgba(0,0,0,0.05);
		border: 1px solid rgba(0,0,0,0.1);
		font-size: 14px;
		letter-spacing: 0.02em;
		padding:4px 10px;
		
		font-weight: 500;
	}
	.trade_description_table_mb td{
		border: 1px solid rgba(0,0,0,0.1);
		font-size: 14px;
		letter-spacing: 0.02em;
		padding:4px 10px;
		
	}
	.trade_description_table_mb tr:hover{
		background-color: #631549;
		color: white!important;
	}
	
	
	
	
	.certification_item_block_mb{
		background-color: rgba(0,0,0,0.03);
		padding: 14px;
		margin-bottom: 10px;
	}
	.certification_purplr_title_mb{
		font-size: 16px;
		color: #631549;
		margin-bottom: 4px;
		letter-spacing: 0.02em;
	}
    /*證書end*/



    /*會員帳戶Start*/
	.vip_login_flex_block_mb{
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		flex-wrap: wrap;
		margin-top: 14px;
	}
	.vip_login_method_mb{
		display: flex;
		justify-content: flex-start;
		align-items: center;
		padding:0px 14px;
		border: 1px solid rgba(0,0,0,0.1);
		width:24%;
		margin-bottom: 10px;
		font-size: 14px;
		letter-spacing: 0.05em;
		color: #282828;
		height:64px;
		line-height: 1.2em;
	}
	.vip_login_method_mb:hover{
		background-color: rgba(0,0,0,0.02);
		border: 1px solid rgba(0,0,0,0.15);
	}
	.vip_login_method_mb span{
		letter-spacing: 0em;
	}
	.vip_login_method_mb img{
		width: 28px;
		height:28px;
		margin-right: 10px;
		opacity: 0.8;
	}
	
	@media(max-width:992px){
		.vip_login_method_mb{
			width: 49%;
		}
	}
    /*會員帳戶end*/


    /*常見問題Start*/
	.question_block_mb{
		display: flex;
		justify-content: flex-start;
		align-items: flex-start;
		margin-bottom: 8px;
		margin-top: 30px;
	}
	.question_block_mb .text_rank_2_mb{
		color: rgba(0,0,0,0.4);
	}
	.answer_block_mb{
		display: flex;
		justify-content: flex-start;
		align-items: flex-start;
		margin-bottom: 30px;
		border-bottom: 1px solid rgba(0,0,0,0.08);
		padding-bottom: 30px;
	}
	.letter_q_mb{
		font-size: 14px;
		width: 24px;
		color: rgba(0,0,0,0.4);
		min-width: 24px;
	}
	.letter_a_mb{
		font-size: 14px;
		min-width:24px;
		width: 24px;
		color:#631549;
	}
    /*常見問題End*/





    /*網店線上體驗Start*/
    .reason_to_shop_block_mb{
		border: 1px solid rgba(0,0,0,0.1);
		margin-top: 14px;
		width: 100%;
		padding:20px;
		display: flex;
		justify-content: flex-start;
		align-items: center;
		position: relative;
	}
	.reason_to_shop_block_mb:hover{
		border: 1px solid rgba(0,0,0,0.2);
		background-color: rgba(0,0,0,0.02);
	}
	.reason_to_shop_block_mb img{
		width: 60px;
		margin-right:20px;
	}
	.reason_to_shop_block_mb a{
		position: absolute;
		width: 100%;
		height: 100%;
		top:0px;
		left: 0px;
		z-index: 2;
		cursor: pointer;
		opacity: 0;
	}
    /*網店線上體驗End*/





    /*網上購物Start*/
    .packing_block_mb{
		display: flex;
		justify-content: flex-start;
		align-items: center;
		border: 1px solid rgba(0,0,0,0.05);
		margin-bottom: 14px;
		padding: 14px;
	}
	.packing_block_mb img{
		width:200px;
		margin-right: 14px;
	}
	
	
	@media(max-width:576px){
		.packing_block_mb{
			display: block;
		}
		.packing_block_mb img{
			margin-bottom: 14px;
		}
	}
    /*網上購物End*/


    /*鑽石學院Start*/
    .academy_title_mb{
		display: flex;
		justify-content: flex-start;
		align-items: center;
	}	
   
	.academy_title_mb img{
		width: 17px;
		height: 17px;
		margin-right:4px;
		filter: brightness(0);
		opacity: 0.9;
		margin-top: 2px;
	}
	.academy_block_mb{
		margin-left: 7px;
		padding-left: 12px;
		border-left: 1px solid rgba(0,0,0,0.1);
	}
   
	.academy_carat_img_mb{
		width:100%;
		height: 220px;
		background-position:left center;
		background-size: cover;
		margin-left: auto;
		margin-right: auto;
	}
	
	
	.cut_img_flex_mb{
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
	}
	.cut_img_block_mb{
		font-size: 14px;
		color: #8c8c8c;
		letter-spacing: 0.02em;
		text-align: center;
		white-space: nowrap;
		margin-bottom: 20px;
	}
	
	
	
	.certicicate_flex_mb{
		display: flex;
		justify-content: flex-start;
		flex-wrap: wrap;
		align-items: flex-start;
	}
	.certificate_block_mb{
		display: flex;
		justify-content: flex-start;
		align-items: center;
		margin-bottom: 20px;
		width: 50%;
	}
	.certificate_text_mb{
		font-size: 16px;
		color: #282828;
		letter-spacing: 0.02em;
		padding-left: 12px;
		border-left: 1px solid rgba(0,0,0,0.1);
		margin-left: 12px;
	}
	.certificate_text_mb span{
		font-size: 14px;
		color: #8c8c8c;
		letter-spacing: 0.01em;
	}
	.certificate_block_mb img{
		width: 140px;
	}
	.certificate_leo_mb{
		display: flex;
		justify-content: flex-start;
		align-items: center;
		margin-bottom: 14px;
	}
	.certificate_leo_mb img{
		width: auto;
		height:54px;
	}
	.certificate_leo_mb img:nth-child(1){
		margin-right: 10px;
		border-right: 1px solid rgba(0,0,0,0.1);
		padding-right: 14px;
	}
	.leo_certificate_btn_mb{
		display: flex;
		justify-content: flex-start;
		align-items: center;
		font-size: 14px;
		color: #8c8c8c;
		letter-spacing: 0.01em;
		cursor: pointer;
		width:90px;
	}
	.leo_certificate_btn_mb img{
		width: 6px;
		margin-left: 3px;
	}
	
	
	
	
	
	
	.setting_flex_outside_mb{
		display: flex;
		justify-content: flex-start;
		align-items: flex-start;
		flex-wrap: wrap;
	}
	
	
	.setting_flex_mb{
		display: flex;
		justify-content: flex-start;
		align-items:flex-start;
		margin-bottom: 20px;
		width: 50%;
		padding-right: 24px;
	}
	.setting_flex_mb img{
		width: 100px;
		height: 100px;
		min-width: 100px;
		min-height: 100px;
		border: 1px solid rgba(0,0,0,0.05);
		margin-right: 14px;
	}
	
	
	
	
	.charity_table_mb{
		pointer-events: none;
		max-width: 480px;
	}
	.charity_table_mb tr:nth-child(even){
		background-color: rgba(0,0,0,0.02);
	}
	.clarity_table_img_mb{
		width: 60px;
		margin: auto;
	}
	
	
	.color_flex_mb{
		display: flex;
		justify-content: flex-start;
		align-items: flex-start;
		flex-wrap: wrap;
	}
	
	
	.color_block_mb{
		width: 110px;
		padding: 14px;
		text-align: center;
		font-size: 12px;
        color: #8c8c8c;
        letter-spacing: 0.02em;
	}
	.color_block_mb img{
		margin-bottom: 10px;
	}
	
	
	
	
	
	.weight_flex_mb{
		display: flex;
		justify-content: flex-start;
		align-items: flex-start;
		flex-wrap: wrap;
	}
	.weight_block_mb{
		margin-bottom: 14px;
		text-align: center;
		font-size: 12px;
		color: #8c8c8c;
		letter-spacing: 0.02em;
	}
.weight_img_block_mb {
	width: 120px;
	height: 120px;
	position: relative;
	background-image: url("https://static.mabelle.com/images/functions/weight_diamond.png");
	background-position: center;
	background-repeat: no-repeat;
	transform: scale(0.6);
}
	
	
	
	.cut_img_mb{
		max-width: 440px;
	}

    @media(max-width:767px){
		
	    .academy_title_mb img{
		    width: 15px;
		    height: 15px;
		    margin-right: 3px;
			margin-top: 1px;
	    }  
		.academy_block_mb{
			padding-left: 10px;
		}
		.certificate_block_mb img{
		    width: 110px;
	    }
    }


	@media(max-width:992px){
		.cut_img_flex_mb{
			flex-wrap: wrap;
		}
		.cut_img_block_mb{
			width:33.3%;
		}
		.certificate_block_mb{
			width: 100%;
		}
		.setting_flex_mb{
			width: 100%;
			padding-right: 0px;
		}
	}
	/*鑽石學院End*/