.title01{ font-size: 50px; font-weight: bold; line-height: 1.5em; margin-bottom:20px;}
        .title02 { font-size: 30px; line-height: 1.2em; display: block; }
        .red{color:#d41a19;}

        .pc{ display: block; width:100%;}
        .mb{display:none;}
        .box{position:relative; width:100%; text-align:center;} 
        .flex { display: flex;  flex-wrap: wrap; }
        .flex-column{flex-direction:column;}

        .title-img{width:90%; max-width:1200px; margin:0 auto; }
        .box-s{width:90%; max-width:1500px; margin:20px auto;}
        .box-s .title01{ text-align:center;}

        .box p, .box-s p{font-size:21px; line-height:30px; text-align:center; margin-bottom:10px;}
        .bg_color{background:#e6c0c3;}

        @media only screen and (max-width: 1200px) {
          .title01{ font-size: 40px;}
          .box p, .box-s p{font-size:18px; line-height:28px;}
        }


        @media only screen and (max-width: 798px) {
            .pc{display:none;}
            .mb{ display: block; width:100%;}
            .title01{ font-size: 30px; font-weight: bold; line-height: 1.5em;}
            .title02 { font-size: 20px; line-height: 1.2em; display: block; }
            .box-s{margin:10px auto;}
			

            .title_img{min-width: 85px; margin:auto;}
            .box-s{width:95%; max-width:600px;}
            .box p, .box-s p{font-size:13px; line-height:25px;}  

        }


       .banner-container {
          position: relative;
          width: 100%;
          height: 100%;
          margin: 0;
          padding: 0;
        }

       .banner{width:100%; height:100%; padding:0; margin:0;}
       .banner .machine-img{position:absolute; width:30%; bottom:0%; left:35%;}

       .main-title-box{position:absolute; width:25%; top:14%; left:28%; z-index:1}
       .main-title-box .sakura-1{width:15%; top:10%; left:0%;}
       .main-title-box .sakura-2{width:20%; top:30%; left:90%;}

       .robot-group{ width:30%; height: 100%; top:0; bottom:0; left:35%;}
       .robot-group .poketomo-img{position:absolute; width:36%; top: 52%; left:32%;  }
       .robot-group .sub-badge{position:absolute; width:80%; top:21%; left:51%; z-index:-1;  }

        /* 初始隱藏狀態，交給 jQuery / CSS 動畫控制 */
        .title-bubble, .robot-group, .item, .sakura {
            position: absolute;
            opacity: 0;
        }
        /* 懸浮連續動畫 (CSS Animation) */
        @keyframes float {
          0% { transform: translateY(0px); }
          50% { transform: translateY(-8px); }
          100% { transform: translateY(0px); }
        }

        @keyframes pulse {
          0% { transform: scale(1); }
          50% { transform: scale(1.05); }
          100% { transform: scale(1); }
        }

        .floating {
          animation: float 3s ease-in-out infinite;
        }

        .pulsing {
          animation: pulse 2s ease-in-out infinite;
        }

        /* Hover 放大效果 */
        .item, .robot-group {
          transition: transform 0.3s ease, filter 0.3s ease;
          cursor: pointer;
        }

        .item:hover {
          transform: scale(1.05) !important;
          filter: drop-shadow(0px 8px 15px rgba(0,0,0,0.15));
        }

        @media only screen and (max-width: 798px) {
          .banner .machine-img{width:36%; bottom:53%; left:32%;}
          .main-title-box{width:35%; top:0%; left:19%;}
          .robot-group .poketomo-img{width:50%; top:22%; left:25%;  }
          .robot-group .sub-badge{width: 100%; top:5%; left:51%; }

        }







			.box2 .title{position:relative; z-index:1;}

			.box2 .title{color:#f5e929; text-align:center; font-size:70px; line-height:1.5em; margin-bottom:20px;}
			.box_info .info .title01{color:#fff; margin-bottom:10px; text-align:left; font-size:35px;}
			.box_img{width:90%; max-width:1500px; margin:0px auto;}
			.box_info{margin:0px auto 20px auto; width:100%; }
			.box_info li{margin-bottom:20px;}
			.box_info .info_img{width:50%; background:#fff; align-items:center;}

			.box_info .info{width:50%; padding:20px 40px; color:#fff; background:#404a4c; box-sizing:border-box; align-content:flex-start;flex-direction:column; }
			.box_info .info p{text-align:left; font-size:17px; }

			.bottom{ display:flex; background:#fff; text-align:center; border-radius:50px; margin:10px auto; padding:20px; font-size:30px; width:calc(50% - 20px); justify-content:center; box-sizing:border-box; }
			.bottom a{color:#024287; width:100%; height:100%; }


			.box3 .box_info .info{background:#2fa0a5;}
			.box4 .box_info .info{background:#c0b7a8;}
			.box5 .box_info .info{background:#819bca;}
			.box6 .box_info .info{background:#d8437b;}
			.box7 .box_info .info{background:#54b4dc;}
			.box8 .box_info .info{background:#063367;}
			.box9 .box_info .info{background:#b780bf;}
			.box10 .box_info .info{background:#80aebf;}
			.box11 .box_info .info{background:#9eceb9;}


			@media only screen and (max-width: 798px) {
				.box2 .title{font-size:40px; margin-top:-10px;}
				.box_img{width:100%;}
                .box_info .info_img, .box_info .info{width:100%;}
				.box_info .info{padding:10px 20px; flex-direction :row; align-items:center;}
				.box_info .info .title01{width:100%; font-size:23px; margin-bottom:10px;}
				.box_info .info p{align-items:center; width: calc(100% - 45px); font-size:15px; margin-bottom:0px;}
                .box_info .info p:first-of-type{width:40px;}
                .bottom{width:80%;}
			}

		.Notice ul li{list-style-type: decimal-leading-zero;}
		.Notice ul li ol>li{list-style-type:none;}
		.Notice table{width:50%; text-align:center;}
		.Notice table thead tr td{background:#e6c0c3; color:#fff;}
		.Notice table, .Notice th, .Notice td{ border: 1px solid #ccc;}
        @media only screen and (max-width: 798px) {
			.Notice table{width:100%;}
        }