@charset "utf-8";
/*共用--區塊背景*/
  .Area_boxstyle {}
      @media screen and (min-width:768px){
          /*.Area_boxstyle > .Area_boxstyle_box { }*/
      }
      @media screen and (max-width:767px){
          .Area_boxstyle > .Area_boxstyle_box { width: 96%; margin: 0 auto;}
      }
      /*底圖*/
      .Area_boxstyle > .Area_boxstyle_box { position:relative; background-repeat: no-repeat; background-position: center bottom;}
      .Area_boxstyle > .Area_boxstyle_box:before { pointer-events: none; content:""; display:block; z-index:-1; position:absolute; left:0; width:100%; background-position: top center; background-repeat: no-repeat;}
      .Area_boxstyle > .Area_boxstyle_box:after  { pointer-events: none; content:""; display:block; z-index:0; position:absolute; top:0; left:0; width:100%; height:100%;  background-position: top center; background-repeat: no-repeat;}
      .Area_boxstyle > .Area_boxstyle_box > .Area_boxstyle_boxbg { pointer-events: none; position:relative; background-repeat: no-repeat; background-position: center bottom;}
      .Area_boxstyle > .Area_boxstyle_box > .Area_boxstyle_boxbg:before { content:""; display:block; z-index:-1; position:absolute; left:0; width:100%; background-position: top center; background-repeat: no-repeat;}
      .Area_boxstyle > .Area_boxstyle_box > .Area_boxstyle_boxbg:after  { content:""; display:block; z-index:0; position:absolute; top:0; left:0; width:100%; height:100%;  background-position: top center; background-repeat: no-repeat;}
          
		  
		   /*圖片模式*/
              @media screen and (min-width:768px){
    
                /*共用手機框*/
                .Area960.Area_boxstyle > .Area_boxstyle_box { margin-top: 0; padding-top: 0px; padding-bottom: 0px;}
                .Area960.Area_boxstyle > .Area_boxstyle_box:before { z-index: -1; top: 0px; height: 240px;}
                .Area960.Area_boxstyle > .Area_boxstyle_box:after { z-index: -2; top: 240px; height: calc(100% - 384px); background-repeat: repeat-y; background-position: center bottom;}
                .Area960.Area_boxstyle > .Area_boxstyle_box1 { background-image:url(m_Area_boxstyle_bottom1.png?t=1751271723997); }
                .Area960.Area_boxstyle > .Area_boxstyle_box1:before { background-image:url(m_Area_boxstyle_top1.png?t=1751271723997);}
                .Area960.Area_boxstyle > .Area_boxstyle_box1:after  { background-image:url(m_Area_boxstyle_center1.png?t=1751271723997);} 
                .Area960.Area_boxstyle > .Area_boxstyle_box2 { background-image:url(m_Area_boxstyle_bottom1.png?t=1751271723997); }
                .Area960.Area_boxstyle > .Area_boxstyle_box2:before { background-image:url(m_Area_boxstyle_top2.png?t=1751271723997);}
                .Area960.Area_boxstyle > .Area_boxstyle_box2:after  { background-image:url(m_Area_boxstyle_center1.png?t=1751271723997);} 
              }
              @media screen and (max-width:767px){
                .Area_boxstyle > .Area_boxstyle_box,
                .Area_boxstyle > .Area_boxstyle_box:before,
                .Area_boxstyle > .Area_boxstyle_box:after  { background-size: 100%;}
                .Area_boxstyle > .Area_boxstyle_box { margin-top: -0vw; padding-top: 6vw; padding-bottom: 6vw; min-height: 22vw;}
                .Area_boxstyle > .Area_boxstyle_box:before { top: -0vw; height: 25vw; }
                .Area_boxstyle > .Area_boxstyle_box:after { z-index: -2; top: 23vw; height: calc(100% - 41.5vw); background-repeat: repeat-y; background-position: center bottom;}
                .Area_boxstyle > .Area_boxstyle_box1 { background-image: url(m_Area_boxstyle_bottom1.png?t=1751271723997);}
                .Area_boxstyle > .Area_boxstyle_box1:before { background-image: url(m_Area_boxstyle_top1.png?t=1751271723997);}
                .Area_boxstyle > .Area_boxstyle_box1:after  { background-image: url(m_Area_boxstyle_center1.png?t=1751271723997);}
                .Area_boxstyle > .Area_boxstyle_box2 { padding-top: 13vw;}
                .Area_boxstyle > .Area_boxstyle_box2 { background-image: url(m_Area_boxstyle_bottom1.png?t=1751271723997);}
                .Area_boxstyle > .Area_boxstyle_box2:before { background-image: url(m_Area_boxstyle_top2.png?t=1751271723997);}
                .Area_boxstyle > .Area_boxstyle_box2:after  { background-image: url(m_Area_boxstyle_center1.png?t=1751271723997);}

                .Area_boxstyle > .Area_boxstyle_box0 { padding-top: 0; padding-bottom: 0;}
                .Area_boxstyle > .Area_boxstyle_box0:before { display: none;}
                .Area_boxstyle > .Area_boxstyle_box0:after { display: none;}
                .Area_boxstyle > .Area_boxstyle_box0 { background-image: none;}
                .Area_boxstyle > .Area_boxstyle_box0:before { background-image: none;}
                .Area_boxstyle > .Area_boxstyle_box0:after  { background-image: none;}
              }
      /*標題字*/
      .Area_boxstyle > .Area_boxstyle_title { z-index:2; position: absolute; top:0; left: 23%; margin:0; padding:0; overflow: hidden; width:54%; height: 80px; line-height: 80px;}
      .Area_boxstyle > .Area_boxstyle_title { font-size: 44px; text-align: center; color: #ffffff; text-shadow: 0.06em 0.06em 0.05em #515f9c }
      .Area_boxstyle > .Area_boxstyle_title { font-weight: 600; font-family: "Noto Sans TC","Hiragino Sans","微軟正黑體", system-ui, Helvetica, Arial;}
          @media screen and (max-width:767px){
            .Area_boxstyle > .Area_boxstyle_title { height: 8vw; font-size: 5.6vw; line-height: 8vw; letter-spacing: -0.05em; }
          }
      /*標題圖*/
      .Area_boxstyle > .title {  z-index: 10; position: absolute;}
          @media screen and (min-width:768px){
            .Area_boxstyle > .title { left: 50%; transform: translateX(-50%); width: 100%;}
          }
          @media screen and (max-width:767px){
            .Area_boxstyle > .title { }
          }