@charset "UTF-8";
div img{    width: 100%;display: block; margin: auto;}
table{width: 100%;}
section{padding-bottom: 3em;padding-top:0em;}
a,a *{transition: all .15s ease-in-out;color: inherit;}
#page {overflow: hidden;position: relative;}
#page article{max-width: 900px;margin: auto;}
.Vname{position: relative;color: transparent;}
.Vname:before{
position: absolute;
content: "○";
left: 0;
color: initial;
visibility: visible;
}
.rounded-2xs{border-radius: 0.5em;}
.rounded-xs{border-radius: 0.8em;}
.rounded-1x{border-radius: 1em;}
.rounded-2x{border-radius: 2em;}
.rounded-3x{border-radius: 3em;}
.rounded-4x{border-radius: 4em;}
/*-----------------------------------------按鈕-----------------------------------------*/
/*留單按鈕 OR 前往各班按鈕*/
.go_btn,.more_btn,#askLine{
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    display: inline-block;
    outline: 0;
    line-height: 1.25;
    vertical-align: middle;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    text-align: center;
    transition: all .15s ease-in-out;
}
.more_btn{
    background-color: #01c0a4;
    color: #002F66;
    padding: 0em 1.25em 0.25em;
    margin: 0.75rem auto 1em;
    border-radius: 2em;
    border: 0.25em solid #FFEB3B;
    border-image: url(../images/page2-btn-01.png)50 55 55 50/5em/0.25em round;
    border-image-outset: 0.25em;
    position: relative;
}
.more_btn.red{
    color: yellow;
    border-image: url(../images/page2-btn-02.png)50 55 55 50/5em/0.25em round;
}
.more_btn.blue{
    background-color: #3f91c9;
    border-image: url(../images/page2-btn-03.png)50 55 55 50/5em/0.25em round;
}
.more_btn.yellow{
    background-color: #f8db53;
    border-image: url(../images/page2-btn-04.png)50 55 55 50/5em/0.25em round;
}

.more_btn:hover,#btns .btn:hover,.go_btn:hover{
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
}

/*各班按鈕*/
.go_btn{
    display: inline-block;
    padding: 0.25em 0.5em;
    margin: 0.5em;
    color: #fff;
    background-color: #01c0a4;
    border-radius: 1em;
    border:0.25em solid;
    border-image: url(../images/page2-button.png)50/5em/0.25em round;
}
.go_btn:hover{
    text-shadow: 0 0 0.25em rgb(255 235 59 / 0.75), 0 0 0.5em rgb(255 235 59 / 0.75);
    box-shadow: 0 0 0.1em 0.1em #e8d922, 0.125em 0.125em 0.5em rgba(255,255,255,1);
}
/*底部滑動橫條*/
#bottom{
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 10000;
    text-align: center!important;
}
#goTop{position: fixed;bottom: 1em;right: 1em;width: 3em;height: 3em;padding: 0.5em;}

/*下方line@群組*/
#line-btns{padding: 0.5em 0;}
#line-btns a {
    font-weight: bolder;
    padding: 0.2em 0.5em;
    color: #5F5D5D;
    white-space: nowrap;
    border-radius: 0.25em;
}
#line-btns a.for{background-color: #004477;    color: #fff;}
#line-btns a:hover { background-color: #fff000;    color: black;}
#line-btns a{ background-color: #00C300;    color: #fff;}
#line-btns a:before{ content: "line";}
#line-btns a.for:before{ content: "";}

