@charset "utf-8";
@import url("animate.css");
/****FOR TABLET****/
/***全部的字體設定***/
body { font-size:16px;}
.footer {font-size:15px; line-height:1.4;}
.wrapper .block {font-size: 40px;}
.wrapper .block .content { font-size:23px; line-height:29px;}
.wrapper .content strong { font-size:30px;}

/**內頁共用**/
.wrapper_pg { line-height:1.5;}
.wrapper_pg .wording { font-size:18px;}
h1 { font-size:34px; }
h2 { font-size:29px; font-weight:bold;}
h3 { font-size:21px; font-weight:bold; }
.ampm tr th, .ampm tr td { line-height:1.3;}
.btn a {font-size: 21px;line-height: 1;}
.sponsor_note { font-size:67%; opacity:0.6; margin-right:2px;}

/*COMMON*/
body { background-color:#f9f9f9;}
a, a:link, a:hover, a:visited , a:active, a:hover {color:#0a9c4b;}
.pc {display:none;}
.alink,.gomap { width:100%; height:100%; top:0; left: 0; position:absolute;}
.alink:hover {background-color:rgba(249,249,249,0.3);}
.ieonly {display:none;}
/*HEADER*/
.header {width:100%; position:fixed; top:0; z-index:9999; background-color:rgba(249,249,249,.8); height:48px;}
.logos { width:330px;}
.logos:after { content:""; display:block; float:none; clear:both;}
.CHlogo, .CHFlogo { float:left;}
.CHlogo img, .CHFlogo img { height: 30px; width:auto; padding:10px 0 0 10px;}

/*NAV*/
.nav_icon img {width:30px; height:auto; position:absolute; right:10px; top:10px; cursor:pointer;}
.nav { display:none; z-index:9998; position:fixed; top:48px; width:100%; background-color:rgba(249,249,249,.8);}
.nav li { float:left; width:33.33%; text-align:center;}
.nav li a { width:100%; padding:30px 0; display:block;}


/*INDEX-色塊們設定*/
.wrapper {width:100%; position:relative;}
.wrapper .block,.wrapper .kv { text-align: right; padding:2%; position:relative;}
.wrapper .kv { width: 100%; text-align: left; padding:0;}
.wrapper .block { height: 160px; width: 96%; vertical-align: top; position:relative;}
.wrapper .block.imgonly { height: 180px; width: 100%; padding: 0;}
.wrapper .block.imgonly img {width:100%; height:100%;}
.wrapper .block .content { text-align:left; position: absolute; bottom:5px; }
.hide {display:none;}

.icon_map { width:18px; height:auto; margin:0 2px; vertical-align:text-bottom;}
.yellow { background-color: #fce058; color:#5c5452;}
.red { background-color: #dc311c; color:#FFF;}
.blue { background-color: #00a0d1; color:#FFF;}
.green { background-color: #009944; color:#FFF;}
.purple { background-color: #89548c; color:#FFF;}
.gray { background-color: #cdcdcd; color:#5c5452;}
.orange{ background-color: #ffb54b; color:#5c5452;}
.red a, .blue a, .green a, .purple a {color:#FFF;}
.yellow a, .gray a, .orange a {color:#5c5452;}

/*INDEX-MOBILE的箭頭設定*/
.go_white {background-image:url(../images/block_go_white_mobile.png); background-repeat:no-repeat; background-size:contain; height:38px; width:18px; display:inline-block; margin-left:5px; position:relative; top:4px;}
.go_gray {background-image:url(../images/block_go_gray_mobile.png); background-repeat:no-repeat; background-size:contain; height:38px; width:18px; display:inline-block; margin-left:5px; position:relative; top:4px;}

/*INDEX-MOBILE的主視覺設定*/
.kv_canvas { width:570px; height: 445px; margin:50px auto 20px auto; position:relative; overflow:hidden;}
.kv_canvas div { position:absolute;}
.kv_canvas div img { width:100%; height:auto;}
.kv_canvas .heart_yellow { width:266px; top:80px; left:65px;}/*w×0.9*/
.kv_canvas .heart_blue { width:205px; left:335px;}
.kv_canvas .heart_red { width:206px; top:70px; left:213px;}
.kv_canvas .slogan { width:253px; bottom:122px; left:35px;}
.kv_canvas .subslogan { width:389px; position:relative; margin:auto; top:350px;}

/*FOOTER*/
.footer { background-color:#FFF; color:#656565;  width:100%; padding:10px 0 50px 0; }
.footer .content { width:95%; max-width:1130px; margin:0 auto; text-align:center;}
.sponsor { margin-bottom:10px;}
.sponsor img { display:inline-block; height:50px; width:auto; vertical-align:middle; margin:5px; position:relative; top:-3px;}
.sponsor .ch  { margin-right:10px;}
.sponsor .ch img { height:30px; width:auto; }
.copyright span { display:block;}

/*GOTOP設定*/
#gotop {display:none;}
#gotop img { cursor:pointer; width:45px; height:auto; position:fixed; right:3%; bottom:50px; z-index:10000;}

/*頁尾分享設定*/
.shares { width:100%; position:fixed; z-index:9997; bottom:0; left:0; background-color:rgba(0,153,68,.9); line-height:1;}
.shares:after {content:""; display:block; float:none; clear:both;}
.shares a { display:block; float:left; width:25%; text-align:center; padding:12px 0; color:#FFF;}

/***內頁ONLY設定***/
/**內頁共用**/
.header.page .content {width:100%; position:relative;}
.kv_page .content {width:560px; margin:auto;}
.wrapper_pg {width:96%; margin:48px auto 0 auto;}
.btn a {display: block;text-align:center;width:50%;padding:15px;margin:20px auto;color:#FFF;background:#009944;}
.btn a:hover, .btn a:focus {text-decoration: none;background:#dc311c;}
.block_left {width:96%; margin:auto; }
.block_right {width:96%; margin:auto;  padding:5px 2%; background-color:#FFF;margin-bottom:20px;}
.fb-comments { width:100% !important; data-width:100% !important;}
.block_right .banner img {width:100%; height:auto; margin-bottom:10px;}

/*HEADER*/
.header.page { background-color:rgba(255,255,255,0.8);}
.header.page .CHlogo {position:absolute; left:0; top:0;}
.header.page .kv_mobile { margin:auto; width:79px; padding:5px;}
.header.page .kv_mobile img {width:100%; height:auto;}


/*內頁主內容區*/
.wrapper_pg { padding-top:30px; color:#3d3837;}
.wrapper_pg .wording, .wrapper_bg .content { margin:0 20px; padding-bottom:10px;}
.wrapper_pg .wording strong { color:#e84125;}
h1 { padding:0 0 10px 0;position:relative; color:#231815;}
h1:before {content:""; background-image:url(../images/grayheart.png); background-size:contain;background-repeat:no-repeat; width:16px; height:19px; display:inline-block; margin-bottom:3px; margin-right:2px;}
h2 { padding:20px 0; position:relative; color:#231815;}
h2:before { content:""; width:20px; display:inline-block;}
h2:after { content:""; background:url(../images/h2_after.gif); height:5px; width:100%; display:block; }
h3 { color:#139a54; position:relative; padding-left:20px;}
h3:before { content:""; background-image:url(../images/h3_before.png); background-size:contain; width:17px; height: 17px; display:inline-block; position:absolute; top:7px; left:0; }
.wrapper_pg .content:after { content:""; display:block; float:none; clear:both;}

/**內頁不共用**/
/*論壇資訊頁*/
.table_schedule { margin:0 20px 20px 20px;}

.ampm {	width: 100%; margin-top: 10px; border:1px solid #E3E3E3;}
.ampm tr td { padding: 8px; background-color: #F0F0F0; border-top:1px solid #E3E3E3; border-right:1px solid #E3E3E3;}
.ampm tr td:first-child {border-left:1px solid #E3E3E3;}
.ampm tr th { background-color: #fde15b; font-weight: normal; border-left-style: none; text-align:center; color: #009944; padding: 10px;}
.ampm tr td.secondbg2 { background-color: #FBECD2; }
.ampm tr td.secondword { background-color: #F9F9F9; }

.onlineform { border:1px solid #E3E3E3; margin:0 20px 40px 20px;}
.onlineform iframe { width:100%;}

/*TKS*/
.notice {margin-top:20px; border-top:1px dotted #bbb; border-bottom:1px dotted #bbb; padding:10px; font-size:90%;}
.notice ul, .notice ol { padding:10px 20px;}
.notice ol li {list-style-type: decimal;list-style-position: inside;}

/*QA*/
.turns { width:100%;}
.turnbox { margin:10px; height:320px;}

.box_q { background-image:url(../images/box_q_bg.png); background-position:center center; background-repeat:no-repeat; background-size:auto;text-align:center; color:#FFF; cursor:pointer; font-size:19px;}
.box_q p { padding:18% 30% 0 30%;}

.box_a, .turnbox .box_normal { position:relative; font-size:16px; line-height:1.5;}
.box_a p { padding:10px;}
.box_a .q { display:block; margin-bottom:10px; font-size:18px; line-height:1.3;}
.box_a .yn { display:block; color:#dc311c; font-weight:bold;}
.box_a strong { font-weight:bold;}
.box_a .check { cursor:pointer; color:#FFF; text-align:center; width:90%; padding:8px 0; letter-spacing:0.5em; position:absolute; bottom:5%; left:5%; display:block; font-size:23px;}
.box_a .check:hover { opacity:0.5;}
.box_a .checkbtn { color:#FFF; text-align:center; width:94%; padding:12px 0; position:relative; top:0; left:3%; display:block; letter-spacing:0.1em;}
.box_a .checkbtn:hover { opacity:0.8; text-decoration:none;}

.red_light { background-color:#ffe5e2;}
.red_light .check {background-color:#dc311c;}
.blue_light { background-color:#ddf7ff;}
.blue_light .check {background-color:#00a0d1;}
.dorange { background-color:#f4781d;}
.dorange_light { background-color:#ffe4d1;}
.dorange_light .check {background-color:#f4781d;}
.bpurple { background-color:#644a9f;}
.bpurple_light { background-color:#e0d6f7;}
.bpurple_light .check {background-color:#644a9f;}
.ygreen { background-color:#84bb1b;}
.ygreen_light { background-color:#f4ffde;}
.ygreen_light .check {background-color:#84bb1b;}
.rpuple { background-color:#864d9b;}
.rpuple_light { background-color:#f5e3fc;}
.rpuple_light .check {background-color:#864d9b;}
.pink { background-color:#d34a6b;}
.pink_light { background-color:#f9e8ec;}
.pink_light .check {background-color:#d34a6b;}
.sblue { background-color:#4553a8;}
.sblue_light { background-color:#dce1ff;}
.sblue_light .check,.sblue_light .checkbtn {background-color:#4553a8;}

/*prevention+celebrity*/
.mutibox:after { content:""; float:none; clear:both; display:block; position:relative; background-image:url(../images/h2_after.gif); height:2px; width:100%; top:25px; left:0;}
.mutibox:last-child:after {height:0px;}
.mutibox .img_box img {width:100%; height:auto;}
.mutibox .article_box .article_title { margin-bottom:10px; color:#139a54; font-size:19px;}
.mutibox .article_box .article:after { content:"...more"; font-size:85%; color:#999;}

/*prevention*/
.pbox { cursor:pointer; text-align:center; position:relative; padding:20px 0 0 0; float:left; width:19%; height:70px; margin:0 5px 5px 0; font-size:21px; line-height:1.2;}
.pbox:hover, .pbox:focus { opacity:0.7;}
.prevention_boxes { margin-bottom:20px;}

.prevention_wording { position:relative;}
.prevention_wording .mutibox { position:relative; margin:50px 0;}
.prevention_wording .mutibox .img_box { float:left; width:33.5%; margin-right:1.5%;}
.prevention_wording .mutibox .article_box { float:left; position:relative; width:65%;}

/*celebrity*/
.celebrity { position:relative;}
.celebrity .mutibox { position:relative; display:inline-block; vertical-align:top; width:31%; margin:1% auto; text-align:center;}
.celebrity .mutibox:after {height:0px;}
.celebrity .mutibox .img_box img {width:90%; margin:auto;-webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%;}
.celebrity .mutibox .article_box {position:relative; margin:10px auto 20px auto;}
.celebrity .mutibox .article_box .article_title { margin-bottom:0px;}

/*speaker*/
h1 .checkbtn, h2 .checkbtn { position:relative; left:10px; top:-6px; background:#0a9c4b; color:#FFF; padding:5px 10px; font-size:19px; font-weight:normal; }
h1 .checkbtn:hover, h2 .checkbtn:hover { opacity:0.7; text-decoration:none;}

.turnbox_speaker { margin:0 auto 10px auto; width:500px; height:260px;}
.box_speaker { text-align:center; color:#FFF; cursor:pointer; height:260px; position:relative;font-size:17px;}
.box_normal .box_speaker { cursor:default;}
.box_speaker p { position:absolute; width:100%; left:0; bottom:0; padding:5px 0; background-color:rgba(0,0,0,0.7);}
.box_speaker p .sname,.box_speaker p .stitle { display:block; width:100%;}
.box_speaker p .stitle:after { content:""; display:block; background:url(../images/speaker_go.png) no-repeat center center; background-size:15px; height:15px; width:100%;}

.box_speaker_info { position:relative; height:260px; background:#f0f0f0; cursor:pointer;}
.box_speaker_info p { margin:10px;}
.box_speaker_info span { display:block; margin-bottom:5px;}
.box_speaker_info .sname { color:#000; font-weight:bold; margin-bottom:0px;}
.box_speaker_info img { width:130px; height:auto; position:relative; float:right; vertical-align:text-top; padding:0 0 5px 5px;}

.s01 { background:url(../images/speaker01bg_pad.jpg) no-repeat center top; background-size:contain;}
.s02 { background:url(../images/speaker02bg_pad.jpg) no-repeat center top; background-size:contain;}
.s03 { background:url(../images/speaker03bg_pad.jpg) no-repeat center top; background-size:contain;}
.s04 { background:url(../images/speaker04bg_pad.jpg) no-repeat center top; background-size:contain;}
.s05 { background:url(../images/speaker05bg_pad.jpg) no-repeat center top; background-size:contain;}
.s06 { background:url(../images/speaker06bg_pad.jpg) no-repeat center top; background-size:contain;}
.s07 { background:url(../images/speaker07bg_pad.jpg) no-repeat center top; background-size:contain;}
.s08 { background:url(../images/speaker08bg_pad.jpg) no-repeat center top; background-size:contain;}
.s09 { background:url(../images/speaker09bg_pad.jpg) no-repeat center top; background-size:contain;}
.s10 { background:url(../images/speaker10bg_pad.jpg) no-repeat center top; background-size:contain;}
.s11 { background:url(../images/speaker11bg_pad.jpg) no-repeat center top; background-size:contain;}
.s12 { background:url(../images/speaker12bg_pad.jpg) no-repeat center top; background-size:contain;}
.s13 { background:url(../images/speaker13bg_pad.jpg) no-repeat center top; background-size:contain;}
.s14 { background:url(../images/speaker14bg_pad.jpg) no-repeat center top; background-size:contain;}

.nodata { display:none;}
.content .clear {  padding:10px 0px; text-align:center;}