body, input:not(.is-checkradio):not(.feedback):not(.receiver-check), select {
	font-family: Microsoft JhengHei;
	min-height: 100%;
  	height: 100%;	
}
html.modal-active,
body.modal-active {
  	overflow: hidden;
  	height: calc(100vh - 3.25rem);
}
.bg-dark {
	background: #666;
}
.bg-cis-dark {
	background: #000;
}
.bg-pink {
	background: #d01347;
	color: white;
}
.bg-cis {
	background: #d01347!important;
}
.bg-beige{
	background: #faf7e8!important;
}

button {
	font-family: Microsoft JhengHei;
}
.modal .modal-card:not(.document-card) {
	width: calc(100% - 40px);
}
.button.bg-pink:active, 
.button.bg-pink:hover, 
.button.bg-pink:focus {
	color: #fff;
}
.button.bg-pink:active {
	background: #bd0758;
}
.button.bg-pink:disabled {
	background: #ccc;
	color: #333;
}
.has-text-red {
	color: #a60a22!important;
}
.has-text-pink {
    color: #d01347!important;
}
.has-text-coffee{
	color :#874622;
}
.has-text-dark-bluegreen{
	color :#0f92a5;
}
.h-auto {
	height: auto!important;
}
.logo-reed img {
	position: relative;
	top: -20px;
    max-height: 148px;
    width: auto;
}
.logo-reed {
    content: "";
    width: 100px;
    height: 130px;
	position: absolute;
    top: -37px;
    left: calc(50% - 50px);
    background: #d01347;
    text-align: center;
    transition: all 0.3s;
    transition-timing-function: cubic-bezier(1,-0.49,.13,1.09);
    z-index: 1;
}
.logo-reed:hover {
	cursor: pointer;
}
.logo-reed::before {
	position: relative;
	content: "";	
	display: block;
	border-style: solid;
	border-width: 0 50px 30px 50px;
	position: absolute;
	top:-30px;	
	left: 0px;
    border-color: transparent transparent #d01347 transparent;
}
.logo-reed.simplify::before {
	top: -29px;
}
#navbar-top {
	overflow: hidden;
    height: 67px;
    display: flex;
    align-items: center;
}
@media screen and (max-width: 1472px){	
	#navbar-top .container {
		max-width: unset;
	    margin-left: 20px;
	    margin-right: 20px;
	}
}
.navbar-brand {
	transition: all .3s;
}
.navbar-brand img {
	max-height: 67px;
}
.zindex31 {
	z-index: 31!important;
}
.main-navL {
	flex: 50%;
}
.main-navL>.navbar-item:last-child {
	margin-right: 75px;
}
.main-navR {
	flex: 50%;
}
.main-navR>.navbar-item:first-child {
	margin-left: 60px; 
}
.main-nav-wrap {
	top: 67px!important;
}
.has-dropdown .navbar-item:hover {
	color: #d01347!important;
}
#main-bd {
	background: white;
	position: relative;
	top: 67px;
	z-index: 1;
	padding-bottom: 2rem;
}
#cus-footer {
	margin-top: 67px;    
	z-index: 0;
    position: relative;
}
/*owl*/
.owl-dots {
	position: absolute;
    bottom: 30px;
    width: 100%;
}
.owl-nav {
	position: absolute;
    top: calc(50% - 158px);
    left: 0;
    display: flex;
    justify-content: space-between;
    width: 100%;
    font-size: 10rem;
    color: rgba(255, 255, 255, 0.5);
}
.owl-theme .owl-nav [class*=owl-]:hover {
	background: unset;
}
.owl-theme .owl-nav [class*=owl-]:focus {
	outline: none;
}
.owl-theme .owl-dots .owl-dot span {
	width: 13px;
	height: 13px;
    background: transparent;
    border: 2px solid #fff;
}
.owl-theme .owl-dots .owl-dot.active span {
	background: #fff;
}
.ad-carousel {
	max-height: calc(100vh - 263px);
	overflow: hidden;
	display: flex!important;
	justify-content: center;
	align-items: center;
	position: relative;
}
.ad-carousel img{
	height: 100%;
}
/*cus*/
.navbar-divider {
	background-color: rgba(0, 0, 0, 0.08); 
}
/*常用連結*/
.d-flex-center {
	display: flex;
	justify-content: center;
	flex-direction: column;
}
.common-use-links {
	margin-top: 1rem;
	position: relative;
}
.common-use-links .columns {
	margin: 0;
    padding: .1rem;
}
.common-use-links .hero-body {
	padding: 0;
}
.common-use-links::after {
	content: "";
	width: 100%;
	height: 60px;
	position: absolute;
	bottom: 0;
	background: rgba(0, 0, 0, .05);
	z-index: -1;
}
.round-btn {
	width: 80px;
    height: 80px;
    background: #d01347;
    margin: 0 auto;
    border-radius: 50%;
    position: relative;
    transition: transform .3s ease-out;
    border: none;
}
.round-btn:hover {
    border: 1px solid #d01347;
}
.round-btn.has-background-white {
	color: #d01347!important;
}
.box-shadow {
	box-shadow: 0 5px 10px -2px #ccc;
    border: 1px solid #ddd;
}
.btn-text span {
	display: inline-block;
	vertical-align: middle;
	-webkit-transform: perspective(1px) translateZ(0);
	transform: perspective(1px) translateZ(0);
	box-shadow: 0 0 1px rgba(0, 0, 0, 0);
	position: relative;
	overflow: hidden;
}
.btn-text span:before {
	content: "";
	position: absolute;
	z-index: -1;
	left: 0;
	right: 100%;
	bottom: 0;
	background: #d01347;
	height: 4px;
	-webkit-transition-property: right;
	transition-property: right;
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-timing-function: ease-out;
	transition-timing-function: ease-out;
}
a:hover .round-btn, 
a:active.round-btn, 
a:focus.round-btn {
	cursor: pointer;
	transform: translateY(-10px);
	box-shadow: 0 10px 30px -10px rgba(0, 0, 0, .5);
    border: 1px solid #ddd;
}
a:hover .btn-text, 
a:active .btn-text, 
a:focus .btn-text {
	color: #d01347!important;
}
a:hover .btn-text span::before, 
a:active .btn-text span::before, 
a:focus .btn-text span::before {
	right: 0;
}
/*活動行事曆*/
.act-calendar .container > .columns .columns:not(.no-bg) {
	background: #eee;
}
.act-calendar .hero-body {
	padding: 0;
	border-top: 1px solid #ccc;
}
.act-calendar .hero-body:last-child {	
	/*border-bottom: 1px solid #ccc;*/
}
.border-left {
	border-left: 5px solid #d01347;
	padding-left: 1.5rem;
}
.clean-btn {
	background: transparent;
    border: unset;
    height: inherit;
    padding: 0 .5rem;
}
.clean-btn:hover, 
.clean-btn:focus, 
.clean-btn:active {
	outline: unset!important;
	border: unset!important;
	box-shadow: unset!important;
} 
.btn-forward span, 
.btn-backward span {
  	display: inline-block;
  	vertical-align: middle;
  	-webkit-transform: perspective(1px) translateZ(0);
  	transform: perspective(1px) translateZ(0);
  	box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  	-webkit-transition-duration: 0.3s;
  	transition-duration: 0.3s;
  	-webkit-transition-property: transform;
  	transition-property: transform;;
}
.btn-forward span:hover, 
.btn-backward span:hover {
	color: #d01347;
}