@media screen and (max-width:576px){
    #line-btns a {font-size: 0.75em;text-align:left;}
}
#askLine {
    color: #fff;
    background-color: #4CAF50;
    line-height: 1;
    position: fixed;
    top:40vh;    right: 0.5em;
    padding: 0.5em;
    border-radius: 1em 0;
}
/*nav 頂端目錄*/
#navbarDropdownLINE{
    width: 3.5em;
    height: 3.5em;
    font-size: 0.75em;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: green;
    color: white;
    border:none;
    text-shadow: 0 0 0.25em rgb(255 235 59 / 0.75), 0 0 0.5em rgb(255 235 59 / 0.75);
        position: fixed;
    top: 0.5em;
    right: 0.5em;
}
*[aria-labelledby="navbarDropdownLINE"]{
    right: 0;left: inherit;
}
/*頂端目錄 滑過效果*/
.navbar>.container{width: calc(100% - 4em)}
.navbar-dark .navbar-nav .nav-link, .navbar-dark .navbar-nav .nav-link {
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .active>.nav-link, .navbar-dark .navbar-nav .nav-link.active, .navbar-dark .navbar-nav .nav-link.show, .navbar-dark .navbar-nav .show>.nav-link{
    position: relative;
    color: #fff;
    background-color: #01c0a4;
    border-radius: 1em;
    border:0.1em solid;
    border-image: url(../images/page2-button.png)75/6em/0.1em round;
    text-shadow: 0 0 0.25em rgb(255 235 59 / 0.75), 0 0 0.5em rgb(255 235 59 / 0.75);
}
.navbar-dark .navbar-nav .nav-link:focus:before, .navbar-dark .navbar-nav .nav-link:hover:before{
    position: absolute;
    content: "";
    width: 100%;
    height:8px;
    bottom: -0.75em;
    left: 0;
    border-bottom: 0.25em solid #01c0a4;
    text-shadow: 0 0 0.25em rgb(255 235 59 / 0.75), 0 0 0.5em rgb(255 235 59 / 0.75);
    transform: scale(0.8);
}

/*-------------------------------------END-按鈕-----------------------------------------*/
/*-----------------------------------------顏色-----------------------------------------*/
/* Colors */
.amber,.hover-amber:hover{color:#000!important;background-color:#eaae4e!important}
.aqua,.hover-aqua:hover{color:#000!important;background-color:#00ffff!important}
.blue,.hover-blue:hover{color:#fff!important;background-color:#2b9ad8!important}
.light-blue,.hover-light-blue:hover{color:#000!important;background-color:#87CEEB!important}
.brown,.hover-brown:hover{color:#fff!important;background-color:#42210b!important}
.cyan,.hover-cyan:hover{color:#000!important;background-color:#00ffff!important}
.blue-grey,.hover-blue-grey:hover,.blue-gray,.hover-blue-gray:hover{color:#fff!important;background-color:#607d8b!important}
.green,.hover-green:hover{color:#fff!important;background-color:#009245!important}
.light-green,.hover-light-green:hover{color:#000!important;background-color:#8bc34a!important}
.indigo,.hover-indigo:hover{color:#fff!important;background-color:#002f66!important}
.khaki,.hover-khaki:hover{color:#000!important;background-color:#f0e68c!important}
.lime,.hover-lime:hover{color:#000!important;background-color:#cddc39!important}
.orange,.hover-orange:hover{color:#000!important;background-color:#ff9800!important}
.deep-orange,.hover-deep-orange:hover{color:#fff!important;background-color:#e04c3d!important}
.pink,.hover-pink:hover{color:#fff!important;background-color:#db4f58!important}
.purple,.hover-purple:hover{color:#fff!important;background-color:#9c27b0!important}
.deep-purple,.hover-deep-purple:hover{color:#fff!important;background-color:#673ab7!important}
.red,.hover-red:hover{color:#fff!important;background-color:#c1272d!important}
.sand,.hover-sand:hover{color:#000!important;background-color:#fdf5e6!important}
.teal,.hover-teal:hover{color:#fff!important;background-color:#01c0a4!important}
.yellow,.hover-yellow:hover{color:#000!important;background-color:#ffeb3b!important}
.white,.hover-white:hover{color:#000!important;background-color:#fff!important}
.black,.hover-black:hover{color:#fff!important;background-color:#231815!important}
.grey,.hover-grey:hover,.gray,.hover-gray:hover{color:#000!important;background-color:#bbb!important}
.light-grey,.hover-light-grey:hover,.light-gray,.hover-light-gray:hover{color:#000!important;background-color:#f1f1f1!important}
.dark-grey,.hover-dark-grey:hover,.dark-gray,.hover-dark-gray:hover{color:#fff!important;background-color:#616161!important}
.pale-red,.hover-pale-red:hover{color:#000!important;background-color:#f28270!important}
.pale-orange,.hover-pale-orange:hover{color:#000!important;background-color:#FCF2E9!important}
.pale-green,.hover-pale-green:hover{color:#000!important;background-color:#ddffdd!important}
.pale-yellow,.hover-pale-yellow:hover{color:#000!important;background-color:#efe4a0!important}
.pale-blue,.hover-pale-blue:hover{color:#000!important;background-color:#ddffff!important}
.text-red,.hover-text-red:hover{color:#c1272d!important}
.text-green,.hover-text-green:hover{color:#009245!important}
.text-blue,.hover-text-blue:hover{color:#2b9ad8!important}
.text-yellow,.hover-text-yellow:hover{color:#ffeb3b!important}
.text-white,.hover-text-white:hover{color:#fff!important}
.text-black,.hover-text-black:hover{color:#231815!important}
.text-grey,.hover-text-grey:hover,.text-gray,.hover-text-gray:hover{color:#757575!important}
.text-amber,.hover-text-amber:hover{color:#eaae4e!important}
.text-aqua,.hover-text-aqua:hover{color:#00ffff!important}
.text-light-blue,.hover-text-light-blue:hover{color:#87CEEB!important}
.text-brown,.hover-text-brown:hover{color:#42210b!important}
.text-cyan,.hover-text-cyan:hover{color:#00ffff!important}
.text-blue-grey,.text-blue-gray,.hover-text-blue-grey,.text-blue-gray:hover{color:#607d8b!important}
.text-light-green,.hover-text-light-green:hover{color:#8bc34a!important}
.text-indigo,.hover-text-indigo:hover{color:#002f66!important}
.text-khaki,.hover-text-khaki:hover{color:#b4aa50!important}
.text-lime,.hover-text-lime:hover{color:#cddc39!important}
.text-orange,.hover-text-orange:hover{color:#ff9800!important}
.text-deep-orange,.hover-text-deep-orange:hover{color:#e04c3d!important}
.text-pink,.hover-text-pink:hover{color:#db4f58!important}
.text-pale-red,.hover-text-pale-red:hover{color:#f28270!important}
.text-pale-orange,.text-hover-pale-orange:hover{color:#FCF2E9!important}
.text-pale-green,.text-hover-pale-green:hover{color:#ddffdd!important}
.text-pale-yellow,.text-hover-pale-yellow:hover{color:#efe4a0!important}
.text-pale-blue,.text-hover-pale-blue:hover{color:#ddffff!important}

.text-purple,.hover-text-purple:hover{color:#9c27b0!important}
.text-deep-purple,.hover-text-deep-purple:hover{color:#673ab7!important}
.text-sand,.hover-text-sand:hover{color:#fdf5e6!important}
.text-teal,.hover-text-teal:hover{color:#01c0a4!important}
.text-light-grey,.hover-text-light-grey:hover,.text-light-gray,.hover-text-light-gray:hover{color:#f1f1f1!important}
.text-dark-grey,.hover-text-dark-grey:hover,.text-dark-gray,.hover-text-dark-gray:hover{color:#3a3a3a!important}
.border-red,.hover-border-red:hover{border-color:#c1272d!important}
.border-green,.hover-border-green:hover{border-color:#009245!important}
.border-blue,.hover-border-blue:hover{border-color:#2b9ad8!important}
.border-yellow,.hover-border-yellow:hover{border-color:#ffeb3b!important}
.border-white,.hover-border-white:hover{border-color:#fff!important}
.border-black,.hover-border-black:hover{border-color:#231815!important}
.border-grey,.hover-border-grey:hover,.border-gray,.hover-border-gray:hover{border-color:#757575!important}
.border-amber{border-color:#eaae4e!important}
.border-aqua{border-color:#00ffff!important}
.border-light-blue{border-color:#87CEEB!important}
.border-brown{border-color:#42210b!important}
.border-cyan{border-color:#00ffff!important}
.border-blue-grey,.border-blue-gray{border-color:#607d8b!important}
.border-light-green{border-color:#8bc34a!important}
.border-indigo{border-color:#002f66!important}
.border-khaki{border-color:#b4aa50!important}
.border-lime{border-color:#cddc39!important}
.border-orange{border-color:#ff9800!important}
.border-deep-orange{border-color:#e04c3d!important}
.border-pink{border-color:#db4f58!important}
.border-pale-red{border-color:#f28270!important}
.border-pale-orange,.border-hover-pale-orange:hover{border-color:#FCF2E9!important}
.border-pale-green,.border-hover-pale-green:hover{border-color:#ddffdd!important}
.border-pale-yellow,.border-hover-pale-yellow:hover{border-color:#efe4a0!important}
.border-pale-blue,.border-hover-pale-blue:hover{border-color:#ddffff!important}
.border-purple{border-color:#9c27b0!important}
.border-deep-purple{border-color:#673ab7!important}
.border-sand{border-color:#fdf5e6!important}
.border-teal{border-color:#01c0a4!important}
.stroke-black{
    text-shadow: 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black, 0 0 0.125em black;
}
.stroke-white{
    text-shadow: 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white, 0 0 0.125em white;
}
.stroke-blue{
    text-shadow: 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087, 0 0 0.125em #1D2087;
}
.stroke-indigo{
    text-shadow: 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464, 0 0 0.125em #1b1464;
}
.stroke-cyan {
    text-shadow: 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2, 0 0 0.125em #31abe2;
}
.stroke-orange{
    text-shadow: 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B, 0 0 0.125em #FBB03B;
}
.stroke-yellow{
    text-shadow: 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100, 0 0 0.125em #fff100;
}
.stroke-red{
    text-shadow: 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d, 0 0 0.125em #c1272d;
}
.round{border-radius: 0.5em;}
/*-------------------------------------END-顏色-----------------------------------------*/
body{background-color: #002f66;color: #fff}
#a01{background-color: #6480bc;}
#a04{background-color: #01c0a4;color: #fff}
#a05{background: url(../images/page2-05-BG.png)left bottom/100% no-repeat fixed  #6480bc;}

/*----------------------------------------- BAN區塊-----------------------------------------*/
#ban{
    background: linear-gradient(354deg, #6480bc 37%, transparent 37%)bottom right/100% no-repeat;
    margin-bottom: -3em;
}
@media screen and (max-width:576px){
#ban img{transform: scale(1.25);transform-origin: top}
}
/*-------------------------------------END-BAN區塊-----------------------------------------*/

*[title="學儒保成"]{
    display: inline-block;
    color: rgba(255,255,255,0.1);
    background: url(../images/page2-學儒保成.png)center/contain no-repeat;
}
/*----------------------------------------- 區塊a01 -----------------------------------------*/
#a01 .title {
    display: inline-block;
    background: url(../images/page2-01-title-BG.png)bottom center/contain no-repeat;
    padding:1em 1em 0.25em;
}
#a01 .title .t1,#a01 .title .t2,.timg>*{
    display: inline-block;
    color: rgba(255,255,255,0.1);
    background: url()center/contain no-repeat;
}
#a01 .title .t1{background-image: url(../images/page2-01-title-1.png);transform: rotate(-15deg);    transform-origin: left;}
#a01 .title .t2{background-image: url(../images/page2-01-title-2.png);}
#a01 .timg .t1{background-image: url(../images/page2-01-t1.png);color: rgba(255,255,255,0.05)}
#a01 .timg .t2{background-image: url(../images/page2-01-t2.png);color: rgba(255,255,255,0.05)}
#a01 .timg .t3{background-image: url(../images/page2-01-t3.png);color: rgba(255,255,255,0.05)}
#a01 .round{
    display: inline-block;
    border:0.25em solid;
    border-image: url(../images/page2-border-05.png)100/3em round;
}
#a01-1{max-width: 600px;margin:0 auto 1em;}
#a01 .text-yellow,#a02 .title-icon{
    display: inline-block;
    padding: 0 1.25em;
    background: url(../images/page2-01-icon.png)left center/1em no-repeat,url(../images/page2-01-icon.png)right center/1em no-repeat;
}
#a01 .Tbox{max-height: 50vh;overflow: hidden;}
#a01 .Tbox p{
    margin:0.5em;
    line-height: 1em;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
#a01 .Tbox p>span{margin:0.25em;}
#a01 .Tbox p .category{max-width: 4em;text-align: left;}

#a01 .Tbox .move{
    padding-top: 2em;
    animation-name: marquee;
    animation-iteration-count:infinite;    /*設定動畫循環播放*/
    animation-duration: 120s;
    -webkit-animation-duration: 120s;
    animation-timing-function: linear;
    /*transform: translateY(calc(-50% + 50vh ));*/
}
#a01 .Tbox .move:hover{animation-play-state: paused;}
@keyframes marquee {
  from {
    transform: translateY(0);
  }

  to {
    transform: translateY(-50%);
  }
}
/*-------------------------------------END- 區塊a01 -----------------------------------------*/
/*----------------------------------------- 區塊a02 -----------------------------------------*/
#a02 .title {
    display: inline-block;
    background: url(../images/page2-02-title-BG.png)bottom center/contain no-repeat;
    padding:1em 1em 0.25em;
}
#a02 .title .t1{
    display: inline-block;
    color: rgba(255,255,255,0.1);
    background: url(../images/page2-02-title-1.png)center/contain no-repeat;
}
#a02-1 {max-width: 700px;margin:auto;}
#a02-1 .teal{
    max-width: 30%;
    min-width: 12em;
    width: 20em;
    background-color: #01c0a4!important;
    padding: 1em 0em 4em;
    margin: 0.75em auto;
    border-radius: 3em;
    border: 0.25em solid #FFEB3B;
    border-image: url(../images/page2-border-02.png)200/5em round;
    position: relative;
    background: url(../images/page2-02-1.png)center bottom/6em no-repeat;
}
#a02-1 .teal[title="薪資高"]{background-image: url(../images/page2-02-1.png);}
#a02-1 .teal[title="門檻低"]{background-image: url(../images/page2-02-2.png);}
#a02-1 .teal[title="錄取高"]{background-image: url(../images/page2-02-3.png);}
#a02-1 .teal[title="超穩定"]{background-image: url(../images/page2-02-4.png);}
#a02-1 .teal[title="晉升易"]{background-image: url(../images/page2-02-5.png);}

#a02 .title-icon{
    background: url(../images/page2-02-icon.png)left center/1em no-repeat,url(../images/page2-02-icon.png)right center/1em no-repeat;
}
#a02-2 .red.round{
    padding: 0.25em;
    border-radius: 3em;
    border: 0.25em solid #FFF;
    border-image: url(../images/page2-border-02-2.png)50/1em round;
    border-image-outset: -2em;
    position: relative;
}
#a02-2 ul{margin-left: 0.5em;}
#a02-2 li{    list-style: "★ ";}
#a02-2 .more_btn{border-image-width: 0.5em;}

/*-------------------------------------END- 區塊a02 -----------------------------------------*/
/*----------------------------------------- 區塊a03 -----------------------------------------*/
#a03 .title{background: #6480BC}
#a03 .title>*:first-child{
    display: inline-block;
    margin:0;
    padding: 0.25em 2em 0.25em 0.25em;
    background: url(../images/page2-03-title.png)top 0.25em right/ 2em no-repeat;
}

#a03-2 .img{
    padding: 5em;
    margin:-1em -5em 0 -3em;
    background: url(../images/page2-03-box.png)center/contain no-repeat;
    position: relative;
}
#a03-2 .img:before{
    position: absolute;
    content: "";
    width: 5em;
    height: 100%;
    left:-2em;
    bottom: 0;
    background: url(../images/page2-03-1.png)right/contain no-repeat;
}
/*-------------------------------------END- 區塊a03 -----------------------------------------*/
/*----------------------------------------- 區塊a04 -----------------------------------------*/
#a04 .title{background: #171c61;color: white;}
#a04 .title>.d-flex{
    padding:0.75em 2.25em;
    max-width: 800px;
    margin:0 auto 1em;
    background: url(../images/page2-01-icon.png)left 0.5em center/2em no-repeat,url(../images/page2-01-icon.png)right 0.5em center/2em no-repeat;
}
.experience .text-red{
    width: 6em;
    height: 8em;
    display: flex;
    justify-content: center;
    align-items: center;
    background: url(../images/page2-04-1-1.png)center/contain no-repeat;
}
.experience .img{
    display: inline-block;
    padding-right: 1.25em;
    background: url(../images/page2-04-1-icon.png)right center/1em no-repeat;
}
#a04-2 .title2{
    display: inline-block;
    padding: 2em;
    margin:-1em -2em;
    background: url(../images/page2-04-2-title-BG.png)center/contain no-repeat;
    position: relative;
}
#a04 .col-4.px-2{
    max-width: 15em;
}
#a04-3 .indigo{
    border-radius: 1em;
    padding: 0 0.25em;
    border: 0.25em solid #FFEB3B;
    border-image: url(../images/page2-border-04-3.png)50/2em/0.1em round;
}
#a04-4 .yellow{
    border-radius: 1em;
    border: 0.25em solid #FFEB4B;
    border-image: url(../images/page2-border-04-4.png)50/2em/0.1em round;
}
/*-------------------------------------END- 區塊a04 -----------------------------------------*/
/*----------------------------------------- 區塊a05 -----------------------------------------*/
#a05 .t1,#a05 .t2,#a05 .t3{
    color: rgba(255,255,255,0.025);
}
#a05 .t1{background-image: url(../images/page2-05-t1.png);}
#a05 .t2{background-image: url(../images/page2-05-t2.png);}
#a05 .t3{background-image: url(../images/page2-05-t3.png);}

#a05 .round{
    min-width: 7em;
    border: 0.25em solid #FFEB3B;
    border-image: url(../images/page2-border-05.png)100/5em/0.25em round;
    position: relative;
}
#a05 .round+div{
    width: 20em;
}
#a05 .img{
    height: 50vh;
    max-height: 300px;
    background: url(../images/page2-05-1.png)bottom center/contain no-repeat;
}
@media screen and (max-width:576px){
    #a05 .img{
        max-height: 200px;
        transform: scale(1.75);
        transform-origin: bottom center;
    }
}
/*-------------------------------------END- 區塊a05 -----------------------------------------*/
/*----------------------------------------- 區塊a06 -----------------------------------------*/
#a06 .t1,#a06 .t2{
    color: rgba(255,255,255,0.025);
    background: url()center/contain no-repeat;
}
#a06 .t1{background-image: url(../images/page2-06-title-1.png);}
#a06 .t2{background-image: url(../images/page2-06-title-2.png);}
#a06 .white{
    min-width: 7em;
    border: 0.25em solid #FFEB3B;
    border-image: url(../images/page2-border-06.png)50/3em/1em round;
    position: relative;
    /*overflow: hidden;*/
}
#a06 .stroke-indigo{
    display: inline-block;
    padding: 1em 0 0.5em;
    background: url(../images/page2-icon-06.png)left 0.5em bottom/2.5em no-repeat;
}
#a06-1 .white{padding:0 5vw;}
#a06-1 img{
    transform: scale(1.125);
    transform-origin: bottom;
}
#a06-2 .white:before,#a06-3 .white:before{
    position: absolute;
    content: "";
    width: 10em;
    height: 9em;
    bottom: -0.5em;
    right: -0.5em;
    background: url(../images/page2-06-2.png)bottom right/contain no-repeat;
}
@media screen and (max-width:576px){
    #a06-2 .white{padding-bottom: 4em!important;}
}
#a06-3 .white:before{
    height: 4em;
    bottom: -1em;
    right: -4em;
    background: url(../images/page2-06-3.png)bottom right/contain no-repeat;
}

/*-------------------------------------END- 區塊a06 -----------------------------------------*/
/*----------------------------------------- 區塊a07 -----------------------------------------*/

/*-------------------------------------END- 區塊a07 -----------------------------------------*/
/*----------------------------------------- 區塊buttones -----------------------------------------*/


/*-------------------------------------END- 區塊buttones -----------------------------------------*/