@charset "UTF-8";
a { text-decoration: none !important; }

.wrapContent { max-width: 1400px; margin: 0 auto; padding: 0 15px; }

img { display: block; }

a { color: black; text-decoration: none; }

.white { width: 100%; background-color: white; border-radius: 10px; -webkit-box-shadow: 5px 5px 10px gray; box-shadow: 5px 5px 10px gray; padding: 60px 0; font-size: 22px; overflow: hidden; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-wrap: wrap; flex-wrap: wrap; }

@media (max-width: 500px) { .white { padding: 30px 0 15px; } }

.white .top { display: -webkit-box; display: -ms-flexbox; display: flex; text-align: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; margin-bottom: 30px; margin-right: 30px; font-weight: 500; -ms-flex-negative: 1; flex-shrink: 1; }

.white .top .left { padding-top: 60px; padding-right: 20px; }

.white .top .left img { -webkit-transform: rotateY(180deg); transform: rotateY(180deg); }

@media (max-width: 991.98px) { .white .top .left img { display: none; } }

.white .top .right { line-height: 1.5; display: inline-block; -webkit-box-shadow: 5px 5px 10px gray; box-shadow: 5px 5px 10px gray; border-radius: 20px 20px 20px 0; padding: 15px 30px; }

@media (max-width: 767.98px) { .white .top .right br { display: none; } }

.white .top .right span { color: lightseagreen; font-weight: 800; }

@media (max-width: 767.98px) { .white .top .right span { display: block; } }

.white .top .right span.arrow { display: inline-block; -webkit-transform: rotateZ(-90deg); transform: rotateZ(-90deg); }

@media (max-width: 1199.98px) { .white .top .right span.arrow { display: none; } }

@media (max-width: 500px) { .white .top { font-size: 18px; } }

.white .bottom { max-width: 600px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

.white .bottom .item { width: 170px; height: 188.5px; padding: 15px 0; -webkit-box-shadow: 1px 1px 0px 1px #047e00, 5px 5px 8px gray; box-shadow: 1px 1px 0px 1px #047e00, 5px 5px 8px gray; margin: 0 14px 28px; border-radius: 10px; background: linear-gradient(-50deg, #5AB02E 50%, #8ce461 100%); font-weight: 600; font-size: 22px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; position: relative; color: white; -webkit-transition: 0.4s ease; transition: 0.4s ease; }

@media (max-width: 500px) { .white .bottom .item { width: 150px; padding: 8px 0; } }

.white .bottom .item.defult::before { content: '預設'; position: absolute; background-color: red; top: -5px; right: 10px; color: white; padding: 2px 5px; border-radius: 5px; font-size: 16px; -webkit-box-shadow: 2px 2px 2px gray; box-shadow: 2px 2px 2px gray; }

.white .bottom .item img { width: 100px; height: 100px; border-radius: 50%; -o-object-fit: cover; object-fit: cover; margin: 0 auto; margin-bottom: 15px; border: 2px solid white; background-color: cornsilk; }

@media (max-width: 500px) { .white .bottom .item img { display: none; } }

.white .bottom .item .title { text-align: center; letter-spacing: 2px; position: relative; margin:0!important; color:white; }

.white .bottom .item .title::before { position: relative; padding-right: 10px; display: inline-block; content: '■'; color: greenyellow; -webkit-transform: translateY(-15%); transform: translateY(-15%); -webkit-transform-origin: 6px 15px; transform-origin: 6px 15px; }

.white .bottom .item .title::after { content: ''; position: absolute; display: block; height: 1px; width: 0; bottom: 0; left: 24px; background-color: yellow; }

.white .bottom .item .notice { margin-left: 10px; font-size: 16px; text-align: center; background-color: red; padding: 5px; border-radius: 5px; }

.white .bottom .item:hover { -webkit-transition: 0.4s ease; transition: 0.4s ease; -webkit-transform: translate(2px, 2px); transform: translate(2px, 2px); -webkit-box-shadow: none; box-shadow: none; }

.white .bottom .item:hover .title::before { color: yellow; z-index: -1; -webkit-transition: 0.4s ease; transition: 0.4s ease; -webkit-transform: translateY(-15%); transform: translateY(-15%); }

.white .bottom .item:hover .title::after { -webkit-transition: 0.6s ease; transition: 0.6s ease; width: calc(100% - 25px); }

@media (max-width: 500px) { .white .bottom .item { width: 100%; font-size: 18px; } }
/*# sourceMappingURL=style.min.css.map */