.btn-forward span:active {
  	-webkit-transform: translateX(8px);
  	transform: translateX(8px);
}
.btn-backward span:active {
  	-webkit-transform: translateX(-8px);
  	transform: translateX(-8px);
}
.is-fullbtn {
	width: calc(100% + 24px);
	height: calc(100% + 24px);
	margin: -12px; 
	border: unset;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	border-radius: unset;
}
.date-blk {
	border: 1px solid #ccc;
	height: 100%;
	background: white;
	position: relative;
	transition: all .3s;
	display: flex;
    align-items: center;
    justify-content: center;
}
.date-blk span {
	font-size: 2rem;
}
.date-blk:hover {
	cursor: pointer;
	background: #eee;
}
.date-blk::before {
	content:'';
    float:left;
	padding-top: 100%;
}
.d-flex-aj-center {
	display: flex;
	align-items: center;
	justify-content: center;
}
.d-flex-a-center {
	display: flex;
	align-items: center;
}.flex-end {
	justify-content: flex-end;
}
.date-blks div .date-blk::after {
	top: 10px;
	left: 10px;
    position: absolute;
}
.date-blk.active {
	background: #d01347;
	color: white;
}
.date-blks div:nth-child(1) .date-blk::after {
	content: "星期天";
}
.date-blks div:nth-child(2) .date-blk::after {
	content: "星期一";
}
.date-blks div:nth-child(3) .date-blk::after {
	content: "星期二";
}
.date-blks div:nth-child(4) .date-blk::after {
	content: "星期三";
}
.date-blks div:nth-child(5) .date-blk::after {
	content: "星期四";
}
.date-blks div:nth-child(6) .date-blk::after {
	content: "星期五";
}
.date-blks div:nth-child(7) .date-blk::after {
	content: "星期六";
}
.month-text {
	position: absolute;
    bottom: 25px;
}
.year {
	margin-top: .2rem;
}
.date-blk span {
	-webkit-animation-name: pop;
  	animation-name: pop;
  	-webkit-animation-duration: 0.3s;
  	animation-duration: 0.3s;
  	-webkit-animation-timing-function: linear;
  	animation-timing-function: linear;
  	-webkit-animation-iteration-count: 1;
 	animation-iteration-count: 1;
}
.position-topright {
	position: absolute;
	top: 10px;
	right: 10px;
}
.act-content {
	margin-top: 1rem;    
}
.h-100 {
	height: 100%;
	display: flex;
    flex-direction: column;
}
.card-content {
	position: relative;
	display: flex;
    flex-direction: column;
    flex-grow: 1;
}
.card-content .content {
	flex-grow: 1
}
.article-type-text {
	position: absolute;
	top: -32px;
	display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background: rgba(0, 0, 0, .9);
    padding: .5rem;
    color: white;
    width: 64px;
}
.article-type-text .icon {
	height: auto;
}
.article-date {
	padding-left: .25rem;
    /*margin-left: 70px;*/
    margin-bottom: 0.5rem;
    margin-top: 15px;
}
.cweek-info .image img {
	/*transition: all .3s;*/
}
.cweek-info .image:hover img {
	/*transform: scale(1.05);*/
	cursor: pointer;
}
.cweek-info .readmore {
	border-radius: 100px 100px 0 0;
    border: 1px solid #d8d8d8;
    border-bottom: unset;
    margin-bottom: -1.5rem;
    padding: 1rem 1rem 0.5rem 1rem;
    text-align: center;
    width: 100px;
    height: 50px;
    margin-left: auto;
    margin-right: auto;
    font-size: 90%;
    transition: all .3s;
}
.cweek-info .readmore:hover {
	cursor: pointer;
	background: #d01347;
	color: white;
}
.cweek-info .title {
	margin-bottom: .5rem;
}
@-webkit-keyframes pop {
  0% {
  	opacity: 0.5;
    -webkit-transform: translateX(-50px);
    transform: translateX(-50px);
  }
  30% {  	
    -webkit-transform: translateX(5px);
    transform: translateX(5px);
    transform: scale(1.1);
  } 
  100% {
  	opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
@keyframes pop {
  0% {
  	opacity: 0.5;
    -webkit-transform: translateX(-50px);
    transform: translateX(-50px);
  }
  30% {  	
    -webkit-transform: translateX(5px);
    transform: translateX(5px);
    transform: scale(1.1);
  }
  100% {  	
  	opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
.calendar-area {
	position: absolute;
    bottom: -152px;
    left: 0;
    background: white;
    box-shadow: 0 5px 10px 5px rgba(0, 0, 0, .2);
    padding: 10px;
    z-index: 1;
    width: 100%;
    display: none;
}
.btn-ctn, 
.btn-result {
	display: none;
}
.btn-ctn.is-active, 
.btn-result.is-active {
	display: block;
}
.periodTime-searh {
	transition: all .3s;
}
.periodTime-searh.is-active {
	background: #d01347;
	color: white;
}
.btn-result .delete {
	position: absolute;
	top: 5px;
	right: 5px; 
}
.info-type {
	text-align: center;
	border-right: 1px solid #ccc;
	padding: 1rem;
	transition: all .3s;
}
.info-type.is-active {
	background: #d01347;
	color: white;
}
.info-type:not(.is-active):hover {
	cursor: pointer;
	background: #eee;
}
.info-type-group .column:first-child .info-type {	
	border-left: 1px solid #ccc;
}
.act-content-more {
	text-align: center;
	margin-top: 1.5rem;
	margin-bottom: 1.5rem;
}
.btn-more, 
.btn-more .icon {
	transition: all .3s;
}
.btn-more .icon {
	color: #d01347;
}
.btn-more:hover {
	background: #d01347;
	color: #fff;
}
.btn-more:hover .icon {
	color: #fff;
}
.normal-board .hero-body {
	padding: 0;
}
.normal-board .maintitle {
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}
 @-webkit-keyframes fadeInUp {
    0% {
       opacity: 0;
       -webkit-transform: translateY(20px);
    }
    100% {
       opacity: 1;
       -webkit-transform: translateY(0);
    }
 }
 
 @keyframes fadeInUp {
    0% {
       opacity: 0;
       transform: translateY(20px);
    }
    100% {
       opacity: 1;
       transform: translateY(0);
    }
 }
  @-webkit-keyframes fadeIn {
    0% {
       opacity: 0;
    }
    100% {
       opacity: 1;
    }
 }
 
 @keyframes fadeIn {
    0% {
       opacity: 0;
    }
    100% {
       opacity: 1;
    }
 }
 .cweek-info, .cd-timeline__block {
 	-webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    opacity: 0;
 }
 .cweek-info.show { 
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
 }
 .cd-timeline__block.show { 
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
} 
.mb-2 {
	margin-bottom: 1rem;
}
.mt-0 {
	margin-top: 0!important;
}
.border-left.subtitle {
	margin-bottom: .5rem;
	padding: .75rem;
}
.addr {
	text-decoration: underline;
}
.social-media a {
	width: 50px;
	text-align: center;
}
.footer-blk {
	position: relative;
	display: flex;
    justify-content: center;
}
.footer-blk .content {
	z-index: 2;
	padding: .5rem 2rem;
	background: #363636;
}
.footer-blk::after {
	content: "";
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 10px;
    border-top: 1px solid rgba(0, 0, 0, .15);
    width: calc(100% - 20px);
}
/*麵包屑*/
.breadcrumb {
	margin-bottom: 0!important;
	min-height: 66px; 
	display: flex;
	align-items: center;
}
/*文章列表*/
.page-title {
	padding: 1rem 12px; 
}
.result {
	padding: 12px;
}
.mt-0 {
	margin-top: 0!important;
}
.is-borderless {
	border-top: 0!important;
	border-bottom: 0!important;
	border-left: 0!important;!important;
	border-right: 0!important;
}
.cus-input {
	background: transparent;
    box-shadow: unset;
    font-family: Microsoft JhengHei;
    border: unset;
    border-radius: unset;
}
.cus-input:focus,
.cus-input:hover,
.cus-input:active {
	outline: unset;
	box-shadow: unset;
	border-color: #d01347;
}
.cus-btn {
	background: transparent;
	border: unset;
}
.cus-field {	
    border-bottom: 1px solid #888;
}
/*loader*/
.cus-loader {
	align-items: center;
	justify-content: center;
	height: 50px;
	display: none;
}
.cus-loader-text {
	display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.main-loader {
	height: calc(100vh - 119px);
	background: #fff;
	/*background: #fbfcf4;*/
	position: fixed;
    top: 119px;
    left: 0;
    z-index: 10;
    width: 100vw;
}
.main-loader .hero-body {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
}
.dot-text {
	margin-bottom: 2rem;
	color: #ccc;
}
/*文章內容*/
.article-tboard {
	height: 400px;
	position: relative;
	background-attachment: fixed!important;
}
.article-tboard-title {
	min-height: 100px;
	display: flex;
	align-items: center;
	background: rgba(0, 0, 0, .8);
    width: 100%;
}
.article-tboard .article-tboard-title {
	bottom: 0;
	position: absolute;
}
.article-tboard-title .title {
	color: white;
	font-size: 1.8rem; 
    font-weight: 400;
}
.article-tboard-title .subtitle {
	color: white;
}
.tboard-article-type {
	display: flex;
	flex-direction: column;
}
.btn-back {
	margin: 1rem 0 3rem 0;
}
/*他們的故事*/
#main-bd.page {
	padding-bottom: 3rem; 
}
.media.ama-info {
	padding-top: .75rem;
    align-items: center;
}
.media.ama-info .content {
	font-size: 1.25rem;
	font-weight: 600;
}
.ama-box {
	margin: 0 auto;
}
.ama-box .box { 
	width: 23.5%;
 	margin-bottom: 2%;
 	border-radius: 0; 
 	transition: all .3s;
}
.ama-box .box:hover {
	cursor: pointer;
} 
.ama-box .box .image:not(.is-48x48) img {
	transition: all .3s;
}
.ama-box .box:hover .image:not(.is-48x48) img {	
	opacity: .8;
	transform: scale(0.98);
}
.gird-sizer {
	width: 23.5%;
}
.gird-gutter {
	width: 2%;
}
@keyframes blowUpContent {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  99.9% {
    transform: scale(2);
    opacity: 0;
  }
  100% {
    transform: scale(0);
  }
}
@keyframes blowUpContentTwo {
  0% {
    transform: scale(2);
    opacity: 0;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes blowUpModal {
  0% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes blowUpModalTwo {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  100% {
    transform: scale(0);
    opacity: 0;
  }
}
#modal-container {
    position: fixed;
    display: table;
    height: calc(100% - 119px);
    width: 100%;
    top: 119px;
    left: 0;
    transform: scale(0);
    z-index: 1;

}
#modal-container .modal-background{	
    filter: blur(8px);
    opacity: 0.6;
}
#modal-container .cus-modal-background {
    display: table-cell;
    background: rgba(0, 0, 0, 0.8);
    text-align: center;
    padding-top: 67px;
}

#modal-container .cus-modal-background .cus-modal {
	width: 100%;
	height: 90%;
    background: white;
    padding: 50px;
    display: inline-block;
    border-radius: 3px;
    position: relative;
    overflow-y: auto;
    max-height: calc(100vh - 197px);
}

#modal-container .cus-modal-background .cus-modal h2 {
    font-size: 25px;
    line-height: 25px;
    margin-bottom: 15px;
}

#modal-container .cus-modal-background .cus-modal p {
    font-size: 18px;
    line-height: 24px;
}

#modal-container .cus-modal-background .cus-modal .modal-svg {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    border-radius: 3px;
}

#modal-container .cus-modal-background .cus-modal .modal-svg rect {
    stroke: #fff;
    stroke-width: 2px;
    stroke-dasharray: 778;
    stroke-dashoffset: 778;
}
#modal-container.blowup {
    z-index: 0;
    transform: scale(1);
}

#modal-container.blowup .cus-modal-background {
    background: rgba(0, 0, 0, 0.7);
}

#modal-container.blowup .cus-modal-background .cus-modal {
    animation: blowUpModal 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}

#modal-container.blowup+#main-bd {
    z-index: 1;
    animation: blowUpContent 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}

#modal-container.blowup.out .cus-modal-background .cus-modal {
    animation: blowUpModalTwo 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}

#modal-container.blowup.out+#main-bd {
    animation: blowUpContentTwo 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
