/*========================================================
                        About
=========================================================*/
div.about_02_01 ul {}

@media (min-width: 768px) {
	div.about_02_01 ul {
		display: flex;
	}
	div.about_02_01 ul.th {
		background: #8867CD;
		color: #fff;
		text-align: center;
		border-bottom: 3px #663EB9 solid;
		margin-bottom: 0;
	}
	div.about_02_01 ul li { padding: 6px;}
	div.about_02_01 ul li:nth-child(1) { width: 12%; text-align: center;}
	div.about_02_01 ul li:nth-child(2) { width: 12%; text-align: center;}
	div.about_02_01 ul li:nth-child(3) { width: 25.333%;}
	div.about_02_01 ul li:nth-child(4) { width: 25.333%;}
	div.about_02_01 ul li:nth-child(5) { width: 25.333%;}

	div.about_02_01 ul.td { margin-bottom: 0;}
	div.about_02_01 ul.td li {
		border-bottom: 1px #C3C3C3 solid;
		border-left: 1px #C3C3C3 solid;
	}
	div.about_02_01 ul.td li:last-child { border-right: 1px #C3C3C3 solid;}
	div.about_02_01 ul.td li span { display: none;}
}
@media only screen and (min-width: 576px) and (max-width: 991px) {
	div.about_02_01 ul li { font-size: 15px;}
}
@media (max-width: 767px) {
	div.about_02_01 ul.th { display: none;}
	div.about_02_01 ul.td { padding-bottom: 7px; border-bottom: 2px #C3C3C3 solid;}
	div.about_02_01 ul.td:last-child { border-bottom: 0;}
	div.about_02_01 ul.td li { display: flex; word-break: keep-all;}
	div.about_02_01 ul.td li span { display: inline-block; flex: 1;}
	div.about_02_01 ul.td li div { flex: 5; word-break: normal;}
}
@media (max-width: 575px) {
	div.about_02_01 ul.td li div { flex: 3; word-break: normal;}
}
div.about_02_01 ul.td:nth-child(even) { background: #F6F6F6;}






div.about_02_02 div {}
@media (min-width: 992px) {
	div.about_02_02 div { width: 85%; margin: 0 auto;}
}

div.about_02_02 div h3 { text-align: center; font-size: 22px; font-weight: bold;}
div.about_02_02 div table th{ width: 15%; padding: 3px 10px;}
div.about_02_02 div table td{ padding: 3px;}

@media only screen and (min-width: 576px) and (max-width: 991px) {
	div.about_02_02 div table th{ width: 20%;}
}
@media (max-width: 575px) {
	div.about_02_02 div table th{ width: 30%;}
}






div.about_02_03 div {}
@media (min-width: 992px) {
	div.about_02_03 div { width: 85%; margin: 0 auto;}
}

div.about_02_03 div h3 { text-align: center; font-size: 22px; font-weight: bold;}
div.about_02_03 div table th{ width: 15%; padding: 3px 10px;}
div.about_02_03 div table td{ padding: 3px;}

@media only screen and (min-width: 576px) and (max-width: 991px) {
	div.about_02_03 div table th{ width: 20%;}
}
@media (max-width: 575px) {
	div.about_02_03 div table th{ width: 30%;}
}







div.about_03 ul li {
    text-indent: -90px;
    padding-left: 90px;
    margin-top: 15px;
}
div.about_03 ul li ol li, div.about_03 ul li ul li {
    text-indent: 0px;
    padding-left: 0px;
    margin-top: 0px;
}
div.about_03 p.ps { font-size: 14px; line-height: 150%;}








/*========================================================
                        News
=========================================================*/
div.news ul.list_td {
	border-bottom: 1px #bbb solid;
	margin-bottom: 5px;
}
div.news ul.list_td li { padding: 8px; font-family: 'Cabin',"Microsoft JhengHei", sans-serif;}
div.news ul.list_td:hover { background: #E8E8E8;}


@media (max-width: 991px) {
	div.news ul.list_td { padding: 10px 0;}
	div.news ul.list_td li { padding: 0;}
}
@media (min-width: 992px) {
	div.news ul.list_td:nth-child(odd) { background: #F3F3F3;}
	div.news ul.list_td li:nth-child(1) { text-align: center;}
	div.news ul.list_td li:nth-child(2) { text-align: center;}
	div.news ul.list_td li:nth-child(2) span { display: none;}
}


div.news.info .date { font-family: 'Cabin', sans-serif;}
div.news.info h3 {
	font-family: 'Cabin','Noto Sans TC', sans-serif;
}

div.news.info div.info {
	background-color: #FAFAFA;
	border-top: 1px #bbb solid;
	border-bottom: 1px #bbb solid;
	margin-bottom: 5px;
}
div.news.info div.info img {
	max-width: 100%;
	height: auto;
}
@media (min-width: 992px) {
	div.news.info div.info { padding: 15px;}
}
div.news.info div.ps {
    font-size: 15px;
    color: #6F5E76;
    text-align: right;
	font-family: 'Cabin',"Microsoft JhengHei", sans-serif;
}

@media (max-width: 991px) {
    div.regBtn>div {display: inline-block;}
}









/*========================================================
                        guideline
=========================================================*/
div.guideline {}

div.guideline ul { margin-bottom: 0;}
div.guideline ul li {
	margin: 0 0;
	padding-top: 15px;
	padding-bottom: 12px;
	border-bottom: 1px dashed #7C7C7C;
	font-family: 'Cabin',"Microsoft JhengHei", sans-serif;
	text-indent: -32px;
	padding-left: 50px;
}
div.guideline ul li:hover { background: #E7E7E7;}
div.guideline ul li span { margin-right: -10px; color: #662974;}
div.guideline ul li:last-child { border-bottom: none; padding-bottom: 0;}
div.guideline ul li:last-child:hover { background: none;}

div.guideline ul li ul { margin-left: -50px;}
div.guideline ul li ul {
	margin-top: 10px;
	border-top: 1px dashed #7C7C7C;
}
div.guideline ul li ul li {
	padding: 7px 0 7px 88px;
	margin-bottom: 0;
	border-bottom: none;
	text-indent: -25px;
	border-bottom: 1px dashed #7C7C7C;
}
div.guideline ul li ul li span { color: #966DA0; font-size: 70%; margin-right: -5px;}
div.guideline ul li ul li:last-child { border-bottom: none;}
div.guideline ul li ul li:last-child:hover { background: #E0E0E0;}


@media (min-width: 768px) {
	div.guideline {
		border: 1px solid #5C5C5C;
		padding: 20px;
	}
	div.guideline::before { border-top: 5px #5C5C5C solid;}
}









/*========================================================
               Member  login
=========================================================*/
div.login {
	margin: 0 auto;
/*	padding: 30px 6% 0 6%;*/
	background: rgb(247, 247, 247);
	border: 1px solid rgba(147, 184, 189,0.8);
	-webkit-box-shadow: 0pt 2px 5px rgba(105, 108, 109,  0.2),	0px 0px 8px 5px rgba(208, 223, 226, 0.4) inset;
	   -moz-box-shadow: 0pt 2px 5px rgba(105, 108, 109,  0.2),	0px 0px 8px 5px rgba(208, 223, 226, 0.4) inset;
	        box-shadow: 0pt 2px 5px rgba(105, 108, 109,  0.2),	0px 0px 8px 5px rgba(208, 223, 226, 0.4) inset;
	-webkit-box-shadow: 5px;
	-moz-border-radius: 5px;
		 border-radius: 5px;
}
div.login form { padding: 30px 6% 20px 6%;}

div.login h3 {
    text-align: center;
    margin: 0; padding: 0;
    letter-spacing: 4px;
    position: relative;
	font-family: 'Monoton', 'Noto Sans TC', sans-serif;
	font-size: 38px;
}
div.login h3:after, div.login h3:before {
    background-color: #777;
    content: "";
    height: 1px;
    position: absolute;
    top: 25px;
}

div.login h3:after { 
    background-image: -webkit-gradient(linear, left top, right top, from(#777), to(#fff));
    background-image: -webkit-linear-gradient(left, #777, #fff);
    background-image: -moz-linear-gradient(left, #777, #fff);
    background-image: -ms-linear-gradient(left, #777, #fff);
    background-image: -o-linear-gradient(left, #777, #fff);
    background-image: linear-gradient(left, #777, #fff);      
    right: 0;
}

div.login h3:before {
    background-image: -webkit-gradient(linear, right top, left top, from(#777), to(#fff));
    background-image: -webkit-linear-gradient(right, #777, #fff);
    background-image: -moz-linear-gradient(right, #777, #fff);
    background-image: -ms-linear-gradient(right, #777, #fff);
    background-image: -o-linear-gradient(right, #777, #fff);
    background-image: linear-gradient(right, #777, #fff);
    left: 0;
}
@media (max-width: 390px) {
	div.login h3:after, div.login h3:before { width: 18%;}
	div.login h3 { letter-spacing: 0;}
	div.login h3.pass:after, div.login h3.pass:before { width: 0%; letter-spacing: -1px;}
}
@media only screen and (min-width: 391px) and (max-width: 500px) {
	div.login h3:after, div.login h3:before { width: 24%;}
	div.login h3.pass:after, div.login h3.pass:before { width: 5%;}
}
@media only screen and (min-width: 501px) and (max-width: 767px) {
	div.login h3:after, div.login h3:before { width: 28%;}
	div.login h3.pass:after, div.login h3.pass:before { width: 13%;}
}
@media (min-width: 768px) {
	div.login { width: 75%;}
	div.login h3 { font-size: 45px;}
	div.login h3:after, div.login h3:before { width: 25%; top: 28px;}
	div.login h3.pass:after, div.login h3.pass:before { width: 11%;}
}
@media (min-width: 992px) {
	div.login h3 { font-size: 50px;}
	div.login h3:after, div.login h3:before { width: 30%; top: 32px;}
	div.login h3.pass:after, div.login h3.pass:before { width: 18%;}
}
@media (min-width: 1200px) {
	div.login h3 { font-size: 55px;}
	div.login h3:after, div.login h3:before { top: 35px;}
}
div.change_link {
	color: rgb(127, 124, 124);
/*
	left: 0px;
	height: 20px;
	padding: 17px 30px 20px 30px; margin-bottom: 0;
*/
	text-align: right;
	border-top: 1px solid rgb(219, 229, 232);
	-webkit-border-radius: 0 0  5px 5px;
	   -moz-border-radius: 0 0  5px 5px;
	        border-radius: 0 0  5px 5px;
	background: rgb(225, 234, 235);
	background: -moz-repeating-linear-gradient(-45deg, 
	rgb(247, 247, 247) , 
	rgb(247, 247, 247) 15px, 
	rgb(225, 234, 235) 15px, 
	rgb(225, 234, 235) 30px, 
	rgb(247, 247, 247) 30px
	);
	background: -webkit-repeating-linear-gradient(-45deg, 
	rgb(247, 247, 247) , 
	rgb(247, 247, 247) 15px, 
	rgb(225, 234, 235) 15px, 
	rgb(225, 234, 235) 30px, 
	rgb(247, 247, 247) 30px
	);
	background: -o-repeating-linear-gradient(-45deg, 
	rgb(247, 247, 247) , 
	rgb(247, 247, 247) 15px, 
	rgb(225, 234, 235) 15px, 
	rgb(225, 234, 235) 30px, 
	rgb(247, 247, 247) 30px
	);
	background: repeating-linear-gradient(-45deg, 
	rgb(247, 247, 247) , 
	rgb(247, 247, 247) 15px, 
	rgb(225, 234, 235) 15px, 
	rgb(225, 234, 235) 30px, 
	rgb(247, 247, 247) 30px
	);
}
div.change_link p { margin: 0; padding: 15px 6%;}









/*========================================================
               Member 會員專區
=========================================================*/
div.main_regA {}
div.main_regB {}
div.main_regB h3 {
    font-size: 1.3em;
    letter-spacing: 1px;
    font-family: 'Noto Sans TC', sans-serif;
}

div.main_regB ul {
    margin: 0;
	padding-left: 0;
    list-style: none;
	border-bottom: 1px #bdccd9 solid;
}

@media (max-width: 991px) {
    div.main_regB ul { margin-bottom: 10px;}
    div.main_regB ul li:last-child { padding-bottom: 10px;}
    div.main_regB ul:last-child { border-bottom: none; margin-bottom: 0;}
}
@media (min-width: 992px) {
	div.main_regB { margin: 0 auto;}
	div.main_regB ul {
		display: flex;
		align-items: stretch; /*上下對齊*/
	}
    div.main_regB ul li {
        display: flex;
        justify-content: center;
        align-items: center;
        box-sizing: border-box;
        padding: 8px;
    }
}






/*繳費紀錄*/
@media (max-width: 991px) {
    div.main_regB ul.th { display: none;}
}
@media (min-width: 992px) {
    div.main_regB ul.th li, div.main_regB ul.td li { flex: 1;}
    div.main_regB ul.th li:last-child, div.main_regB ul.td li:last-child { flex: 2;}

    div.main_regB ul.th {
        border-bottom: 3px #bdccd9 solid;
    }
    div.main_regB ul.th li { background: #EDF2F6; color: #3675B2;}
    div.main_regB ul.td li span { display: none;}

    div.main_regB ul.td:nth-child(even) { background: #f9f9f9;}
    div.main_regB ul.td:hover { background: #eafaff;}
}






/*線上繳費*/
div.payList {
	display: flex;
	align-items: stretch;
	flex-wrap: wrap;
}
div.payList div.paytd {
	display: flex;
	justify-content: center;
	align-items: center;
	box-sizing: border-box;
}
div.payList div.paytd {
	text-align: center;
}
div.payList div.paytd .item { background: #EFF3F7; padding-bottom: 5px; color: #576AB1;}
div.payList div.paytd span {
	display: block;
	padding: 7px 25px;
	border-bottom: 2px #BDCCD9 solid;
	background: #E6ECF2;
	margin-bottom: 5px;
	color: #3E3A39;
}






/*藥物登錄*/
div.memberC a.card {
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 22px;
	border-radius: 5px;
	background: #fff;
	display: block;
	box-shadow: 0 6px 10px rgba(0,0,0,.08), 0 0 6px rgba(0,0,0,.05);
	transition: .3s transform cubic-bezier(.155,1.105,.295,1.12),.3s box-shadow,.3s -webkit-transform cubic-bezier(.155,1.105,.295,1.12);
	padding: 18px 80px 18px 36px;
	cursor: pointer;
	height: 150px;
	border-top: 2px solid #18B1C3;
}
div.memberC a.card:hover {
	transform: scale(1.05);
	box-shadow: 0 10px 20px rgba(0,0,0,.12), 0 4px 8px rgba(0,0,0,.06);
}
div.memberC a.card-1{
	background: url(../files/member03/card_01.png) right no-repeat;
	background-size: contain;
}
div.memberC a.card-2{
	background: url(../files/member03/card_02.png) right no-repeat;
	background-size: contain;
}

@media (min-width: 992px) {
	div.memberC a.card { height: 180px;}
}
@media (min-width: 1200px) {
	div.memberC a.card { height: 200px;}
}









/*========================================================
                   People  link
=========================================================*/
div.link h3 { margin-bottom: .7rem;}
div.linkA { text-align: center;}
div.linkA img {
    max-width: 100%;
    height: auto;
	border-radius: 5px;
    border: 1px solid #cccccc;
	border-top: 2px solid #6C39C6;
	margin-bottom: 3px;
}
div.linkA span { display: block;}