@charset "utf-8";
/* CSS Document */

/*基本*/
body{ margin:0; padding:0; background-color:#fff2df}
body{ margin:0; padding:0;background: url("bg.jpg?t=1751271090153") no-repeat center top ;}
	@media screen and (max-width:767px){
	body {margin:0; padding:0; background: url(m_bg.jpg?t=1751271090153) no-repeat center top ;width:100%; min-width: inherit;background-size:100%; height:100% ;position: absolute; top:0 ;left:0; background-color:#fff2df}	
}
/*全BOX版面*/
.WRAPPER { z-index:0 position: relative; display:block; margin: 0 auto; padding: 0; width:100%;  min-width:1220px; overflow:hidden; font-family:"微軟正黑體","Microsoft JhengHei",Helvetica;}
.WRAPPER img { border:0px; vertical-align:top;}
.WRAPPER a { text-decoration:none;}
	@media screen and (max-width:767px){
	.WRAPPER { min-width: inherit; padding-bottom:40px; }
	.WRAPPER img {  width:100%;  height:auto;}
}

/*背景*/

/*.bg01{z-index:-9!important; position:fixed; top:0; left:0; width:100%; min-width:1220px; height:100%; background: url(bg.png?t=1751271090153) fixed center top ;}*/

/*區塊_all*/
.Area { z-index: 1; position: relative; margin:0 auto; padding:0; border-radius:0; text-align:center;}
.Area a { display:block;} 
.Area .title { margin-bottom:20px; }
.Area .go_bt {
  -webkit-transition: all 0.4s ease;
     -moz-transition: all 0.4s ease;
      -ms-transition: all 0.4s ease;
       -o-transition: all 0.4s ease;
          transition: all 0.4s ease;}
.Area .go_bt:hover {
  -webkit-transform:scale(0.95);
     -moz-transform:scale(0.95);
      -ms-transform:scale(0.95);
       -o-transform:scale(0.95);
          transform:scale(0.95);}
.Area1220 { margin:0 auto; width:1220px; }
.Area960 { margin:0 auto; width:960px;}
.Areabottom { /*margin-bottom:80px;*/margin-bottom:0px;}
	@media screen and (max-width:767px){
        .Area .title { margin-bottom:3vw; }
		.Area1220 { width:100%;}
		.Area960 { width:100%;}
        .Areabottom { /*margin-bottom:8vw;*/margin-top:17px; }
        .Area .go_bt { transform: none}
		/*區塊_切割*/
		.Area_1bn { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_1bn a { float:left; margin:0 0 2% 0; padding:0; width:100%; list-style: none;}
		.Area_2bn { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_2bn a { float:left; margin:0 1% 2%; padding:0; width:48%; list-style: none;}
		.Area_3bn { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_3bn a { float:left; margin:0 1% 2% ; padding:0; width:31.3%; list-style: none;}
		.Area_1bn_nopadding { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_1bn_nopadding a { float:left; margin:0; padding:0; width:100%; list-style: none;}
		.Area_2bn_nopadding { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_2bn_nopadding a { float:left; margin:0; padding:0; width:50%; list-style: none;}
		.Area_3bn_nopadding { margin: 0 auto;
			padding:0; overflow:hidden;}
		.Area_3bn_nopadding a { float:left; margin:0; padding:0; width:33.3%; list-style: none;}
	}


/*版頭*/
.Area_top {}
.Area_top .momologo { z-index:2; position: absolute;top: 30px; left:40px;}
.Area_top .momologo a { display:block; width:500px; height:30px; background: url(momo_logo.png?t=1751271090153) no-repeat;}
.Area_top .momologo a:hover{ background: url(momo_logo_on.png?t=1751271090153) no-repeat;}
.Area_top .box .r1 {position: absolute;left:1158px;top:20px;}
.Area_top .box .r2 {position: absolute;left:1237px;top:20px;}
.Area_top .box .r3 {position: absolute;left:1304px;top:20px;}
.Area_top .box .r4 {position: absolute;left:1370px;top:20px;}
.Area_top .deco {position: absolute; top: 366px; left: 876px;}
	@media screen and (max-width:767px){
		.Area_top { height: auto;}
		.Area_top .momologo { display:none;}
		.Area_top .deco {position: absolute;top: 43vw; left: 80vw; width: 17%; }
	}


.Area03 .btn {top:0; /*position: relative */}
.Area03 .btn .menu { margin: 0 auto ; display: block; padding:0 90px 0 90px;top:0; /*position: relative */}
.Area03 .btn .menu ul{width: 960px;}
.Area03 .btn .menu li{list-style: none; float: left}
.btn1 {display: block; width:50%; height: 6%; left:0%; }
.btn2 {display: block; width:50%; height: 6%; left:50%; }

.Area03 .btn .m_menu { margin: 0 auto; display: block; padding:0;}
.Area03 .m_menu ul{ padding:0 0 15% 0;}
.Area03 .m_menu li{}
.m_menu .btn1 {position: absolute; display: block; width:50%; height: 6%; left:0%; }
.m_menu .btn2 {position: absolute; display: block; width:50%; height: 6%; left:50%; }


/*區塊模糊*/
.Area03 { margin: 0 auto 70px auto; display:block; padding:165px 0px 100px 0px; border-radius: 20px; z-index: 0; }
.Area03 .shape {position: absolute; width: 150px; top: .5rem;left: .5rem; }

.Area03 ul{ width: 960px; margin: 0 auto;padding: 0;}
.Area03 li {list-style: none; float: left;  }
.Area03 ul li .btn1 { display: block; width:50%; height: 6%; top:-170px; left:0%; }
.Area03 ul li .btn2 { display: block; width:50%; height: 6%; top:-170px; left:50%; }

	@media screen and (max-width:767px){
		.Area03 {margin-bottom: 20px; display: block;padding:0px; border-radius: 0px;}
		.Area03 .shape {display: none}
	}

.Area04 {margin: 35px auto 0 auto; display: block; border-radius: 20px;}
.Area04 .shape {position: absolute; width: 150px; top: .5rem;left: .5rem; }
.Area04 .btn {top:0; /*position: relative */}
.Area04 .btn .menu { margin: 0 auto ; display: block; padding:0 90px 0 90px;top:0; /*position: relative */}
.Area04 .btn .menu ul{width: 960px;}
.Area04 .btn .menu li{list-style: none; float: left}
.Area04 ul{ width: 960px; margin: 0 auto;padding: 0;}
.Area04 li {list-style: none; float: left;  }
.Area04 ul li .btn1 { display: block; width:50%; height: 6%; top:-170px; left:0%; }
.Area04 ul li .btn2 { display: block; width:50%; height: 6%; top:-170px; left:50%; }
	@media screen and (max-width:767px){
		.Area04 {margin:-9vw 0 16vw 0; display: block;padding:0px; border-radius: 0px;}
		.Area04 .shape {display: none}
	}

.Area09 {margin: 0 auto 70px auto; display: block; padding:70px 0px; border-radius: 20px;}
.Area09 .shape {position: absolute; width: 150px; top: .5rem;left: .5rem; }
	@media screen and (max-width:767px){
		.Area09 {margin-bottom: 20px; display: block;padding:0px; border-radius: 0px;}
		.Area09 .shape {display: none}
	}

/*下拉QA區*/
.page {top:0; position: relative }
.page .menu {margin: 0 auto ; display: block; padding:0 90px 0 90px;top:0; position: relative }
.page .menu ul{}
.page .menu li{list-style: none;}

.Area06 .page .m_menu {margin: 0 auto; display: block; padding:0;}
.label_01 { position:absolute; display: block; width:50%; height: 6%; top:-75%; left:0%; }
.label_02 { position:absolute; display: block; width:50%; height: 6%; top:-75%; left:50%; }

.Area06 {margin: 0 auto 70px auto; padding:70px 0px 0px 0px; border-radius: 20px; display: block;}
.Area06 .shape {position: absolute; width: 150px; top: .5rem;left: .5rem; }
.Area06 a { display: block; /*color: #564ace;*/ color: #b1eaff;text-decoration: underline;}
.Area06 .btn_box img {width: 80%}
.Area06 .tabcontent .Content { width: 960px; margin: 0 auto; padding-bottom: 70px}
.Area06 .tabcontent .Content h4 {font-size: 30px; margin: 25px 0 15px; display: none}
.Area06 .tabcontent .Content2 a {color:#fff2df;}
.Area06 .tabcontent .Content2 ol {width: 100%; overflow: hidden; padding: 0 0 0 10%; box-sizing: border-box;}
.Area06 .tabcontent .Content2 ol li { /*font: 22px/30px 微軟正黑體; */color: #000000;}
.Area06 .tabcontent .Content .listTitle {color: #333;}
.Area06 .title2 {padding-top: 0px;}
.Area06 a {display: inline-block;}
.Area06 .btn { position: absolute; bottom: 1%; left: 50%; transform: translateX(-50%);}
.Area06 ol {margin: 0 auto;text-align: justify;}
.Area06 li {margin: 0 auto;padding: 0; float: left;}


@media screen and (max-width:767px){
.page .menu {padding:8% 0 0 0 }
}

@media screen and (max-width:767px){
	.Area06 {margin: 0 auto 20px auto; padding:0px; border-radius: 0px; display: block;}
	.Area06 .shape {display: none}	
	.Area06 .btn {bottom: -2%;}
	.Area06 .tabcontent .Content { width: 98%; margin: 0 auto; padding-bottom: 0}
	.Area06 .tabcontent .Content2 ul{padding: 0 3vw 0 9vw; margin: 0 auto;margin-top: 6%}
	.Area06 .tabcontent .Content2 ol li{/*font: bold 3.8vw/5.2vw 微軟正黑體; */color: #000000;}
	.Area06 .cargo {width: 40%; margin:2vw 0 5vw;}
	.Area06 .motogo{width: 40%; margin-bottom: 2vw 0 5vw;}
	.Area06 .cargo img{width: 100%;}
	.Area06 .motogo img{width: 100%;}
	.Area06 .labelbox {/*width: 960px;*/ display: block; margin: 0 auto;padding: 0;}
	.Area06 .labelbox ul {position: absolute}
	.Area06 .labelbox ul li {display: flex; margin: 0;padding: 0}
	.Area06 .labelbox li img {width: 100%; left: 0;float: left;}
}

.Area08 {margin: 0 auto 70px auto; display: block; padding:70px 0px 0px 0px; border-radius: 20px;}
.Area08 .shape {position: absolute; width: 150px; top: .5rem;left: .5rem; }
.Area08 li {margin: 0 auto; list-style: none; float: left;}
@media screen and (max-width:767px){
	.Area08 {margin-bottom: 20px; display: block;padding:0px; border-radius: 0px;}
	.Area08 .shape {display: none}	
	.Area08 .labelbox {/*width: 960px;*/ display: block; margin: 0 auto;padding: 0;}
	.Area08 .labelbox ul {position: absolute}
	.Area08 .labelbox ul li {display: flex; margin: 0;padding: 0}
	.Area08 .labelbox li img {width: 100%; left: 0;float: left;}
}

.moreButton { width:100%; margin:0 auto; letter-spacing: 0.02em; }
.moreButton .title {font:30px/1.2em '微軟正黑體'; text-align:left; margin-bottom:10px; display:inline-block ;}
.moreButton dl {}
.moreButton dt {cursor:pointer; }
.moreButton dd {display: none; margin:0; padding:30px; font:18px/1.8em '微軟正黑體', 'Century Gothic'; text-align:left; background-color:#ffc673; color: #00000 }
.moreButton .menu_btn { position: relative;display: block; font:bold 22px/30px 微軟正黑體; color: #333; text-align: left; padding: 20px 100px 20px 30px; font-weight: bold}
.moreButton .up::after{content: "-";position: absolute; top: 17px; right:80px; width: 0; height: 0; font:bold 40px/30px 微軟正黑體;}
.moreButton .down::after {content: "+";position: absolute; top: 17px; right:80px; width: 0; height: 0; font:bold 30px/30px 微軟正黑體;}
.moreButton .up img{ width:100%; height:auto }
.moreButton .down img{ width:100%; height:auto}
.moreButtontag { display:none!important;}
@media screen and (max-width:767px){
	.moreButton .title { font: 4vw/1.8em '微軟正黑體','Century Gothic'; }
    .moreButton dd { font: 4vw/1.8em '微軟正黑體','Century Gothic'; padding: 4vw;  }
	.moreButton .menu_btn { height: auto; font: 4vw/1.8em '微軟正黑體','Century Gothic'; padding: 3vw 12vw 3vw 4vw; font-weight: bold }
	.moreButton .up::after,
	.moreButton .down::after { top: 13%; right:10%; }
}

.Area09 .PD_layout { margin: 0 auto; margin-bottom: 30px}
  @media screen and (max-width:767px){
	.Area09 { margin-bottom: 20px}
    .Area09 .PD_layout { width: 95%; margin-bottom: 5vw}
  }


.box01 {width:300px; float: left;}
  @media screen and (max-width:767px){
	.box01 {width:33%; }
  }

.Area_10{
	width: 1220px;
    height: 168px;
    position: relative;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 0 0 0 0;
}


.Area_10 ul{
	display: flex;
    flex-wrap: wrap;
    width: 1220px;
    align-items: flex-end;
    flex-direction: row;
    position: absolute;
    top: 60px;
    left: 0px;
    margin: 0;
    padding: 0;
    text-decoration: none;
    list-style: none;
    justify-content: center;
}


.fixbn {
    position: fixed;
    background-size: 100%;
    bottom: 0;
    display: block;
    z-index: 10;
}
.fixbn .class_01 {top: 0%;  left: 0%;}
.fixbn .class_00 {position: absolute; width: 100%; height: 100%;}
.fixbn .class_00 a {
    display: block;
    width: 100%;
    height: 100%;
}	
	

/*置底*/
@media screen and (max-width:767px){
	.Area_btn_fixed { position: fixed; width:100%; margin:0 auto; padding:0; background-size:100%; z-index: 9999; bottom: 0; /*box-shadow: 0 -4px 6px rgba(0,0,0,0.2); */}
    .Area_btn_fixed {
      height: 14vw;
      height: calc(14vw + constant(safe-area-inset-bottom) *0.6);/* 兼容 iOS < 11.2 */
      height: calc(14vw + env(safe-area-inset-bottom) *0.6);/* 兼容 iOS >= 11.2 */ 
      background: #000;
    }
	.Area_btn_fixed ul { width:100%; margin:0 auto; padding:0; display:inline-block;}
	.Area_btn_fixed ul li a { position:relative; font-size:4.5vw; width:100%;}
	.Area_btn_fixed ul li a img {  transition-duration: 0.2s;}
	.Area_btn_fixed ul li { margin:0 auto; width:100%; height:auto; list-style: none}
	.Area_btn_fixed ul li:hover { 
		animation: ease-in-out;
		-webkit-transform: none;filter:brightness(100%);
		-moz-transform: none;filter:brightness(100%);
		-ms-transform: none;filter:brightness(100%);
		-o-transform: none;filter:brightness(100%);
		transform: none;filter:brightness(100%);
	}

	/*純文字版
	.Area_btn_fixed ul li a { font-size:4.5vw; width:100%;}
	*/
}

/*隱鑶*/
.for_pc {}
.for_phone { display:none !important;}
	@media screen and (max-width:767px){
		.for_pc { display:none !important;}
		.for_phone { display: inherit !important;}
	}

/*彈窗通知數字大小*/
.swal2-content span { font-size: 1.3em;}


/*輪播物件*/
.Area_02 { position: relative; overflow: hidden;  margin: 0 auto 100px; border-radius: 20px; display: block;  }
.Area_02 .box { margin: 0 158px; width: 1100px;overflow: hidden}
.Area_02 .box .PD_layout ul.PD_wrapper{ margin:  0; padding: 0 0 20px 0;}
.Area_02 .box .PD_layout ul.PD_wrapper li{ width: 230px !important; margin: 0; padding: 0;}
@media screen and (max-width:767px){
	.Area_02 {margin-bottom: 20px; display: block;padding:0px; border-radius: 0px; background: rgba(255, 255, 255,0.0);-webkit-backdrop-filter: blur(0.0);backdrop-filter: blur(0.0);}
	.Area_02 .box { margin: 0; width: 101%;overflow: hidden}
	.Area_02 .box .PD_layout ul.PD_wrapper{ margin:  0; padding: 0 0 10% 0;}
	.Area_02 .box .PD_layout ul.PD_wrapper li{ width: 50% !important; margin: 0; padding: 0;}
}




.Area_send .reg_title {display:block; position:relative; margin: 28px auto 0 auto;}
.Area_send .btn_more {display:block; width: 117px; height: 54px; position:absolute; right:319px; top:118px; }
.Area_send ul {display: inherit; width:960px; position:relative; margin: 0 auto; padding:0; text-decoration:none; overflow:hidden; list-style:none; z-index:2; }
.Area_send ul li {display: inherit; padding:0; margin:0; text-decoration:none; display:block; list-style:none; float:left;}

.Area_send .txt1 {display:block ; position:absolute; left:465px; top:163px; z-index:9999; margin: 0 auto; font-family: "Century Gothic","Microsoft JhengHei","微軟正黑體", Arial, sans-serif; font-weight: bold;  line-height: 1.5; text-align: center;}

.Area_send .txt2 {display:block ; position:absolute; left:465px; top:753px; z-index:9999; margin: 0 auto; font-family: "Century Gothic","Microsoft JhengHei","微軟正黑體", Arial, sans-serif; font-weight: bold;  line-height: 1.5; text-align: center}

.txt1 p {width:120px;height:25px;border-radius:35px;text-align:center;color: #fff;}
.txt2 p {width:120px;height:25px;border-radius:35px;text-align:center;color: #fff;}

@media screen and (max-width:767px){
	.Area_send { height:100%;}	
	.Area_send .reg_title {display:block; position:relative; padding: 0vw 0;}
		}
		/*手機登記按鈕*/
            .book_box { position:relative;}
            .book_box a { display:block; width:100%; height:29vw;color:#fff; }
            .book_ { }
            .book_ .count { margin: 0;padding: 0;  color:#fff; text-align:center; font: bold 3vw/5vw "Century Gothic", Arial, "Microsoft JhengHei";}	

            /*1品*/		
            .book_01 { position:absolute;width:65%;  height: 25.5%;  top: 0vw;left:0vw; }
            .book_01 .count { position: absolute;  top: 315.5%; left:69%;}
            .post { position:absolute; width:35%;  height: 16.75%;  top: 1vw; left:64%;}
            .list { position:absolute; width:35%;  height: 15.75%;  top: 15vw;left:64%; }

            .event_02 { position:absolute; width:100%;  height: 50.5%;  top: 50.5%;left:0%; }
            .event_03 { position:absolute; width:50%;  height: 50.5%;  top: 50.5%;left:51%; }
            .event_04 { position:absolute; width:100%;  height: 28.5%;  top: 0; left:0; }

            .book_05 { position:absolute;width:100%;  height: 27%;  top: 71%;left:0vw; z-index:-1; }
            .book_05 .count2 { position: absolute;  top: 88.5%; left:69%; color:#fff; text-align:center; font: bold 3vw/5vw "Century Gothic", Arial, "Microsoft JhengHei";}
            .post2 { position:absolute; width:35%;  height: 13.75%;  top: 71%; left:65%;}
            .list2 { position:absolute; width:35%;  height: 13%;  top: 84.9%;left:65%; }

            /*2品*/	
            .book_box2 .book_01 { position:absolute;width:69%;  height: 100%;  top: -1vw;left:4vw; }
            .book_box2 .book_01 .count { position: absolute; top: 66.5%; left:70%;}
            .book_box2 .book_02 { position:absolute;width:34.38%;  height: 100%;  top:0;left:37%;  }
            .book_box2 .book_02 .count {  position: absolute; top: 87.5%; left:32%;}
            .book_box2 .post { position:absolute; width:33%;  height: 50%;  top: 0; left:63%;}
            .book_box2 .list { position:absolute; width:33%;  height: 80%;  top: 6%;left:73%; }

            /*3品*/	
            .book_box3 .book_01 { position:absolute;width:34.50%;  height: 75%;  top: 0vw;left:0vw; }
            .book_box3 .book_01 .count { position: absolute; top: 88.5%; left:36%;}
            .book_box3 .book_02 { position:absolute;width:31.0%;  height: 75%;  top:0;left:35%;  }
            .book_box3 .book_02 .count {  position: absolute; top: 88.5%; left:27%;}
            .book_box3 .book_03 { position:absolute;width:34.50%;  height: 75%;  top:0;left:66%;  }
            .book_box3 .book_03 .count {  position: absolute; top: 88.5%; left: 22%;}
            .book_box3 .post { position:absolute; width:50%;  height: 25%;  top: 75%; left:0%;}
            .book_box3 .list { position:absolute; width:50%;  height: 25%;  top: 75%; left:50%; }