.ab-right {
	position: absolute;
	top: -45px;
	right: 12px;
}
#modal-container .content .name {
	margin-top: 0;
	margin-bottom: .25rem!important;
}
#modal-container .content .story {	
    text-align: justify;
}
#modal-container .content .video iframe {
	max-width: 600px;
	min-height: 450px;
	background:url(../img/video_loading.gif) center center;
}	
#modal-container .content .pic {
	float: left;
    margin-right: 20px;
    margin-bottom: 0;
}
/*大事記*/
.cd-timeline {
	margin: 0;
	flex-grow: 1;
    margin-bottom: -2rem;
}
.cd-timeline__img--picture {
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 2rem;
	color: #fff;
}
.cd-timeline__img.cd-timeline__img--picture {
    background: #d01347;
}
.bg-lightgrey {
	background: #e9f0f5!important;
}
#main-bd.d-flex-column {
	display: flex;
	flex-direction: column;
}
.cd-timeline__content p, .cd-timeline__read-more, .cd-timeline__date {
    font-size: 1rem;
}
.image.is-256x180 {
    height: 180px;
    width: 256px;
    margin: 0 auto .5rem auto;
    overflow: hidden;
}
@keyframes stamp {
	100% {
		transform: rotate(5deg) scale(1);
		opacity: 1;
		filter:blur(0);
	}
}
.bg-image {
	height: 150px;
    width: 150px;
    position: absolute;
    z-index: -1;
    top: calc(50% - 80px);
    left: -60px;
    transform: rotate(180deg) scale(10);
    animation: stamp .6s cubic-bezier(1,-0.49,.13,1.09) forwards;
    opacity: 0.3;
    filter:blur(5px);
}
.events-title {
	padding-left: 50px;
	position: relative;
	z-index: 1;
}
.event-block {
	display: none;
}
.event-block.is-active {
	display: block;
}
@keyframes type {
  0% {
    width: 0;
  }  
  1% {
    opacity: 1;
  }
  99.9% {
    border-right: .15em solid white;
  }
  100% {
    opacity: 1;
    border: none;
  }
}

@-webkit-keyframes type {
  0% {
    width: 0;
  }
  1% {
    opacity: 1;
  }
  99.9% {
    border-right: .15em solid white;
  }
  100% {
    opacity: 1;
    border: none;
    text-shadow:0 0 0 rgba(255,0,0,1);
  }
}
.events-title h1 {
	border-right: .15em solid white;
  	width: 7.5em;
  	overflow: hidden;
  	white-space: nowrap;
  	-webkit-animation: type .5s steps(40, end);
  	animation: type .5s steps(40, end);
  	-webkit-animation-fill-mode: forwards;
 	animation-fill-mode: forwards;
 	animation-delay: .6s;
  	opacity: 0;
}
.events-title h2 {
	/*border-right: .15em solid white;*/
  	/*width: 13.3em;*/
  	/*overflow: hidden;*/
  	word-wrap:break-word;
  	/*white-space: nowrap;*/
  	/*-webkit-animation: type .5s steps(40, end);
  	animation: type .5s steps(40, end);
  	-webkit-animation-fill-mode: forwards;
 	animation-fill-mode: forwards;
 	animation-delay: 1.1s;
  	opacity: 0;*/
}
.ama-tab .tabs a {
	transform: transform .3s;
}
.ama-tab .tabs a,
.ama-tab .tabs ul {
	border-bottom: none;
}
.ama-tab .tabs li a {
	background: white;
    margin: .5rem;
    border-radius: 50px;
    border: 1px solid #ccc;
}
.ama-tab .tabs li.is-active a {
    color: #d01347;
    border-color: #d01347;
    transform: scale3d(1.5);
}
.ama-tab .tabs li.is-active {
	position: relative;
}
.ama-tab .tabs li.is-active::after {
	content: "";
    display: block;
    border-style: solid;
    border-width: 0 10px 15px 10px;
    position: absolute;
    bottom: 0;
    left: calc(50% - 8px);
    border-color: transparent transparent #d01347 transparent; 
}
/*文字列表*/
.text-list-item {
	height: 100%;
}
a.text-list-item:hover {
	box-shadow: 0 2px 3px rgba(10, 10, 10, .1), 0 0 0 1px #d01347;
}
/*常見問題*/
.qna-container {
	padding: 2rem .75rem;
}
.qna-container .title {
	font-size: 1.2rem;
	/*background: #d01347;*/
	color: #333;
	border-left: 4px solid #d01347;
	font-weight: 400;
	padding: 12px 72px 12px 24px;
}
.qna-container .question {
	position: relative;
}
.qna-container .fqa-content {	
	transition: all .3s;
}
.qna-container .fqa-content:not(.content-visible) {	
	box-shadow: 0 2px 10px -1px rgba(0, 0, 0, .2); 
}
.qna-container .question:hover {
	cursor: pointer;
}
.qna-container .fqa-content:hover {	
	box-shadow: 0 2px 20px 0px rgba(0, 0, 0, .4);  
}
.qna-container .question::before, .qna-container .question::after {
	content: '';
    position: absolute;
    right: 24px;
    top: 50%;
    height: 2px;
    width: 13px;
    background: #d01347;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    transition-property: transform;
    -webkit-transition-duration: .2s;
    -moz-transition-duration: .2s;
    transition-duration: .2s;
}
.qna-container .question::before {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    right: 32px;
}
.qna-container .content-visible .question::before {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
    background: white;
}
.qna-container .question::after {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.qna-container .content-visible .question::after {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    background: white;
}
.qna-container .content-visible .question {
    background: rgba(198, 9, 61, 1);
}
.qna-container .content-visible .question .title,
.qna-container .content-visible .question .has-text-pink {
	color: white!important;
}
.qna-container .anser {
	padding: 2rem 24px;
	box-shadow: 0 2px 10px -1px rgba(0, 0, 0, .2);  
	display: none;
}
.qna-container .column {
	margin-bottom: .5rem
}
.group-title {
	padding-bottom: 24px;
    font-size: 1.5rem;
    font-weight: 600;
}
.group-title span {
	color: #3273dc;
}
/*CKeditor*/
.title_style {
	font-size: 1.25rem;
	border-left: 5px solid #d01347;
    padding-left: 10px;
}
.content p {
	/*line-height: 2;*/
}
.content a {
	word-break: break-all;
}
/*homepage*/
.homepage_video {
	height: 720px;
}
/*標題列表*/
.article-type.only-title.no-date + a {
	/*margin-top: 1rem;*/
}
.only-title .article-type-text {
    flex-direction: row;
    top: 0;
    width: unset;
}
.only-title .article-date {
    /*margin-left: 92px;*/
}
.only-title .article-type-text .icon {
    font-size: 1rem !important;
}
.no-date + .title {
	margin-top: 27px;
}
.brace {
  width: auto;
  min-width: 35px;
  padding-bottom: 20px;
  font-size: 2em;
  line-height: 2em;
  position: relative;
  text-align: center;
  vertical-align: middle;
  margin: 0 15px 2rem 15px;
  border: none;
  background-color: transparent;
  background-image: radial-gradient(circle at 0 0, rgba(255,255,255,0) 14.5px, #d01347 15.5px, #d01347 19.5px, rgba(255,255,255,0) 20.5px), radial-gradient(circle at 35px 0, rgba(255,255,255,0) 14.5px, #d01347 15.5px, #d01347 19.5px, rgba(255,255,255,0) 20.5px);
  background-size: 35px 20px;
  background-position: center bottom;
  background-repeat: no-repeat;
  text-transform: lowercase;
  font-style: italic;
  color: #d01347;
  -webkit-filter: drop-shadow(0 1px 1px rgba(0,0,0,0.15));
          filter: drop-shadow(0 1px 1px rgba(0,0,0,0.15));
  overflow: visible;
}
.brace:before {
  width: 50%;
  border-top: 5px solid #d01347;
  border-left: 1px solid transparent; /* play with this until you like the look of it */
  border-top-left-radius: 20% 30px;
  height: 100%;
  content: "";
  position: absolute;
  top: 100%;
  left: -15px;
  box-sizing: border-box;
  margin-top: -5px;
}
.brace:after {
  width: 50%;
  border-top: 5px solid #d01347;
  border-right: 1px solid transparent; /* play with this until you like the look of it */
  border-top-right-radius: 20% 30px;
  height: 100%;
  content: "";
  position: absolute;
  top: 100%;
  right: -15px;
  box-sizing: border-box;
  margin-top: -5px;
}
.brace-title {
	display: flex;
	align-items: center;
	font-size: 1.75rem;
	margin-top: 2rem;
	padding: .5rem;
	border-radius: .25rem .25rem 0 0; 
	background: #000;
	color: white;
	border-bottom: 5px solid #666;
}
.brace-title.brace-first {
	margin-top: .5rem;
}
@-webkit-keyframes bounceIn {
  from,
  40%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  40% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  80% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes bounceIn {
  from,
  40%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  40% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  80% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
@-webkit-keyframes bounceIn-opa {
  from,
  40%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  40% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  80% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  to {
    opacity: 0.5;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes bounceIn-opa {
  from,
  40%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  40% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  80% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  to {
    opacity: 0.5;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.bounceIn {
  	-webkit-animation-duration: 0.5s!important;
	animation-duration: 0.5s!important;
  	-webkit-animation-name: bounceIn!important;
  	animation-name: bounceIn!important;
}
.bounceIn-opa {
  	-webkit-animation-duration: 0.5s!important;
  	animation-duration: 0.5s!important;
  	-webkit-animation-name: bounceIn-opa!important;
  	animation-name: bounceIn-opa!important;
}

@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;  
  animation-duration: .3s;
}

/*登入面板*/
.modal-section {	
	position: fixed;
    z-index: 19;
    width: 100vw;
    align-items: center;
    height: 100vh;
    top: 0;
}
.modal-board {
	width: calc(100vw - 10px);
    max-width: 500px;
    z-index: 1;
    position: relative;
    margin: auto 0;
}
.modal-board.huge {
    max-width: 1000px;
}
.message-content {
	margin-bottom: .8rem;
}
.message-content p {
    overflow-y: auto;
    max-height: 300px;
}
.cancle-backboard,
.cancle-board {
	position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
}
.modal-board .message-header {
	background: #d01347;
}
.modal-board.huge .message-header {
	background: #000;
}
/*會員註冊*/
.hero-body.box {
	margin: 20px auto;
    width: 800px;
    max-width: calc(100% - 20px);
}
.choosebox {
	border-radius: 60px;
	border: 10px solid #fff;
    background: white;
    transition: 0.3s all ease-out;
    background-color: #eee;
    padding: 30px 10px;
    cursor: pointer;
}
.choosebox:hover {
    background-color: #ffedf2;
    border-color: #d01347;
}
.steps-actions {
    display: flex;
    align-items: stretch;
    flex-basis: 100%;
}
.steps-actions .steps-action {
    display: flex;
    flex-basis: 0;
    flex-grow: 1;
    margin: .5rem;
    justify-content: center;
    align-items: center;
}
.center-flex-tag {
	display: flex;
    justify-content: center;
	margin-top: .5rem;
	margin-bottom: .5rem;
}
/*會員專區*/
.menu-mainboard {
    background: #fff;
    z-index: 10;
}
.member-board {
	max-width: 840px;
}
.member-board.pb-0 {
	padding-bottom: 0;
}
.member-board > .field {
	margin-right: -20px;
	margin-left: -20px;
	margin-bottom: 0;
	padding-bottom: .75rem;
	padding-bottom: .75rem;
    padding-right: 20px;
    padding-left: 20px;
}
.member-board > .field:not(:last-child) {
	border-bottom: 1px solid #eee;
	padding-bottom: .75rem;
}
.member-board > .field:not(:first-child) {
	padding-top: .75rem;
}
.menu-board {
	max-width: 270px;
}
.menu-item {
	display: block;
	color: #3c4043;
	cursor: pointer;
	border-radius: 0 50px 50px 0;
    padding: 10px 16px 10px 24px;
    margin: .25rem 0;
}
.menu-item svg {
	margin-right: .25rem;
}
.menu-item.is-active {
	color: #d01347;
	background: rgb(208, 19, 71, 0.15);
}
.menu-item:not(.is-active):hover {
	background: rgba(0,0,0,0.039);
}
.menu-item:not(.is-active):focus {
	background: rgba(0,0,0,0.122)
}
.member-describeTitle {
	padding-top: 0px!important;
	padding-bottom: 0px!important;
}
.member-row,
.member-row label,
.member-row input {
	cursor: pointer;
}
.member-row .icon {
	color: #3c4043!important;
}
.member-row:hover {
	background: #efefef;
}
.backboard {	
	width: 100vw;
    height: 100vh;
    top: 0;
    position: fixed;
    z-index: 30;
    display: flex;
    justify-content: center;
    align-items: center;
}
.backboard-background {
    background: rgba(0, 0, 0 ,0.5);
    width: 100%;
    height: 100%;
    position: relative;
}
.editbox {	
	width: 90vw;
	max-width: 500px;
	min-height: 100px;
    position: fixed;
	background: #fff;
	border-radius: 10px;
	padding: 24px 24px 20px 24px;  
}
.editblock {	
	display: none;
}	
.editblock .block-header {
	display: flex;
	justify-content: space-between;
}
/*會員面板*/
#extra-control {
	display: none;
	position: fixed;
	z-index: 100;
	padding: 10px;
	background: #fff;
	border-radius: 5px;
	box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.25);
}
#extra-control button:not(:last-child) {
	margin-bottom: .5rem;
}
#extra-control-mobile {
	display: none;
}
#extra-control-mobile.show {
	display: block;
}
#extra-control-mobile {
    padding: 10px 12px;
    margin-left: -12px;
    margin-right: -12px;
    margin-bottom: 0.5rem;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}
#extra-control-mobile + .columns {
	background: #f0f0f0;
}	
/*訂單查詢*/
/* Pulse Grow */
@-webkit-keyframes hvr-pulse-grow {
  to {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }
}
@keyframes hvr-pulse-grow {
  to {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }
}
.hvr-pulse-grow {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}
.hvr-pulse-grow:hover, .hvr-pulse-grow:focus, .hvr-pulse-grow:active {
  -webkit-animation-name: hvr-pulse-grow;
  animation-name: hvr-pulse-grow;
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
}
.table-box .field-label, 
.table-box .field.is-horizontal {
	margin-bottom: 0;
}
.table-box-container {
	max-width: 1200px;
}
.table-box {
	position: relative;
	transition: .3s all;
	margin-bottom: .5rem;
}
.table-box-info {
	max-width: 840px;
}
.table-box .field:not(:last-child),
.table-box-info .field:not(:last-child) {
	margin-bottom: 0;
}
.table-box:hover {
	transform: translateY(-3px);
    box-shadow: 0 3px 5px 1px rgba(0, 0, 0, 0.3);
}
.table-box:hover .detail-button > span {
	color: #d01347!important;
	-webkit-animation-name: hvr-pulse-grow;
  	animation-name: hvr-pulse-grow;
  	-webkit-animation-duration: 0.3s;
  	animation-duration: 0.3s;
  	-webkit-animation-timing-function: linear;
  	animation-timing-function: linear;
  	-webkit-animation-iteration-count: infinite;
  	animation-iteration-count: infinite;
  	-webkit-animation-direction: alternate;
  	animation-direction: alternate;
}
.table-box-info .field-label,
.table-box .field-label {
	min-width: 80px;
	max-width: 80px;
} 
.table-box-info .field-body >.field,
.table-box .field-body >.field,
.field-body.text:not(.multi) >.field,
.field-body.text.multi >.field > .control {
	padding-top: .375em;
}
.table-box .detail-button {
	display: flex;
	justify-content: center;
	margin-top: 0.75rem;
    margin-left: -20px;
    margin-right: -20px;
    margin-bottom: -20px!important;
    padding: 20px;
    transition: all .3s;
	cursor: pointer;
	border-top: 1px solid #ccc;
}
.table-box .detail-button:hover {
	background: #f5f5f5;
}
.decorate-ball {
	display: flex;
    position: absolute;
    top: -22px;
    left: 80px;
    background: #d01347;
    border: 1px solid #d01347;
    border-radius: 5px 5px 0 0;
    padding: 10px;
    width: 80px;
    height: 15px;
	transition: .3s all;
}

