div.ClassCat2018 a:link,div.ClassCat2018 a:visited {color:#A00;font-weight:bold;}
div.ClassCat2018 a:hover {color:#A00;font-weight:bold;font-size:22px;line-height:44px;}

/** ClassCat 為 Mdl 2024 咖啡教學介紹Small 用 **/
div.ClassCat2024 {
    vertical-align: top;
    width: 145px;
    height: 135px;
    display: inline-block;
    zoom: 1;
    margin: 2px;
    text-align: center;
    font-size: 18px;
    font-weight: bold;
    font-family: "微軟正黑體";
    line-height: 22px;
}
div.ClassCat2024 img {
    width: 88%;
}
div.ClsCatSmall {
    padding: 5px;
    background: #efefef;
    margin-top: 50px;
    text-align: center;
}
div.ClsCatSmall h3 {
    font-size: 2.7rem;
    line-height: 3.2rem;
}
/** ClassCat 為 Mdl 2024 咖啡教學介紹Small 用 **/

div.class2024 h3.Pre-Hd {
   background-color: #c2af8f;
   line-height: 4.2rem;
   width: 4.2rem;
   display: inline-block;
}
div.class2024 h3.class2024Hd {
   background-color: #1d2087;
   line-height: 4.2rem;
   color: #FFFFFF;
   display: inline-block;
   padding-left: 20px;
}

div.class2024Right {
   line-height: 4.2rem;
   display: inline-block;
      width: 90%;
}
div.class2024Right B.sub1 {
   line-height: 6rem;
   background-color: #c2af8f;
   padding: 8px 30px;
}
div.class2024Right B.sub2 {
   color: #e40210;
}
div.class2024Right div.classDesc2024 {
   padding-left: 30px;
}
div.class2024Right div.classInfo2024 {
   width: 100%;
   background-color: #dcdcdc;
   padding: 8px 0px 8px 30px;
   margin-top: 40px;
}
div.class2024Right img.Btm {
   width: 100%;
   margin-top: 80px;
}
@media screen and ( min-width:  973px) {
   div.class2024 h3.class2024Hd {
      width: 82%;
   }
   div.class2024Right {
      width: 63%;
      margin-left: 35px;
   }
}
@media screen and ( max-width:  972px) and ( min-width:  870px){
   div.class2024 h3.class2024Hd {
      width: 78%;
   }
   div.class2024Right {
      margin-left: 35px;
   }
}
@media screen and ( max-width:  870px) and ( min-width: 760px){
   div.class2024 h3.class2024Hd {
      width: 72%;
   }
   div.class2024Right {
      margin-left: 30px;
   }
}
@media screen and ( max-width:  760px) and ( min-width: 600px){
   div.class2024 h3.class2024Hd {
      width: 68%;
   }
   div.class2024Right {
      margin-left: 20px;
      font-size: 1.6rem;
   }
}
@media screen and ( max-width:  600px) and ( min-width: 540px) {
   div.class2024 h3.class2024Hd {
      width: 60%;
   }
   div.class2024Right {
      margin-left: 15px;
      font-size: 1.6rem;
      width: 96%;
   }
}
@media screen and ( max-width: 540px) {
   div.class2024 h3.class2024Hd {
      width: 50%;
      font-size: 2rem;
      padding-left: 10px;
   }
   div.class2024Right {
      margin-left: 10px;
      font-size: 1.6rem;
      width: 98%;
   }
}
