/*設計專用樣式Start*/
:root {
    --yellow: #f7da64;
    --orange: #E36424;
    --deep-pink: #cf128b;
    --gray: #f3f3f3;
    --dark-gray: #343a40;
    --black: #212529;
    --blue: #3BAFDA;
    --green: #199b7e;
    --bright-green: #50e3c2;
    --light-green: #dcfaf3;
}
/* 主圖 */
.banner {width: 1200px;margin: 0 auto;position: relative;height: 641px;}
.banner_pc {top: 12%;right: 0%; position: absolute;}
.banner_mb{display: none;}
/*數據科學學程探索與應用*/
section h1 {font-size: 3.6rem;font-weight: bold;text-align: center;display: inline-flex;-webkit-background-clip: text;color: transparent;background-image: linear-gradient(-25deg,#0f0a4e 30%,#276aab 53%,#7cb1e3 60%,#0f0a4e 70%);font-family: "Microsoft YaHei", "Microsoft Yi Baiti", "Arial Unicode MS";position: relative;}
section h1:before {background-image: linear-gradient(45deg,#0f0a4e 30%,#276aab 53%);width: 20%;height: 6px;content: '';position: absolute;top: 50%;left: -24%;}
section h1:after {background-image: linear-gradient(-45deg,#0f0a4e 30%,#276aab 53%);width: 20%;height: 6px;content: '';position: absolute;top: 50%;right: -24%;}
section header {text-align: center;}
#Master_title h1 {font-size: 5rem;}
.subtitle {font-size: 3rem;}
.theme {font-size: 1.75rem;text-align: center;padding: 2% 3% 2% 10%;margin-top: -16%;color: #0f0a4e;line-height: 2.5rem;background: linear-gradient(to right,#bfd7ee00 0%,#bfd7eee3 15%,#ffffff 70%,#ffffff 90%,#ffffff00 100%);}
.howto {text-align: center;}
.howto li {font-size: 2.75rem;padding: 0.5rem 0;display: inline-block;margin: 0.5rem;background: linear-gradient(to bottom,rgba(255,255,255,0) 0,rgba(255,255,255,0) 70%,rgba(80,227,194,.5) 70%,rgba(80,227,195,.5) 100%);}
.howto li:nth-child(1) {font-size: 3.75rem;}
.howto li:nth-child(3) {font-size: 4.0rem;}
.howto li:last-child {background:none;border-bottom: dotted 2px;}
.how{font-size: 2.0rem;padding-top: 1%;display: inline-block;background: linear-gradient(to bottom,rgba(255,255,255,0) 0,rgba(255,255,255,0) 70%,rgba(80,227,194,.5) 70%,rgba(80,227,195,.5) 100%);}

/*結合專業，跨領域提升自我競爭力！*/
.chart {display: flex;flex-wrap: wrap;align-items: center;width: 100%;}
.chart_box {text-align: center;margin: 2rem auto;width: 45%;}
.graduate {width: 25%;}
.chart_box img {max-width: 100%;}
.graduate {display: flex;flex-wrap: wrap;padding: 0% 0;flex-direction: column;}
.graduate:first-of-type dl {margin: auto 2rem auto auto;}
.graduate dl {width: calc(100%/1 - 1rem);margin: 1.5rem auto 1.5rem 2rem;}
.graduate dl dt {color: #000;font-size: 1.5rem;padding: 0.5rem 0;border-radius: 0.5rem;text-align: center;position: relative;}
.graduate dl dt.dt1 {background-color: #62dbf9;}
.graduate dl dt.dt2 {background-color: #73f4c5;}
.graduate dl dt.dt3 {background-color: #ffe0c4;}
.graduate dl dd {font-size: 1.25rem;margin-top: 1%;}
.extend-btn {text-align: center;}
.extend-btn a {color: #ffffff;display: inline-block;padding: 0.5rem 1.5rem;border-radius: 2rem;margin: 0.5rem;font-size: 1.5rem;text-decoration: none;background-image: linear-gradient(-25deg,#0f0a4e 30%,#185795 53%,#0f0a4e 70%);cursor: pointer;}

/*雙領域師資，獨家、創新、專業！*/
.teacher_item {display: flex;flex-wrap: wrap;align-items: flex-end;}
.teacher_pic {display: flex;flex-wrap: wrap;justify-content: center;width: 50%;padding-top: 1rem;}
.teacher_pic li {position: relative;text-align: center;/*margin-left: -5%;width: 50%;*/}
.teacher_pic li span {position: absolute;bottom: 0;left: 0;right: 0;color: white;font-size: 2rem;text-shadow: -1px -1px 0 #000, 1px -1px 0 #000,-1px 1px 0 #000, 1px 1px 0 #000;}
.teacher_pic li small {font-size: 1.125rem;}
.teacher_pic img {max-width: 100%;}
.teacher_intro {text-align: left;width: 50%;}
.teacher_intro dl {display: flex;flex-wrap: wrap;align-items: center;margin: 0.5rem auto;}
.teacher_intro dt {background-image: linear-gradient(-25deg,#f1581c 30%,#ff9e78 53%,#ff733c 70%);justify-content: center;display: flex;align-items: center;width: 12rem;height: 8rem;color: #ffffff;    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 48% 100%, 1% 75%, 0 25%);text-align: center;font-size: 2.0rem;margin: auto 1rem auto auto;}
.teacher_intro dd {font-size: 1.4rem;width: calc(100% - 13rem);color: #f1581c;border-bottom: dotted 1px #f1581c;padding-bottom: 2%;}

/*數據科學學程規劃*/
.innovate {color: #ff804e;transform: skewX(-10deg);display: inline-block;margin-right: 0.5rem;}
.plan_des {padding: 1rem 0;font-size: 1.5rem;color: #0f0a4e;text-align: center;}
.plan_menu {display: flex;flex-wrap: wrap;text-align: center;}
.plan_menu a {width: calc(100%/2);font-size: 1.5rem;padding: 0.5rem;cursor: pointer;border-bottom: 2px solid #10cfa8;text-decoration: none;}
.plan_menu a.active {border: 1px solid #10cfa8;border-bottom: 0;border-radius: 0.5rem 0.5rem 0 0;background-color: #10cfa8;color: white;}
.plan_content {background-color: var(--light-green);padding: 2rem 2rem 1rem;font-size: 1.125rem;text-align: center;}
.plan_content table {border-collapse: collapse;width: 100%;background-color: white;}
.plan_content table th {background-color: #48c7c687;padding: 0.5%;border: 1px solid #48c7af;}
.plan_content table td {padding: 0.5%;border: 1px solid #48c7af;}
.utility {display: flex;flex-wrap: wrap;}
.utility li {width: calc(100%/3);text-align: left;padding: 0.25rem 5%;}
.circle {background-color: var(--bright-green);width: 1.35rem;height: 1.35rem;display: inline-flex;align-items: center;justify-content: center;color: white;border-radius: 50%;margin-right: 0.25rem;font-size: 1rem;}
.add-in {padding: 0.8rem 0;font-size: 1.4rem;}
.add-in li:nth-child(1) {font-size: 1.7rem;color: #ff804e;}
.add-in li span {background: linear-gradient(to bottom,rgba(255,255,255,0) 0,rgba(255,255,255,0) 70%,rgba(80,227,194,.5) 70%,rgba(80,227,195,.5) 100%);margin: auto 0.25rem;padding: 0 0.25rem 0 0.125rem;}
.center-class .utility li {width: calc(100%/2);}
.center-class tr td:first-of-type {width: 20%;}

/*關聯學科‧非讀BOOK*/
.book-intro {display: flex;flex-wrap: wrap;align-items: center;}
.book-intro figure {width: 24%;order: 2;}
.book-intro figure img {width: 100%;}
.book-detail {width: 65%;font-size: 1.25rem;text-align: left;order: 1;}
.book-detail p {padding: 0 1rem 1rem 0;color: #0f0a4e;font-size: 1.4rem;line-height: 2.2rem;}

/*立即成為AI跨領域人才*/
.pulse {animation: pulse 1.5s infinite;}
#event_fourth h1 span {color: #ff804e;transform: skewX(-10deg);display: block;text-align: center;}
.price {font-size: 2rem;padding: 1rem;color: #0f0a4e;border-radius: 1.5rem;margin: 2% 0;background: linear-gradient(to right,#ffffff 65%,#bfd7ee8c 100%);text-align: center;}
.price strong {font-size: 2.5rem;color: #ff804e;}
.price .icon {font-size: 1.75rem;color: #ff804e;}
.price .icon:last-of-type {padding-right: 0.25rem;}
.price .opacity {opacity: 0.5;padding-left: 2rem;}
.bookreviews {padding: 4% 0 0;}
/*設計專用樣式END*/

/*css reset 歸0*/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,caption,tfoot,thead {margin:0;padding:0;border:0;outline:0;}
blockquote,q {quotes:none}
blockquote:before,blockquote:after,q:before,q:after {content:'';content:none;}
/*remember to define focus styles!*/
:focus {outline:0;}
* {box-sizing: border-box;}
ins {text-decoration:none;}
del {text-decoration:line-through;}
body {font-family:"Microsoft YaHei", 微軟正黑體, Arial;}
a {text-decoration:underline;color: inherit;}
a:hover {text-decoration:none;}
ul,li,dd,ol {margin:0;padding:0;list-style-type:none;}

/*Back to top button */
#back-top {position: fixed;bottom: 30px;margin-left: -150px;right: 1%;z-index: 99;}
#back-top a {width:50px;height:50px;border-radius:50%;display: block;text-align: center;font: 11px/100% Arial, Helvetica, sans-serif;text-transform: uppercase;text-decoration: none;color: #bbb;transition: 1s;}
#back-top a:hover {color: #000;}
/*arrow icon (span tag)*/
#back-top span {width:50px;height:50px;display: block;margin-bottom: 7px;background: rgba(99, 99, 99, 0.74) url(../../images/up-arrow.png) no-repeat center center;/*rounded corners*/border-radius:50%;/*background color transition*/transition: 1s;}
#back-top a:hover span {background-color: #777;}

/*共用*/
.bgcolor0 {background: url(../../images/1206038_01.png) no-repeat left top ,linear-gradient(to right,#bfd7eee3 15%,#ffffff 70%,#ffffff 88%,#c9d8e5 98%);background-size: 100%;}
.bgcolor1 {background: url(../../images/1206038_bg.png) repeat-y fixed,linear-gradient(to right,#bfd7eee3 15%,#ffffff 70%,#ffffff 88%,#c9d8e5 98%);}
.bgcolor2 {background-color: #d1f6ff;}
.bgcolor3 {background-color: #d1fffa;}

.ft_NOTO {font-family: 'Noto Sans TC', sans-serif;}
.ft_NOTOSer {font-family: 'Noto Serif TC', serif;}
.ft_Meiro {font-family: Meiryo, "Meiryo UI", Arial, sans-serif;}

#askarea_out {background-color: var(--dark-gray);}
#askarea_out input, #askarea_out select {color: rgb(82, 80, 80);padding: 0 0.4rem;}
#askarea input[type="submit"],#askarea input[type="reset"] {color: white;}
#askarea_out img {width: 25%;display: inline-block;margin: 0.5rem 0;}
.asktitle strong {padding-right: 0.5rem;}
.ad_link{position: fixed;right: 0rem;bottom: 20rem;width: max-content;    text-align: right;transition: .3s;z-index: 999;}
.ad_link img{max-width: 80%;border-radius: 0.5rem;}
.ad_link:hover{transform:translateX(-1rem);}
.ad_link:hover img{box-shadow: -3px 0px 6px #999;}


@media screen and (min-width: 1536px) {
        /*ask*/
        #formlist .form\:1\/2 input {width: 80%;}
        #formlist .form\:1\/2 input[name='sID'] {width: 65%;}
}

@media screen and (min-width: 1201px) {
    #BodyContent {width:100%;padding:0;margin:0;}
    #BodyContainer_event {width:100%;margin:0;}
    #BodyHeader_event_rwd,#topli {display:none;}
    /*資料集中1200px寬外框*/
    #Master_title {width:1200px;padding: 0%;margin: auto;}    
    #event_master,#event_sec,#event_third,#event_fourth,#event_fifth,#event_sixth {width:1200px;padding: 2%;margin: auto;}    
    /*bodyHeader*/
    #BodyHeader_event,#header-share {width:100%;}
    #BodyHeader_event #header-share {line-height:2;font-size:17px;margin-bottom:0;margin-top:0;background-color:#FFF}
    #BodyHeader_event #header-share img {margin-bottom:5px;max-width: 12%;display: inline-block;}
    #BodyHeader_event a {color:#333;font-size:17px}
    #BodyHeader_event a:hover {text-decoration:none;color:#666;position:relative;top:2px;bottom:2px}
    /*event*/
    .howto {padding-top: 2rem;text-align: center;}
    .dt1::before {width: 10.25rem;height: 2px;background-color: #62dbf9;position: absolute;content: '';bottom: 0;left: -9.25rem;transform: rotate(-25deg);}
    .dt2::after {width: 8rem;height: 2px;background-color: #73f4c5;position: absolute;content: '';bottom: 0;right: -7rem;transform: rotate(25deg);}
    .dt3::before {width: 7rem;height: 2px;background-color: #ffe0c4;position: absolute;content: '';bottom: 50%;left: -6rem;}
    .md\:block {display: block;}
}

@media screen and (max-width: 1535px) {
    #formlist .form\:1\/2 input, #formlist .form\:1\/2 input[name='sID'], .askarea_out label, #formlist select {width: 100%;}
}

@media screen and (max-width: 1200px) {
    .ad_link{bottom: 0rem;text-align: center;width: 100%;}
    .ad_link img{max-width: 50%;margin: 0 auto;animation: borderAnimation 1s infinite alternate;}
    @keyframes borderAnimation {
        0% {
            transform: translateX(-10px);
        }
        100% {
            transform: translateX(10px);
        }
    }
    .ad_link:hover img{transform:none;}
    /*隱藏的區塊*/
    #BodyHeader_event,.hottxt,#noie {display:none;}
    /*會撐開的版面控制*/
    #BodyContent {width: 100%;padding:0;}
    #BodyContainer_event {width: 100%;}
    /*header*/
    #BodyHeader_event_rwd {text-align: center;width:100%;height: auto;margin:0 auto;background-color:#FFF;position:fixed;top:0;z-index:9;}
    #BodyHeader_event_rwd img,#BodyFooter_rwd #footer_inline ul li img {display: inline-block;}
    @media screen and  (orientation:portrait) {#BodyHeader_event_rwd img {max-width: 50%;margin-top:2.5%;}}
    @media screen and  (orientation:landscape) {#BodyHeader_event_rwd img {max-width: 25%;margin-top:2.5%;}}
    /*選單*/
    #mbSearch {margin: 5% 0 0 0;border-bottom: 1px solid #7D7D7D;width: 100%;}
    #mbSearch input {border: none;outline: 0;font-size: 2em;padding-left: 6%;}
    /*滿百100%區域*/
    .row100 {width:100%;}
    /*資料集中寬外框*/
    #event_master,#event_sec,#event_third,#event_fourth,#event_fifth,#event_sixth {width:100%;padding: 2%;}
    #event_sixth nav a { font-size: 1.2em;}
    /*event*/
    section h1 {display: block;}
    .utility li {padding: 0.25rem;}
    .chart {display: flex;align-items: center;flex-direction: column;}
    .chart_box {width: 80%;order: 1;}
    .graduate {order: 2;}
    .howto li {font-size: 2.5rem;}
    .graduate {width: 90%;margin: auto;}
    .chart .graduate dl {margin: auto auto 1rem;}
    .sm\:block {display: block;}
    /*footer*/
    #BodyFooter_rwd {float: left;width:100%;background-color:#FFF;margin-top:5%;}
    #BodyFooter_rwd #footer_line {width: 100%;margin-bottom: 3%;margin-top: 5%;display: block;float: left;height: auto;text-align: center;border-top-width: thin;border-top-style: solid;border-top-color: #999;}
    #BodyFooter_rwd #footer_inline a {color: #000;line-height: 2em;}
    #BodyFooter_rwd #footer_inline ul {float: left;padding:0;width:100%;margin-bottom: 1%;text-align:center;}
    #BodyFooter_rwd #footer_inline ul li img {max-width:40%;height:auto;margin-bottom: 2%;}
    #BodyFooter_rwd #footer_inline ul li {float: left;display: inline-block;	margin-right: auto;	line-height: 2em;font-size: 1em;clear: both;width: 100%;}
    #BodyFooter_rwd #footer_address {margin-top: 0%;	float: left;width: 100%;margin-right: auto;text-align: center;margin-left: auto;}
    #BodyFooter_rwd #footer_address a {color: #000;line-height: 2em;}
    #BodyFooter_rwd #footer_address ul {float: left;padding:0;text-align: center;margin-bottom: 1%;width: 100%;clear: both;}
    #BodyFooter_rwd #footer_address ul li {float: left;display: block;width: 100%;line-height: 2em;text-align: center;font-size: .8em;}
    /*ask*/
    #askarea {width: 100%;padding:4% 1% 2% 1%;}
    #askarea .asktitle,#askarea .asktitle p {text-align: center;}
    #askarea .asktitle {font-size: 1.5rem;color: #FFF;margin-bottom: 2%;line-height: 2rem;}
    #askarea p {margin:0% auto auto 5%;	width: 90%;}
    #formlist {width: 99%;padding: 2% 1% 0;font-size: 0.8em;color: #FFF;}
    input[name="sContent"] {width:50%;}
    input[type="text"] {	width:99%;}
    SELECT,input {border-radius: 7px;font-size: 1.0em;margin:auto 1% 3% auto;background-color: #FFF;height:30px;}
    SELECT {width:100%;border: #FFF;	padding: 0.5%;}
    input {border: #FFF;padding: 1%;color: #C6C6C6;}
    input[type="submit"],input[type="reset"] {color:#FFF;background-color:#eb543f;-webkit-appearance:none;/*ios系統專用，默認的系統樣式*/font-size:1em;margin-top:5%;padding:2%;}
    input[type="radio"] {width:1em;height:1em;margin-left: 3%;}
    /*TOP按鈕*/
    #topli,#topli a {color: #fff;text-decoration: none;}
    #topli {width:50px;height:50px;text-align:center;border-radius: 9999em;background-color:#000;opacity:0.4;position:fixed;line-height:50px;font-size: 15px;}
    @media screen and  (orientation:portrait) {#topli {right:1%;bottom:8%;}}
    @media screen and  (orientation:landscape) {#topli {right:1%;bottom:15.8%;}}
}

@media screen and (min-width: 992px) and (max-width: 1199px) {
	.bgcolor0 {background: url(../../images/) ,linear-gradient(to right,#bfd7eee3 15%,#ffffff 70%,#ffffff 88%,#c9d8e5 98%);}
	#Master_title {}
	.banner {width: 100%;height: auto;}
    .banner_pc{display: none;}
    .banner_mb{display: block;}
	.banner_mb img {width: 100%;}
	.theme {padding: 2% 3%;margin-top: 0%;line-height: initial;}
}

@media screen and (min-width: 768px) and (max-width: 991px) {   
	.bgcolor0 {background: url(../../images/) ,linear-gradient(to right,#bfd7eee3 15%,#ffffff 70%,#ffffff 88%,#c9d8e5 98%);}
	#Master_title {}
	.banner {width: 100%;height: auto;}
    .banner_pc{display: none;}
    .banner_mb{display: block;}
	.banner_mb img {width: 100%;}
	.theme {padding: 2% 3%;margin-top: 0%;line-height: initial;}
	.teacher_pic {width: 100%;margin: 0 auto;}
	.teacher_pic li span {font-size: 1.3rem;}
	.teacher_pic li small {font-size: 1.0rem;display: block;}
	.teacher_intro {width: 100%;}
}

@media screen and (max-width: 767px) {  
	.bgcolor0 {background: url(../../images/) ,linear-gradient(to right,#bfd7eee3 15%,#ffffff 70%,#ffffff 88%,#c9d8e5 98%);}
	#Master_title {}
	.banner {width: 100%;height: auto;}
    .banner_pc{display: none;}
    .banner_mb{display: block;}
	.banner_mb img {width: 100%;}
	.theme {font-size: 1.0rem;padding: 2% 3%;margin-top: 0%;line-height: initial;}
	.howto {font-size: 1.5rem;}
	.how {font-size: 1.3rem;}
	section h1 {font-size: 2.0rem;}
	section h1:before {display: none}
	section h1:after {display: none}		
    .howto li {font-size: 2rem;margin: 0 0.5rem;}
    .howto li:nth-child(1) {font-size: 2.25rem;}
    .howto li:nth-child(3) {font-size: 2.75rem;}    
	.graduate dl dt {font-size: 1.3rem;padding: 0.2rem 0;}
	.extend-btn a {font-size: 1.2rem;}
	.teacher_pic {width: 100%;margin: 0 auto;}
	.teacher_pic li span {font-size: 1.3rem;}
	.teacher_pic li small {font-size: 1.0rem;display: block;}
    .teacher_intro, .utility li, .center-class .utility li, .book-intro figure, .book-detail {width: 100%;}
	.teacher_intro dt {font-size: 1.5rem;margin: auto;width: 9rem;height: 5rem;}
	.teacher_intro dd {font-size: 1.1rem;width: 100%;}
	.add-in {font-size: 1.2rem;}
	.book-intro figure {width: 50%;margin: 0 auto;}
	.book-detail p {padding: 0 1rem 1rem;font-size: 1.2rem;line-height: inherit;}
	.price {font-size: 1.4rem;padding: 1rem;margin: 1rem auto;}
	.price strong {font-size: 1.5rem;}
    .price .opacity {padding-left: 0;}
    .plan_menu a {font-size: 1.35rem;}
    .book-intro figure {order: 1;}
    .book-detail {order: 2;}
    .asktitle strong {display: block;padding-right: 0;}
}

@media screen and (-webkit-min-device-pixel-ratio:0) {/*Webkit*/
}
@-moz-document url-prefix() {/*Firefox*/
}
@media \0screen\,screen\9 {/*IE 6 7 8*/
}
@media screen\0 {/*IE 8 9 10 11*/
}
@media print {
}