.decorate-ball-type {
	display: flex;
    position: absolute;
    top: -22px;
    left: 0;
    background: #4a4a4a;
    border: 1px solid #fff;
    border-bottom: unset;
    border-radius: 5px 5px 0 0;
    padding: 10px;
    width: 80px;
    height: 15px;
	transition: .3s all;
}
.decorate-ball:before,
.decorate-ball-type:before {
	color: #fff;
	content: attr(data-text);
    position: absolute;
    top: calc(50% - 10px);
    left: calc(50% - 30px);
    width: 60px;
    height: 20px;
    text-align: center;
    line-height:  20px;
    font-size: .75rem;
	transition: .3s all;
}
.decorate-ball:after {
	color: #fff;
	content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 20px;
    text-align: center;
    line-height:  20px;
    font-size: .75rem;
	transition: .3s all;
	box-shadow: inset 0 -6px 0px rgba(0, 0, 0, .1);
}
.table-box:hover .decorate-ball {
	height: 30px;
    top: -30px;
}
.table-box:hover .decorate-ball:before {
    top: calc(50% - 15px);
}
.search-bar {
	padding-bottom: 40px;
    max-width: 900px;
}
.vol-shift .search-bar {
	max-width: 400px;	
	padding-bottom: 20px;
}
.search-bar .label {	
    padding-top: .15em;
    margin-right: .375rem;
}	
.border-less {
	border: unset!important;
}
.ml-2 {
	margin-left: 1rem;
}
.field.order-product {
	margin-left: 120px;
    margin-bottom: 0;
    padding: .25rem;
}
.field.order-product + .field.order-product {	
    border-top: 1px dashed #ccc;
}
.field.order-total {
    padding: 0.25rem;
}
.field.order-product:hover {
	background: #eee;
}
.field.order-product .field-label {
	min-width: 300px;
}
.field.order-product .label svg {
	color: #d01347;
	margin-right: 0.25rem;
}
.field.order-product .label {
    max-width: 200px;
	flex-grow: 0;
}
.table-box-info hr {
	margin-bottom: 0.75rem;
}
.mb-1 {
	margin-bottom: .5rem;
}
/*志工園地-簽到*/
.box.text-list-item .title .icon {
	margin-right: .5rem;
}
.vol-shift {
	max-width: 1200px;
}
.vol-shift .box {
    background: #f0f0f0;
    box-shadow: 0 5px 5px -2px rgba(0, 0, 0, 0.3);
    transition: all .3s;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    opacity: 0;
}
.vol-shift .box.show { 
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
 }
