@charset "utf-8";

*
{ font-family:'Noto Sans TC', 'PingFangHK-Regular', '微軟正黑體', Arial, Verdana, Geneva, sans-serif; -webkit-font-smoothing:antialiased; font-smoothing:antialiased; -moz-osx-font-smoothing: grayscale; font-weight: 400;}

/* Main Setting
***********************/
html, body
{ background:#ffffff; font-size:12px; }
.desbreak
{ display:block; }
.mobbreak
{ display:none; }

strong
{font-weight:700;}
mark
{background-color: #000000; color:#ff0000;}


#wrapper
{ position:relative; width:100%;}
.mainContent
{ width:100%; max-width: 1000px; margin:0px auto;}


/* Banner Setting Start
**********************/
.bannerRow
{ position:relative; width:100%; max-width: 1000px;}
.bannerRow img.bg
{ width:100%; height: auto;}


/* introRow Setting Start
**********************/
.introRow
{ padding:80px 0px; background:#ff0000;}
.introRow .introInner
{ width:90%; margin:0px auto;}
.introRow .introInner .logoCol
{ width:30%; max-width: 260px;}
.introRow .introInner .logoCol img
{ width:100%; max-width: 160px; height: auto;}
.introRow .introInner .sepCol
{ width:5%;}
.introRow .introInner .descCol img
{ width:100%; max-width:660px; height: auto;}

/* eventDetailsRow Setting Start
**********************/
.eventDetailsRow
{ padding:8vw 8vw; background:#000000; background:url(../images/img_session2-bg.jpg) no-repeat center; background-size:cover;}
.eventDetailsRow .txtCol p
{ font-size: 17px; line-height: 1.5; color:#ff0000; text-align: center; margin-bottom:50px;}

.eventDetailsRow .eventInner
{ margin:0px auto; background-color:#ff0000; margin-bottom: 50px; padding:40px;}
.eventDetailsRow .eventInner .sepCol
{ width:5%;}
.eventDetailsRow .eventInner .eventCol_left
{ width:55%; vertical-align: top;}
.eventDetailsRow .eventInner .eventCol_left .paraRow p
{ color:#ffffff; font-size:17px; line-height: 1.5; text-align: left; letter-spacing:0.3px; }

.eventDetailsRow .eventInner .eventCol_right
{ width:50%; vertical-align: top;}
.eventDetailsRow .eventInner .eventCol_right img
 {width:100%; max-width:100%;} 


.eventDetailsRow .remarksRow
{ width:100%; margin:0px auto;}
.eventDetailsRow .remarksRow p
{ color:#ff0000; font-size:17px; line-height: 1.5; text-align: center; letter-spacing:0.3px; font-weight:700;}

/* venueDetail Setting Start
**********************/
.venueDetailsRow
{padding:8vw 8vw; background:#183641; background:url(../images/img_session3-bg.gif) no-repeat center; background-size:cover;}
.venueDetailsRow .map
{width:100%; height:340px;}






@media only screen and (max-width: 1000px)
{

}

@media only screen and (max-width: 768px)
{
/* introRow Setting Start
**********************/
.introRow
{ padding:10vw 0px;}
.introRow .introInner .descCol
{ display:block; width:100%; max-width: 100%; text-align: center;}
.introRow .introInner .descCol img
{ width:90%; }


/* eventDetailsRow Setting Start
**********************/
.eventDetailsRow
{padding:10vw 4vw;}

.eventDetailsRow .eventInner
{margin-bottom:6vw;}

.eventDetailsRow .eventInner .sepCol
{display:none; width:100%;}
.eventDetailsRow .eventInner .eventCol_left,
.eventDetailsRow .eventInner .eventCol_right
{ display:block; width:100%; text-align:left;}


.eventDetailsRow .eventInner .eventCol_left .paraRow p 
{text-align:left; margin-bottom:2vw;}
.eventDetailsRow .eventInner .eventCol_right img
{width:80%;}


.eventDetailsRow .txtCol
{ display:block; width:100%; margin:0px auto; text-align: center; }
.eventDetailsRow .txtCol p
{ display:block; width:100%; text-align: center; font-size: 17px; margin-bottom: 5vw;}

/* venueDetail Setting Start
**********************/
.venueDetailsRow
{padding:10vw 4vw;}
.venueDetailsRow .map
{width:100%; height:850px;}

}

@media only screen and (max-width: 450px)
{
.desbreak
{ display:none; }
.mobbreak
{ display:block; }

.introRow
{ padding:12.5vw 0px;}
.introRow .introInner .logoCol img
{width:140px;}

/* eventDetailsRow Setting Start
**********************/


.eventDetailsRow
{ padding:15vw 4.5vw; background: url(../images/img_session2-bg_mobile.jpg) no-repeat center; background-size: cover;}

.eventDetailsRow .txtCol
{ margin-bottom: 8vw; }
.eventDetailsRow .txtCol p
{ font-size: 4vw;}

.eventDetailsRow .eventInner
{padding:4vw; margin-bottom:8vw;}

.eventDetailsRow .eventInner .eventCol_left .paraRow p
{font-size: 4.2vw;}
.eventDetailsRow .eventInner .eventCol_right img
{width:90%;}


.eventDetailsRow .remarksRow p
{ font-size:4vw;}

/* venueDetail Setting Start
**********************/
.venueDetailsRow
{padding:15vw 4.5vw;}

.venueDetailsRow .map
{width:100%; height:560px;}

}