.vol-shift .ctn-block {
	padding: .5rem .75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    border-radius: 4px;
}
.vol-shift .ctn-block:not(.button) {
	background: #fff;
}
.vol-shift .ctn-block div.full-width {
	flex:none;
	width: 100%;
}
.vol-shift .ctn-block.bordered {
    border: 1px solid #ccc;	
}
.vol-shift .tile.is-mobile {
	display: flex;
}
.vol-shift .tile.is-parent {
    padding: .25rem;
}
.vol-shift .tile.is-vertical>.tile.is-child:not(:last-child),
.vol-shift .tile.is-vertical-tablet>.tile.is-child:not(:last-child) {
    margin-bottom: .5rem !important;
}
/*志工園地-布告欄*/
.bulletin-board {
	max-width: 800px;
}
.bulletin-board .box-outer {
	padding: 0.25rem 0.75rem;
}
.bulletin-board .box {
	transition: all .3s;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    opacity: 0;
}
.bulletin-board .box.show {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
}
.bulletin-board .box[data-read="true"] {
	opacity: 0.7;
}
.bulletin-board .box:hover {
	cursor: pointer;
	opacity: 1;
	background: #efefef;
	transform: translateZ(10px);
	backface-visibility: hidden;
}
.bulletin-board .tag {
	transition: all .3s;
}
.bulletin-board .tag + span {
	margin-left: 0.5rem;
}
.bulletin-board .content h6 {
	margin-bottom: 0.4rem;
}
/*志工排班、活動行事曆*/
.vol-schedule {
	max-width: 1000px; 
}
.vol-schedule .calendar .box,
.appointment .calendar .box,
.calendar-list .calendar .box {
    height: 100%;    
    padding-top: 0.5rem;
    transition: all .3s;
    height: 175px;
}
.appointment .calendar .box,	
.calendar-list .calendar .box {	
	padding: .5rem; 
	position: relative;
}
.appointment .calendar .box .data-status,
.calendar-list .calendar .box .data-status {
	max-height: 100px;
	height: 100px;
	overflow-x: auto;
	position: relative;
}
.calendar .box.not-this-month .holi {
  display: none;
}
.calendar .holi {
  position: relative;
  bottom: 0;
  width: 100%;
  text-align: center;
  color: #de0000;
  height: 17px;
  font-size: .9rem;
  max-width: 100%;
  overflow: hidden;
}
.appointment .calendar .box .data-status::-webkit-scrollbar,
.calendar-list .calendar .box .data-status::-webkit-scrollbar {
	display: none;
}
.appointment .calendar .box .data-status .control,
.calendar-list .calendar .box .data-status .control {
	width: 100%;
}
.appointment .calendar .box .data-status .tags,
.appointment .calendar .box .data-status .tag,
.calendar-list .calendar .box .data-status .tags,
.calendar-list .calendar .box .data-status .tag {
	flex-grow: 1;
}
.vol-schedule .calendar .box:not(.empty):not(.not-this-month):hover,
.appointment .calendar .box.href:not(.empty):hover {
	cursor: pointer;
    transform: scale(1.2);
    position: relative;
    z-index: 1;
    box-shadow: 0 0 10px 2px rgba(0, 0, 0, .3);
}
.vol-schedule .shift-need {
	min-height: 72px;
}
.vol-schedule .shift-need .control:nth-child(2):last-child {
	margin-bottom: 48px;
}
.appointment .tag,
.calendar-list .tag {
	text-align: center;
	white-space: normal;
	display: inline-block;
}
.vol-schedule .calendar .tag.bordered {
    border: 1px solid #ccc;	
    border-left: unset;
}
.appointment .calendar .tag.bordered,
.calendar-list .calendar .tag.bordered {
    border: 1px solid #ccc;	
    border-right: unset;
}
.vol-schedule .box.not-this-month,
.appointment .box.not-this-month,
.calendar-list .box.not-this-month {
	background: #ccc;
	opacity: 0.8;
}
.vol-schedule .box.today,
.appointment .box.today,
.calendar-list .box.today {
	background: #d01347;
}
.year-month {
	font-size: 1.5rem;
    font-weight: bold;
}
.year-month-block {
	display: flex;
    justify-content: space-between;
    max-width: 320px;
}
.vol-schedule .calendar .columns,
.appointment .calendar .columns,
.calendar-list .calendar .columns {
	position: relative;
	margin-bottom: 0.5rem;
}
.vol-schedule .calendar .column,
.appointment .calendar .column,
.calendar-list .calendar .column {
	padding: 0 .25rem!important;
}
.vol-schedule .calendar .day,
.appointment .calendar .day,
.calendar-list .calendar .day {
	font-weight: 600;
	float: right;
	color: #666;
	font-size: .75rem;
    line-height: 2.1;
}
.vol-schedule .box.today .day,
.vol-schedule .box.today .holi,
.vol-schedule .box.today .date,
.appointment .box.today .day,
.appointment .box.today .holi,
.appointment .box.today .date,
.calendar-list .box.today .day,
.calendar-list .box.today .holi,
.calendar-list .box.today .date {
	color: #fff!important;
}
/*.vol-schedule .box.today .day,
.vol-schedule .box.today .date {
	color: #fff!important;
}*/
.vol-schedule .calendar .date,	
.appointment .calendar .date,	
.calendar-list .calendar .date {	
	font-weight: 600;
	margin-bottom: .5rem;
	border-bottom: 1px solid #ccc;
	text-align: left;
	font-size: 1.1rem;
}
.vol-schedule .calendar .am-needs, 
.vol-schedule .calendar .pm-needs {
    max-width: 13.92px;
    overflow: hidden;
}
/*.date-select .tag.bordered {
	transition: .3s all;
}*/
/*.date-select:hover .tag.bordered {
	background: #d01347;
	color: #fff;
	border-color: #ccc;
}*/
.year-month-col {
    position: sticky;
    top: 108px;
    z-index: 1;
}
/*.date-select:hover .tag.is-black {
	background: #fff;
	color: #000;
	border-color: black;
}*/
.vol-schedule-content {
	max-width: 1200px;
}

.member-sub {
	max-width: 888px;
}
.vol-sub {
	max-width: 800px;
}
.vol-schedule-content .message:not(:last-child) {
	margin-bottom: 0.5rem;
}
.vol-schedule-content .message-body {
    padding: .5em 1rem;
}
.vol-schedule-content .box > .field {
	margin-bottom: .5rem;
}
.vol-schedule-content .box .date {
    margin-right: .5rem;
    font-weight: 400;
    color: #d01347;
}
.vol-schedule-content input.is-static,
.vol-schedule-content input[type="radio"] {
	height: unset;
	min-height: unset;
	padding: 0; 
}
.vol-schedule-content .pt,
.vol-schedule-content input.is-static {
    padding-top: .375rem;
}
.vol-schedule-content .mr {
    margin-right: .75rem;
}
.vol-schedule-content .message {
	position: relative;
}
.vol-schedule-content .message:before {
    content: attr(data-type);
    writing-mode: vertical-rl;
    text-orientation: upright;
    position: absolute;
    right: 0px;
    height: 100%;
    font-size: .75rem;
    text-align: center;
    opacity: 0.9;
    color: #fff;
    border-radius: 0 5px 5px 0;
}
.vol-schedule-content .message.is-link:before,
.vol-schedule-content .message.is-link-empty:before {
    background: #3273dc;
}
.vol-schedule-content .message.is-success:before,
.vol-schedule-content .message.is-success-empty:before {
    background: #23d160;
}
.field.w-100 .field-body,
.field.w-100 .field-body>.field {
	width: 100%;
}
.timepicker {
	max-width: 300px;
}
.page-hint, .fbTemplate-outer {
	max-width: 100%;
	width: 800px;
	margin: auto;
}
.fbTemplate-outer {
	background: #f5f5f5;
}
.fbTemplate-outer-desc {
	max-width: 800px;
	margin: auto;
	margin-bottom: 1rem;
}
.is-need {
	color: #c10000;
}
.align-center {
	align-self: center;
}
@-webkit-keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes rubberBand {
  from {
  	opacity: 0.5;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }

  40% {
    -webkit-transform: scale3d(0.85, 1.15, 1);
    transform: scale3d(0.85, 1.15, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }

  65% {
    -webkit-transform: scale3d(0.99, 1.01, 1);
    transform: scale3d(0.99, 1.01, 1);
  }

  75% {
    -webkit-transform: scale3d(1.01, 0.99, 1);
    transform: scale3d(1.01, 0.99, 1);
  }

  to {
  	opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.rubberBand {
  	-webkit-animation-name: rubberBand;
  	animation-name: rubberBand;
  	animation-duration: .4s;
}
 .fadeInUp { 
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
  	animation-duration: .5s;
 }
 /*女力商店*/
 @-webkit-keyframes slidein {
    0% {
        opacity: 0
    }

    1% {
        -webkit-transform: translateX(160px);
        transform: translateX(160px)
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@keyframes slidein {
    0% {
        opacity: 0
    }

    1% {
        -webkit-transform: translateX(160px);
        transform: translateX(160px)
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}
 @-webkit-keyframes slideout {
    0% {
        opacity: 1;
    }

    1% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    100% {
        opacity: 0;
        -webkit-transform: translateX(160px);
        transform: translateX(160px)
    }
}

@keyframes slideout {
    0% {
        opacity: 1;
    }

    1% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    100% {
        opacity: 0;
        -webkit-transform: translateX(160px);
        transform: translateX(160px)
    }
}
.shop-top-bar {
 	text-align: center;
}
.shop-top-bar-cate {
 	color: white;
 	background: #000;
 	position: relative;
}
.shop-top-bar-contnet {
 	background: #eee;
 	position: relative;
 	box-shadow: 0 2px 10px rgba(0, 0, 0, .1);
}
.shop-nav,
.shop-cate-nav {
    list-style: none;
    margin: 0 34px;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: none;
    white-space: nowrap;
}
.shop-nav::-webkit-scrollbar,
.shop-cate-nav::-webkit-scrollbar {
    display: none;
}
.shop-nav-item {
	text-align: center;
	display: inline-block;
	vertical-align: top;
	margin: 0 -.11765em;
	-webkit-animation: slidein 350ms backwards;
	animation: slidein 350ms backwards;
	animation-duration: 500ms;
	transition: .3s all;
}
.shop-top-bar-contnet .shop-nav-item {
	/*padding: 30px 20px 20px 20px;*/
}
.shop-nav-item a {
	color: inherit;
	display: block;
	padding: 10px 20px; 
}
.shop-top-bar-contnet .shop-nav-item a {
	padding: 20px; 
}
.shop-nav-item:hover {
	cursor: pointer;
}
.shop-nav-item span {
	white-space: initial;
	font-size: 0.85rem;
}
.shop-nav-item:hover span,
.shop-nav-item.is-active span {
	color: #d01347; 	
}
.shop-nav-item svg {
	transition: .3s transform;
}
.shop-nav-item:hover svg,
.shop-nav-item.is-active svg {
	transform: rotate(45deg);
	color: #d01347!important;
}
.shop-nav-item.is-active svg {
	animation: slidein;
}
.shop-top-bar-cate .shop-nav-item:hover span,
.shop-top-bar-cate .shop-nav-item.is-active span
 {
	color: rgba(255, 255, 255, 0.7);
}
.shop-nav-button {
	background: transparent;
	font-size: 20px;
    line-height: 1.5;
    font-weight: 300;
    letter-spacing: 0em;
    border: 0 solid rgba(17,17,17,0.2);
    border-radius: 0;
    color: #000;
    opacity: 1;
    position: absolute;
    top: 0;
    bottom: 0;
    text-align: center;
    width: 33px;
    -webkit-transition: opacity 150ms ease-out;
    transition: opacity 150ms ease-out;
}
.shop-nav-button.btn-right {
	right: 0;
	border-left: 1px solid #666;
}
.shop-nav-button.btn-right:after {
	content: "";
	content: "";
    width: 10px;
    height: 10px;
    border-left: 1px solid #fff;
    border-top: 1px solid #fff;
    position: absolute;
    transform: rotate(135deg);
    top: calc(50% - 5px);
    left: calc(50% - 5px);
}
.shop-nav-button.btn-left {
	left: 0;
	border-right: 1px solid #666;
}
.shop-nav-button.btn-left:after {
	content: "";
	content: "";
    width: 10px;
    height: 10px;
    border-left: 1px solid #fff;
    border-top: 1px solid #fff;
    position: absolute;
    transform: rotate(-45deg);
    top: calc(50% - 5px);
    left: calc(50% - 5px);
}
.shop-top-bar-contnet .shop-nav-button {
	border-color: #d8d8d8;
}
.shop-top-bar-contnet .shop-nav-button:before,
.shop-top-bar-contnet .shop-nav-button:after {
	border-color: #888;
}
.sticky-shop {
	position: sticky;
    top: 119px;
    z-index: 2;
}
.products-container {
	padding: 20px 0 0px 0;
}
.product-container {
	padding:0 10px 20px 10px;
	height: 100%;
}
.product-container .card {
	height: 100%;
	display: flex;
	flex-direction: column; 
}
.product-container .card .media-content {
	overflow: unset;
}
.product-container .card-content .content {
	display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 75px;
}
.product-container .card-content .content .desc {
	/*overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;*/
}
.product-container:hover .title {
	color: #d01347;
}
.product_board {
	padding: 20px 20px 0 20px;
}
.product-type {
	border: 2px solid transparent;
}
.product-type.is-active {
	border: 2px solid #d01347;
}
.product-type:not(.is-active):hover {
	cursor: pointer;
	border: 2px solid #ccc;
}
.product-type-outer:not(:last-child) {
	margin-bottom: .5rem;
}
.final-price {
    font-family: sans-serif;
}
.product-part:last-child {
	margin-bottom: 2rem;
}
.product-main,
.product-desc {
    max-width: 1000px;
    margin: 0 auto;
}
.product-main {	
    border-bottom: 1px solid #ddd;
    padding-bottom: 2rem;
}
.cart-main-board {
	max-width: 1000px;
	margin: 0 auto;
	margin-bottom: 2rem;
}
.pic-part {
	position: relative;
	top: 0;
}
.cart .single-price {
	color: #999;
}
.cart .single-price,
.cart .amount,
.cart .multi-price {
	text-align: right;
}
.cart-item-act,
.cart-sum-block {
	padding: 0 0.75rem;
}
.cart .cart-item {
	line-height: 2.2;
	border-bottom: 1px solid #eee;	
}
.cart .cart-item:last-child {
	margin-bottom: .5rem;
}
.cart .amount input {
	max-width: 80px;
	text-align: right;
}
.flex-end {
	justify-content: flex-end!important;
}
.flex-start {
	justify-content: flex-start!important;
}
.level.small-mb:not(:last-child) {
	margin-bottom: .25rem;
}
.content.is-small {
	margin-bottom: .5rem;
}
.content.is-small hr {
	margin: 0.25rem 0;
}
.currency {
	margin-left: .25rem;
}
.cart .product {
	color: #666;
}
.cart .product:hover {
	color: #d01347;
}
.shop-checkout .checkout-item .column {
	padding-top: 0;
	padding-bottom: .75rem;
}
.shop-checkout .checkout-item .column:not(:first-child) {	
	padding-top: .75rem;
}
.shop-checkout .checkout-item {
	border-bottom: 1px solid #eee;
	margin-bottom: 1.5rem;
}
.shop-checkout .receive-info > div {
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}
.mt-1 {
	margin-top: .5rem;
}
.receive-info > div:not(:last-child) {
	margin-bottom: .5rem;
}
.receive-info {
	border: 2px solid transparent;
	height: 100%;
	background: #f0f0f0;
	transition: .5s background;
}
.receive-info.is-active {
	border: 2px solid #d01347;
	background: #fff;
}
.receive-info:not(.is-active):hover {
	cursor: pointer;
	border: 2px solid #d01347;
}
.receive-info .btn-edit {
	display: none;
}
.receive-info.is-active .btn-edit {
	display: inline-flex;
}
.receive-info .add-new-text {
	display: none;
	text-align: center;
	color: #aaa;
}
.receive-info.is-empty .text {
	display: none;
}
.receive-info.is-empty .add-new-text {
	display: block;
}
.btn-s-more .icon {
	transition: all .3s;
}
.btn-s-more.open .icon {	
	transform: rotate(180deg);
}
.o-time-left {
	padding: 0 .5rem
}
.box .text-content {
	padding-top: .75rem;
    border-top: 1px solid #eee;
}
.box.table-box-info.cancle,
.table-box-container .column.cancle {
	opacity: .5;
	background: #eee;
	position: relative;
}
.box.table-box-info.cancle:before,
.table-box-container .column.cancle:before {
	content: "已取消";
    position: absolute;
    font-weight: 600;
    font-size: 100px;
    opacity: .1;
    top: calc(50% - 75px);
    left: calc(50% - 150px);
}
.act-history {
	border-bottom: 1px solid #dadce0;
}
.act-history .column > div:not(:last-child) {
	padding-bottom: .5rem;
}
.huge-pb {
	padding-bottom: 3rem;
}
.act-signup-img {
	position: relative;
}
.act-signup-info-btn {
	position: absolute;
	top: .5rem;
	right: .5rem;
	z-index: 1
}
.act-bottom-block {
	max-width: 800px;
    margin: 2rem auto 1rem auto;
}
.act-bottom-block .title {
	padding-bottom: 1rem;
	margin-bottom: 2.5rem;
	border-bottom: 1px solid #e0e0e0;
}
.act-signup-block {
	max-width: 800px;
    margin: 2rem auto 1rem auto;
}
.act-signup-block .title {
	padding-bottom: 1rem;
}
.line-height-18 {
	line-height: 1.8rem;
}
.venue-selectblock {
	max-width: 600px;
	margin: 0 auto;
	position: sticky;
	top: 119px;
	z-index: 2;
}
.tabs li.is-active a,
.tabs li.is-active span {
    border-bottom-color: #d01347;
    color: #d01347;
}
.section.top-sec {
	padding-top: .5rem;
}
.venue-tab-content > div:not(.is-active) {
	display: none;
}
.appointment .year-month-col {
    position: initial;
}
.tag.is-heightfree {
	/*border: 1px solid #ccc; 暫時取消外框border*/ 
	height: unset;
}
.box.today .tag.is-heightfree {
	border: 1px solid #fff;
	background: unset;
	color: #fff;
}
.box.today svg.has-text-danger {
	color: #fff!important;
}
.hero-body.small-spaced {
	padding-top: 1rem;
	padding-bottom: 1rem;
}
.slidein {
	-webkit-animation: slidein 350ms backwards;
	animation: slidein 350ms backwards;
	animation-duration: 500ms;
	transition: .3s all;
}
.slideout {
	-webkit-animation: slideout 350ms backwards;
	animation: slideout 350ms backwards;
	animation-duration: 500ms;
	transition: .3s all;
}
.app-block .title {
	margin-bottom: .75rem;
}
.app-block {
	margin-bottom: 1.25rem;
}
.excharge_item {
	height: 100%;
}
label.required:before {
	content: "＊";
	color: #ff3860!important;
} 
.rental-read-text {
    overflow: auto;
    max-height: 450px;
    box-shadow: none;
    padding: 0;
}
.full-height {
	height: 100%;
}
.d-flex-column {
	display: flex;
	flex-direction: column;
}
.flex-grow-1 {
	flex-grow: 1!important;
}
.form-block .app-block {
	max-width: 1200px;
	margin: 0 auto;
}
.form-block .app-block + .app-block {
	margin-top: 1.5rem;
}
.normal-board iframe:not(.homepage_video) {
	height: 100%;
}
#form-confirm .control:not(.total-fee) {
	background: #f6f6f6;
    padding: .375rem 20px;
}
.excharge_item .field-label label {
	min-width: 50px;
} 
.excharge_item .field-body .field {
	text-align: justify;
} 
@media screen and (min-width: 769px) {
	.box.has-max-width-tablet {
		margin: 1rem auto;
		max-width: 1000px;
		padding: 2rem;
	}
	.app-block .field-body input,
	.app-block .field-body .field.has-addons {
		max-width: 300px;
	}
	.field.order-product .label {
	    max-width: 500px;
	}
	.search-bar .label:not(:first-child) {
		margin-left: 1rem;
	}
	.receive-info {
		height: 167px;
	}
	.form-block {
		padding: 3rem 2rem;
	}
}
@media screen and (max-width: 425px) {
	.shop-checkout .checkout-item .column:not(:first-child) {	
		padding-top: .25rem;
	}
	.cart-item-act {
		padding: 0;
	}
	.cart .tile.is-parent {
		padding: 0;
	}
	.cart .single-price,
	.cart .amount {
		text-align: left;
	}
	.product_board.pt-0-mobile {
		padding-top: 0;
	}
	.product-container .card-content {
		padding: 20px 15px;
	}	
	.field.is-grouped>.control:not(:last-child):not(.btn) {
	    /*margin-right: 0rem;*/
	}	
}
@media screen and (max-width: 768px) {	
	.excharge_item > .field {
		display: flex;
		justify-content: space-between;
	}
	.excharge_item > .field .control {
		text-align: right;
	}
	.field-body.text:not(.multi) >.field,
	.field-body.text.multi >.field > .control {
		padding-top: 0;
		margin-bottom: .5rem;
	}
	.venue-tab {
		border-radius: 0;
	}
	.section.top-sec {
		padding-top: .5rem;
		padding-right: 0;
		padding-left: 0;
	}
	.venue-selectblock .column:not(:last-child) {
		padding-bottom: 0;
	}
	.venue-selectblock {
		top: 67px;
		border-radius: 0;
	    max-width: 100%;
	}
	.appointment .year-month-col,
	.calendar-list .year-month-col {
	    position: sticky;
	    top: calc(67px + 108px - 12px);
	    z-index: 2;
	}
	.appointment.date-only .year-month-col,
	.calendar-list.date-only .year-month-col {
		top: calc(67px - 12px);
	}
	.appointment .year-month-block,
	.calendar-list .year-month-block {
		box-shadow: 0 2px 3px rgba(10, 10, 10, .1), 0 0 0 1px rgba(10, 10, 10, .1);
	}
	.timepicker {
		max-width: 200px;
	}	
	.search-bar .field-body {
		display: flex;
		max-height: 0;
		overflow: hidden;
		flex-wrap: wrap;
		transition: .5s max-height;
	}
	.search-bar .field-body.show {
		max-height: 500px;
	}
	.search-bar .field-body.show + .field .show-search-bar {
		margin-top: .25rem;
	}
	.show-search-bar {
		margin-bottom: -.5rem;
	}
	.search-bar .f-100-mobile {
		flex: 100%;
	}
	.search-bar .f-50-mobile-pl {
		flex: 50%;
		padding-left: .5rem;
	}
	.search-bar .f-50-mobile-pr {
		flex: 50%;
		padding-right: .5rem;
	}
	.search-bar {
		padding-bottom: 0;
	}
	.pagination-list {
	    min-width: calc(50% + 8px);
	}
	.pagination-previous, 
	.pagination-next {
		flex: calc(50% - 8px);
	}
	.table-box-container .field.is-horizontal,
	.table-box-info .field.is-horizontal,
	.vol-schedule-content .field.is-horizontal {
	    display: flex;
	    flex-wrap: wrap;
        margin-bottom: 1.25rem;
	}
	.table-box-container .field.is-horizontal:not(:last-child),
	.table-box-info .field.is-horizontal:not(:last-child) {
	    display: flex;
	    flex-wrap: wrap;
	    margin-bottom: 0;
	}
	.vol-schedule-content .field.is-horizontal:not(:last-child) {
	    display: flex;
	    flex-wrap: wrap;
	    margin-bottom: .375rem;
	}
	.table-box-container .field-label.is-normal,
	.table-box-info .field-label.is-normal,
	.vol-schedule-content .field-label.is-normal {
	    padding-top: .375em;
	}
	.table-box-container .field-label,
	.table-box-info .field-label,
	.vol-schedule-content .field-label {
	    flex-basis: 0;
	    flex-grow: 1;
	    flex-shrink: 0;
	    margin-right: 1.5rem;
	    text-align: right;
	}
	.table-box-container .field-body,
	.table-box-info .field-body,
	.vol-schedule-content .field-body {
	    display: flex;
	    flex-basis: 0;
	    flex-grow: 5;
	    flex-shrink: 1;
	}
	.search-form {
		position: sticky;
	    top: 119px;
	    z-index: 1;
	    margin: 0 -24px;
	    margin-bottom: 1rem;
	    padding: 12px;
	    background: #fff;
	    box-shadow: 0 2px 5px 1px rgba(0, 0, 0, .2);
	}
	.year-month-block {
	 	max-width: unset; 
	    margin: 0 -24px;
	    border-radius: 0;
	    box-shadow: 0 2px 5px 1px rgba(0, 0, 0, .2);
	}
	.appointment .year-month-block,
	.calendar-list .year-month-block {
		margin: 0 calc(-12px - .5rem);
	}
	.vol-schedule .calendar .column {
		padding: .25rem 0rem!important;
	}
	.vol-schedule .calendar .tag {
		padding: .25rem!important;
	}
	.vol-schedule .calendar .columns {
		margin-top: 25px;
	}
	.vol-schedule .calendar .columns:before {
	    content: attr(data-weekcount);
	    position: absolute;
	    top: -22px;
	    border-bottom: 1px solid #ccc;
	    display: block;
	    color: #999;
	    width: 100%;
	    font-size: 0.75rem;
	    padding-bottom: .1rem;
	}
	.calendar .box {
		padding: .25rem;
		text-align: center;
	}
	.vol-shift .search-bar {
		max-width: unset;	
		padding-bottom: 0;
	}
	.vol-shift .search-bar .field-body {
		display: flex;
	}
	.vol-shift .search-bar .field-body .field.is-grouped:first-child {
		flex: 1;
		margin-bottom: 0;
		margin-right: .5rem;
	}
	.vol-shift .box.on {
		background: #c9eaff;
	}
	.vol-shift .tile.is-vertical-tablet>.tile.is-child:not(:last-child) {
	    margin-bottom: 0rem !important;
	}
	.vol-shift .tile.is-vertical-tablet .ctn-block:not(:last-child) {
		margin-right: 0.5rem!important;
	}	
	.table-box-info .label,
	.table-box .label {
	    /*font-size: 0.9rem;*/
	    text-align: left;
	}					
	.table-box .field-body,	
	.table-box-info .field-body {		
	    /*margin-top: -5px;*/
	    margin-left: 15px;
	    flex: 50%;
	    min-width: calc(100% - 95px - 1.5rem);
	    word-break: break-word;
	}		
	.table-box-info .field.order-product .field-body,		
	.table-box-info .field.order-total .field-body {		
	    margin-top: 0px;
	}
	.ml-2 {
		margin-left: 0;
	}
	.field-body.is-grouped {
		display: flex;
	    flex-grow: 1;
	    flex-shrink: 1;
	}
	.field-body.is-grouped .field.is-expanded {
		flex-grow: 1;
		flex-shrink: 1;
	}	
	.field.order-product {
		margin-left: 0;
	}
	.button.page {
		display: none;
	}
	.table-box-info .field-label {
		padding-top: .2rem;
    	margin-bottom: 0;
	}
	.vol-schedule .calendar .box {
		height: 140px;
	}
}
@media screen and (max-width: 425px) {
	.field.order-product .label {
	    max-width: 150px;
	}
	.vol-schedule .calendar .box {
		height: 180px;
	}		
	.vol-schedule .shift-need {
		min-height: 108px;
	}
}
@media screen and (min-width: 1024px){	
	.columns.is-gapless>.column.is-offset-3-desktop,
	.is-offset-3-desktop {
	    margin-left: 25%;
	    overflow: hidden;
	}
	.column.is-1428-desktop {
	    flex: none;
	    width: 14.28%;
	}
}
@media screen and (max-width: 1023px) {	

	.appointment .calendar .columns:before,
	.calendar-list .calendar .columns:before {
	    content: attr(data-weekcount);
	    position: absolute;
	    top: -22px;
	    border-bottom: 1px solid #ccc;
	    display: block;
	    color: #999;
	    width: 100%;
	    font-size: 0.75rem;
	    padding-bottom: .1rem;
	}
	.appointment .calendar .columns,
	.calendar-list .calendar .columns {
		margin-top: 25px;
	}
	.appointment .calendar .column,
	.calendar-list .calendar .column {
		padding: .25rem 0rem!important;
	}
	.sticky-shop {
		top: 67px;
	}
	.calendar .box {
		padding: .5rem;
		text-align: center;
	}
	.menu-mainboard {
		position: sticky!important;
	    top: 67px!important;
	}
	.member-board > .field {
		padding-right: 20px;
		padding-left: 20px;
	}
	.member-describeTitle {
		padding-top: 1rem!important;
	}
	.member-describeTitle .title {
		display: none;
	}
	.member-content {
		padding-top: 1rem!important;
		padding-bottom: 1rem!important;
	}
	.member-board {
		max-width: none;
	}
	.menu-mainboard {
		position: relative;
	}
	.menu-board {		
		overflow-x: scroll;
    	overflow-y: hidden;
    	display: flex;
	    max-width: none;
	    border-bottom: 1px solid #ccc;
	}
	.menu-board::-webkit-scrollbar {
	    display: none;
	}
	.menu-board:before, 
	.menu-board:after { 
		content: "";
	    width: 30px;
	    height: 58px;
	    display: block;
	    position: absolute;
	    top: 0;
	}
	.menu-board:before { 
	    background: linear-gradient(to right, #fff, transparent);;
	    left: 0;
	}
	.menu-board:after { 
	    background: linear-gradient(to left, #fff, transparent);;
	    right: 0;
	}
	.menu-item {
		white-space: nowrap;
		margin-bottom: 0;
    	padding: 10px 24px 0px 24px;
	}
	.menu-item.is-active:after {
		content: "";
		height: 0.25rem;
		width: calc(100% + 36px);
		display: block;
		margin-top: 10px;
	    background: #d01347;
	    border-radius: 5px 5px 0 0;
	    margin-left: -18px;
	}
	.menu-item:not(.is-active):hover, 
	.menu-item:not(.is-active):focus, 
	.menu-item.is-active {
		background: transparent;
		color: #3c4043;
	}
	.menu-item .icon {
		display: none;
	}
}
@media only screen and (max-width: 768px){
	.member-board > .field .field-label {
		font-size: .9rem;
		margin-bottom: 0;
	}
	.vol-shift,
	.vol-schedule {
	    padding-top: 20px;
	}
	.bulletin-board {
	    padding-top: 30px;
	}
}
@media only screen and (max-width: 767px){
	.step-details .step-title {
		font-size: .9rem!important;
	}
	.step-details p:not(.step-title) {
	    display: none;
	}
}
@media only screen and (min-width: 1170px){
	.cd-timeline__date {
	    font-size: 1rem;
	}
}
@media only screen and (min-width: 768px){
	.cd-timeline__content p {
	    font-size: 1rem;
	}
	.is-vertical-tablet {
		flex-direction: column;
	}
}
@media screen and (min-width: 1024px){
	#navmain .navbar-item:not(:last-child):not(.has-dropdown):after, 
	#navmain .navbar-item:not(:last-child) .navbar-link:not(:last-child):after, 
	#navtop .navbar-item:not(:last-child):after {
		content: "";
		width: 1px;
		height: 0px;
		border-right: 1px solid #fff;
		border-radius: unset;
		position: relative;
		right: -12px;
	}
	.more-dropdown .navbar-item {
	    padding-right: 1rem!important;
	}
	.act-content .columns {
		margin-right: -12px!important;
		margin-left: -12px!important;
	}	
	.logo-reed.simplify {
		transform: scale(0.7);
	    top: -59px;
	}
	.article-cboard .content {
		max-width: 100%;
	}
}
@media only screen and (max-width: 1100px){
	.logo-reed.simplify {
		top: -46px;
    	transform: scale(0.5);
	}	
}
@media only screen and (max-width: 1169px){
	.cd-timeline__date {
	    padding-top: 0;
	}
	.cd-timeline__img.cd-timeline__img--picture {		
		height: 20px;
	    width: 20px;
	    font-size: 1rem;
	    top: 10px;
	}
	.cd-timeline__container::before {
		left: 10px;
	}
	.cd-timeline__content {
		margin-left: 30px;
	}		
	.cd-timeline__block.show { 
	    -webkit-animation-name: fadeInUp;
	    animation-name: fadeInUp;
	}
}
@media screen and (max-width: 1025px){
	.vol-schedule .tag {
		padding: 0 5px;
	}
}
@media screen and (max-width: 1023px){
	.ad-carousel {
		max-height: unset;
	}
	.navbar-brand img {
		max-height: 67px;
		padding: 5px 0;
	}
	#main-bd {
		top: 15px;
	}
	.main-navR .navbar-item:first-child, 
	.main-navL .navbar-item:last-child {
		margin: 0; 
	}
	.logo-reed {
		left: -90px;
    	transform: scale(0.8);
    	top: -51px;
	}
	.navbar-brand {
		margin-left: 92px;
	}	
	.main-nav-wrap {
		background: transparent;
		margin-left: 90px;
		width: 0;
	}
	.main-nav-wrap.is-active {
		width: auto;
	}
	#navmain {
		z-index: 32;
    	position: relative;
	}
	.zindex31 {
		z-index: 30!important;
	}
	#navmain .navbar-item, 
	#navmain .navbar-link {
		color: #4a4a4a!important;
	}
	.navbar-dropdown {
		display: none;
	}
	#navbar-main #navmain .navbar-item.has-dropdown .navbar-link + label {
		position: absolute;
	    width: 20%;
	    height: 100%;
	    top: 0;
	    right: 0;
	}
	#navbar-main #navmain .navbar-item.has-dropdown .navbar-link + label .arrow {
		border: 1px solid transparent;
	    border-radius: 2px;
	    border-right: 0;
	    border-top: 0;
	    display: block;
	    height: .9em;
	    margin-top: -.4375em;
	    position: absolute;
	    top: 16px;
	    -webkit-transform: rotate(-45deg);
	    transform: rotate(-45deg);
	    -webkit-transform-origin: center;
	    transform-origin: center;
	    width: .9em;
	    border-color: #3273dc;
	    margin-top: -.375em;
	    right: 25px;
	    transition: transform .3s;
	}
	#navbar-main #navmain .navbar-item.has-dropdown .navbar-link + label .arrow.active {
		transform: rotate(135deg);
	}
	#navbar-main #navmain .navbar-item.has-dropdown .navbar-link {
		width: 80%;
	}
	.owl-dots {
		bottom: 10px;
	}
	.round-btn {
		width: 60px;
		height: 60px;
	}
	.common-use-links {
		margin: 0;
	}
	.common-use-links .column {
		padding: .1rem;
	}
	.common-use-links .column a {
		padding: 1rem;
		border: 1px solid #ccc;
	}
	.common-use-links::after {
		display: none;
	}
	.act-calendar .hero-body {
		padding: 0;
	}
	.date-blks>div {
		padding: .5rem;
	}
	.py-1-mobile {
		padding-top: .5rem;
		padding-bottom: .5rem;
	}	
	.date-blks div .date-blk::after {
		font-size: 1rem;
	}
	.date-blk span {
		font-size: 1.5rem;
    	margin-top: 1rem;
	}	
	.date-blks div .date-blk::after {
		top: 5px;
		left: 5px;
	}
	.logo-reed.simplify {
		transform: scale(0.55) translateY(-66px);
		height: 112px;
		background: transparent;
		/*overflow: hidden;*/
	}	
	.logo-reed.simplify img {
		top: 0;
		height: 100px;
	}
	.logo-reed.simplify::before {
		/*content: none;*/
		transition: all .3s;
    	transition-timing-function: ease-out;
		transform: rotateX(-90deg);
		transform-origin: bottom;
	}
	.breadcrumb {
		margin-left: 102px;
	}
	.main-loader {
		top: 67px;
		height: calc(100vh - 67px);
	}
	.ama-box .box { 
		width: 32%;
	}
	.gird-sizer {
		width: 32%;
	}
	#modal-container {
	    height: calc(100% - 67px);
	    top: 67px;
	}
	#cus-footer {
	    margin-top: 0;
	    top: 15px;
	}
	#modal-container .cus-modal-background .cus-modal {
	    max-height: calc(100vh - 144px);
	}	
}
@media screen and (max-width: 768px){
	.flex-order-1-tablet {
		order: 1;
	}
	.flex-order-2-tablet {
		order: 2;
	}
	.bordered-mobile {
		border-top: 1px solid #ccc;
		padding-top: 0;
		padding-bottom: 0;
	}	
	.date-blks>div {
		padding: 0;
	}
	.date-blks .date-blk {
		border-top: unset;
		border-bottom: unset;
		border-right: unset;
	}
	.date-blks >div:last-child .date-blk {		
		border-right: 1px solid #ccc;
	}
	.date-blks div .date-blk::after {
		font-size: .75rem;
	}
	.date-blk span {
		font-size: 1rem;
    	margin-top: 1rem;
	}
	.month-text {
	    bottom: 10px;
	}
	.position-topright {
		position: absolute;
		top: 0;
		right: 0;
	}
	.date-blks div .date-blk::after {
		top: 0;
		left: 0;
	}
	.date-blks div:nth-child(1) .date-blk::after {
		content: "Su.";
	}
	.date-blks div:nth-child(2) .date-blk::after {
		content: "Mo.";
	}
	.date-blks div:nth-child(3) .date-blk::after {
		content: "Tu.";
	}
	.date-blks div:nth-child(4) .date-blk::after {
		content: "We.";
	}
	.date-blks div:nth-child(5) .date-blk::after {
		content: "Th.";
	}
	.date-blks div:nth-child(6) .date-blk::after {
		content: "Fr.";
	}
	.date-blks div:nth-child(7) .date-blk::after {
		content: "Sa.";
	}	
	.date-modal {
		justify-content: flex-start;
	}
	.date-modal .modal-content {
		top: 20px;
	}
	.btn-result .date-rlt {
		font-size: .8rem;
	}
	.info-type {
		padding: .5rem;
		border-bottom: 1px solid #ccc;
	}	
	.act-calendar .hero-body.no-top-mobile {
		border-top: none;
	}
	.footer-blk .content {
		padding: .5rem .5rem;
	}
	.homepage .article-type-text {
		flex-direction: row;
		top: 0;
	}
	.homepage .article-type-text .icon {
		font-size: 1rem !important;
	}
	.homepage .cweek-info .image,
	.homepage .cweek-info .content {
		display: none;
	}
	.homepage .article-date {
		margin-left: 92px;
	}
	.info-type-group .column:nth-child(odd) .info-type {	
		border-left: 1px solid #ccc;
	}
	.article-tboard-title .title {
		font-size: 1.4rem; 
	}
	.article-tboard-title .subtitle,
	.section.bg-cis.is-clipped .subtitle {
	    font-size: 1rem;
	}
	.ama-box .box { 
		width: 100%;
		padding: .75rem;
	}
	.ama-box .box { 
		width: 49%;
	}
	.gird-sizer {
		width: 49%;
	}
	.ama-info .media-left {
		margin-right: 0.5rem;
	}
	.ama-info .image.is-48x48 {
		width: 32px;
		height: 32px;
	}
	.media.ama-info .content {
		font-size: 1.1rem;
	}
	#modal-container .cus-modal-background .cus-modal {
		width: calc(100vw - 10px);
	    padding: 20px;
	    max-height: calc(100vh - 142px);
	}
	#modal-container .content .pic {
		float: unset;
		margin-right: 0;
	}
	.cd-timeline__container {
		width: 95%;
		margin-right: 5px;
	}
	.qna-container {
	    padding-top: .5rem;
	}
	.qna-container .title {
		font-size: 1.1rem;
		padding: 16px 72px 16px 24px;
	}	
	.qna-container .anser {
		padding: 16px 24px;
	}	
	.homepage_video {
		height: 360px;
	}
}

/******** Module image **********/
/* Style the Image Used to Trigger the Modal */
.myImg {
    border-radius: 5px;
    cursor: pointer;
    transition: 0.3s;
}

.myImg:hover {opacity: 0.7;}

/* The Modal (background) */
.modal:not(.datetimepicker-wrapper):not(.detail-modal):not(.document-modal) {
    display: none; /* Hidden by default */
    text-align: center;
    align-items: center;
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 167px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
}
.modal img {
	max-height: calc(100vh - 220px);
}
.modal .close {
	margin-right: 30px;
    background: rgba(255, 255 ,255 , 0.5);
    padding: 0 5px;
    border-radius: 50px;
    position: absolute;
    top: 139px;
    right: 0;
    transition: all .3s;
}
.modal .close:hover {	
	cursor: pointer;
    background: rgba(255, 255 ,255 , 1);
}
@media screen and (max-width: 1087px ){
	.modal .close {
	    top: 77px;
	}
}
@media screen and (max-width: 1024px) {
    iframe {
        max-height: 50vh;
    }
}

/* Modal Content (Image) */
.modal:not(.datetimepicker-wrapper) .modal-content {
    margin: auto;
    display: block;
    max-width: 700px;
}

/* Caption of Modal Image (Image Text) - Same Width as the Image */
#caption {
    /*margin: auto;*/
    display: block;
    width: 80%;
    max-width: 700px;
    text-align: center;
    color: #ccc;
    padding: 10px 0;
    height: 50px;
}

/* Add Animation - Zoom in the Modal */
.modal-content, #caption { 
    -webkit-animation-name: zoom;
    -webkit-animation-duration: 0.6s;
    animation-name: zoom;
    animation-duration: 0.6s;
}

/* fenhui info */
.custom-button {
	background-color: #f5f5f5;
	border: none;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	border-radius: 8px;
	color: #4a4a4a;
	padding: 10px 20px;
	transition: all 0.3s ease;
}
.custom-button:hover {
	background-color: #e0e0e0;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}
.custom-button:focus {
	outline: none;
	box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.25);
}