
.submenu-sd { background-color:#16afe5; border-top-left-radius: 12px; border-top-right-radius: 12px; padding:5px 8px 10px; margin:0; text-align:right; font-size:14px; width:100% }
.submenu-sd a { color:#fff; padding:0 8px; border-left:1px solid #fff }
.submenu-sd a:hover { color:#ffcc00 }
.title-sd:before, .title-sd:after {	content: " "; 	display: table }
.title-sd:after { clear:both }
.title-sd { width:100%;
	background-color: #149bd7;
	background-image: -ms-linear-gradient(top, #16AFE5 0%, #1481C3 70%);/* IE10 Consumer Preview */ 
	background-image: -moz-linear-gradient(top, #16AFE5 0%, #1481C3 70%);/* Mozilla Firefox */ 
	background-image: -o-linear-gradient(top, #16AFE5 0%, #1481C3 70%);/* Opera */
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #16AFE5), color-stop(0.7, #1481C3));/* Webkit (Safari/Chrome 10) */ 
	background-image: -webkit-linear-gradient(top, #16AFE5 0%, #1481C3 70%);/* Webkit (Chrome 11+) */ 
	background-image: linear-gradient(to bottom, #16AFE5 0%, #1481C3 70%);/* W3C Markup, IE10 Release Preview */ 
	border-bottom-left-radius: 12px;
 }
 .title-sd img { max-width: 100%; height: auto; position:relative }
 .title-sd-corner { 
    border-color: transparent transparent #FFFFFF transparent;
    border-style: solid solid solid solid;
	float:right;
    height: 0;
    width: 0;
 }
 .bubble { color:#FFF; font-weight:bold; float:left;  position: relative;  min-height: 1px; }

.btn_download {
	background: url(./image/bg_download.gif) no-repeat left;
	font-size: 13px;
	color: #838383;
    display:table;
	padding-bottom:15px;
}

.btn_download .pull-left span { display:inline-block; text-align:left;}
.SDUpdate {
	line-height:150%;
	font-size:13px;
}
h1 { background:url(./image/ico_h1.png) left top no-repeat; padding-left:25px }
h2 { text-align:left; padding-left:15px; margin-top:5px; color:#f39800 }
h3 { margin:5px 0 10px; text-align:left}
.tabbable-line { border-top:1px dashed #e5e5e5;margin-top:0; }
.tabbable-line:before, .tabbable-line:after { display:table; content:" ";}
.tabbable-line:after {clear:both;}
.tabbable-line > .tab-content {
	padding: 0 15px 15px;
	border:1px solid #ddd!important;
	border-top-right-radius:0;
	border-top-left-radius:0;
	border-top: 2px solid #f39800!important;
}


/*
.tabbable-line .nav-tabs > li {
  margin-right: 3px;
  width:32.5%;
  text-align:center;
  background-color: #ebe8e4;
}

.tabbable-line > .nav-tabs > li a:before {
    content: " ";
    display: block;
    width: 0;
    height: 0;
    border-top: 24px solid transparent;
    border-bottom: 24px solid transparent;
    border-left: 12px solid white;
    position: absolute;
    top: 50%;
    margin-top: -24px;
    margin-left:3px;
    left: 100%;
    z-index: 2;
}

.tabbable-line > .nav-tabs > li a:after {
    content: " ";
    display: block;
    width: 0;
    height: 0;
    border-top: 24px solid transparent;
    border-bottom: 24px solid transparent;
    border-left: 12px solid #ebe8e4;
    position: absolute;
    top: 50%;
    margin-top: -24px;
    left: 100%;
    z-index: 3;
}*/
.tabbable-line .nav-tabs li.active a,
.tabbable-line .nav-tabs a:hover,
.tabbable-line .nav-tabs li.active,
.tabbable-line .nav-tabs li:hover,
.tabbable-line .nav-tabs li.active:hover {
	border-radius:0!important;
	border:none;
}
.tabbable-line .nav-tabs li.active > a {
  margin-right:0;
  color:#2b7daf!important;
}
.tabbable-line .nav-tabs a:hover,
.tabbable-line .nav-tabs li:hover {
	color:#ff7f00!important;
}
.tabbable-line > .nav-tabs > li:hover > a {
  background: none !important;
}
.tabbable-line > .nav-tabs > li.active > a {
  background-color:transparent;
}
.tabbable-line .nav-tabs li a:after { content:" "; position:absolute; color:#ccc; font-size:10px; top:12px; left:3px;}
	.tabbable-line .nav-tabs li:first-of-type a:after, #flow1:before { content:"1"; }
	.tabbable-line .nav-tabs li:nth-of-type(2) a:after, #flow2:before { content:"2"; }
	.tabbable-line .nav-tabs li:nth-of-type(3) a:after, #flow2s1:before { content:"2-1"; padding-left:8px;}
	.tabbable-line .nav-tabs li:nth-of-type(4) a:after, #flow2s2:before { content:"2-2"; padding-left:8px;}
	.tabbable-line .nav-tabs li:nth-of-type(5) a:after, #flow2s3:before { content:"2-3"; padding-left:8px;}
	.tabbable-line .nav-tabs li:nth-of-type(6) a:after, #flow2s4:before { content:"2-4"; padding-left:8px;}
	.tabbable-line .nav-tabs li:nth-of-type(7) a:after, #flow3:before { content:"3"; }
	.tabbable-line .nav-tabs li:nth-of-type(8) a:after, #flow4:before { content:"4"; }
	.tabbable-line .nav-tabs li:nth-of-type(9) a:after, #flow5:before { content:"5"; }
	.tabbable-line .nav-tabs li:nth-of-type(10) a:after, #flow6:before { content:"6"; }

	#flow1:before, #flow2:before, #flow2s1:before, #flow2s2:before, #flow2s3:before, #flow2s4:before, #flow3:before, #flow4:before, #flow5:before, #flow6:before { float:left; padding:0 5px 0 0; color:#5d98bf; font-weight:bold; font-size:18px; margin-top:-5px;}
/*.tabbable-line .nav-tabs > li.active a:before {
    border-left: 12px solid #fff;
}
.tabbable-line > .nav-tabs > li.active a:after {
    border-left: 12px solid #f39800;
}

.tabbable-line > .nav-tabs >li:first-child a {
    padding-left: 12px;
}
.tabbable-line > ul > li > a { color:#666666!important }*/
.tabbable-line .btn-circle {  background-color:#734900; color:#fff;	width: 19px;
	border-radius:50%;
	height: 19px;
	font-size:10px!important;
	padding:0; margin:0 2px 4px 0;
	line-height:19px }
.tab-content h4 { text-align:center; color:#fe8929; font-weight:bold; padding:7px 12px; margin:8px auto;
}
.tab-content h5 { color:#fe8929; font-size:18px; font-weight:bold; padding:3px 8px }
.small .btn-circle { 
	width: 16px;
	height: 16px;
	font-size:9px!important;
	padding:0;
	line-height:16px;
	margin-right:2px
}

.table th, .table td { 
	border-left:1px solid #d8dde6;
	margin-left:-1px;
	text-align:center
}
.Flow_Bar { margin-top:35px }
.Flow_Bar:beofre, .Flow_Bar:after { display:table; content:" "}
.Flow_Bar:after { clear: both}
.SD-flow, .SD-step { display:block; float:left }
.text-persimmon { border-bottom:1px dotted #FC8000 }
.label { font-size:14px}

.alert ul { padding-left:18px; margin-top:-12px}

ul.pager { padding-right:15px}
ul.pager li > a { border-width:0; padding-left:0!important;padding-right:0!important; margin:0!important;  background-color:transparent;   border-radius: 0!important }
ul.pager li > a:hover { text-decoration:underline }
.well { margin:0 10px }

.list-note-group {
  margin-bottom: 20px;
  padding-left: 0;
}
.list-note {
  position: relative;
  display: block;
  padding: 8px 0;
  margin-bottom: -1px;
  background-color: #ffffff;
  border-top: 1px solid #d8dde6;
  border-bottom: 1px solid #d8dde6;

}
@media (max-width:767px) {
/*#BodyContentMain { margin:0 10px;}*/
.submenu-sd a { display:none }
.title-ibrain { width:58%; max-width:100%; height:auto; display:block; margin:0 auto }
.title-sd { text-align:center; padding-bottom:15px }
.title-sd-corner { 
    border-width: 0 0 25px 25px;
	margin-top:-25px
 }
.bubble { text-align:center; background-color:#8dc21f;margin:10px 10px 10px 0!important; padding:5px 7px!important; width:100% }
.bubble p { display:inline; padding:0 6px; font-size:18px }
.legoman { display:none }
.showcase { font-size:14px; text-align:center }
.showcase img { width: 300px; margin:0 auto }
.btn_download {	width: 100%!important; margin:0 auto; background:none; }
.btn_download > .col-xs-16 { padding:5px 10px 0}
.SDUpdate:before { clear:both }
.SDUpdate { padding:0 25px!important; }
.SDUpdate span {display:block }
#New-Feature span > span { display:block; padding:3px 5px}
.btn_download, .SDUpdate { clear:both }
.btn_download .pull-left span { padding-right:20px;}
.btn_download .pull-left span:last-of-type { padding-right:0;}
h1 { margin:30px 0 10px 10px }

/*手機版取消縮合*/
	.tab-content>.tab-pane { display:block!important; margin-bottom:45px; border-bottom:1px solid #D9D9D9; }
	.fade {opacity: 1;}
    h3 { font-size:22px; }
	ul.pager { display:none; }
/*手機版取消縮合-End*/
.tabbable-line > .nav-tabs > li {
   width:32%;
 }
.tabbable-line > .nav-tabs > li a:before {
    border-top: 24px solid transparent;
    border-bottom: 24px solid transparent;
    border-left: 12px solid white;
    margin-top: -24px;
    margin-left:3px;
}

.tabbable-line > .nav-tabs > li a:after {
    border-top: 24px solid transparent;
    border-bottom: 24px solid transparent;
    border-left: 12px solid #ebe8e4;
    margin-top: -24px;
}
.tabbable-line > .nav-tabs > li > a { padding:3px 0; font-size:14px; height:48px; vertical-align:middle }
.SD-flow, .SD-step { width:100%; padding:0 13px}

.tab-pane > p > span { display:block }
.col-sm-8 { padding:25px 20px 15px }
.tab-content ol, .tab-content ul { padding-left:20px }
.block { display:block; clear:both }
}
@media (min-width:768px) {
.col-sm-8 { padding:25px 28px 15px 0}
.col-sm-8 .img-responsive { padding-left:30px; padding-left:15px\9; }
.tab-content ol, .tab-content ul { padding-left:20px }
.tab-content li { padding:5px }
h1 { margin:30px 0 10px 30px }

}
@media (min-width:768px) and (max-width:991px) {
.title-sd  { height:195px}
.title-sd > img { display: inline; vertical-align:bottom}
.title-sd > .title-sd-corner { vertical-align:bottom; position:absolute; bottom:0}
.title-ibrain { padding-left:12px }
.title-sd-corner { 
    /* 設定邊框大小可拼湊出任意形狀的三角形 */
    border-width: 0 0 45px 45px;
	margin-top:-45px;
 }
.bubble { margin:-55px 0 10px; padding:25px 31px; color:#FFF; font-size:21px;font-size:20px\9; font-weight:bold; background: url(./image/bg-bubble.png) left top no-repeat; width:167px; height:167px; float:left;  position: relative;  min-height: 1px; }
.bubble p { margin-bottom:5px }
.legoman { width:55px; margin-top:15px; float:left; position: relative;  min-height: 1px; padding-left:10px }
.showcase { font-size:14px; text-align:right }
.showcase img { width: 288px }
.legoman > img { width:55px }
.btn_download {padding-top:5px; }
.btn_download > .col-xs-16 { padding:0 0 0 5px; margin:0 -5px }
/*.btn_download .pull-left, .btn_download .pull-right { display:block; width:50% }*/
.btn_download .pull-left { text-align:left;}
.btn_download .pull-left span { width:49%;}
.SDUpdate.col-33 { padding:10px 6px 10px; margin-left:-15px; width:calc(33.333% + 15px); }
.col-33.padL30 {padding-left:10px; padding-right:0;  width:calc(33.333% - 15px);}
.SD-flow { width:360px; padding-left:10px }
.SD-step { width:calc(100% - 360px); padding-right:10px }
}
@media (min-width:992px) {
#BodyContentMainDetail { width:992px; margin:0; padding:0; padding:0 15px 0 0\9; }
.banner { background:url(./image/IE_Guide_SD_title.png) center top no-repeat; width:962px; height:243px; padding:0; margin:0 auto }
.submenu-sd { background-color:transparent }
.title-sd, .title-sd-corner { display:none }

/*.title-sd  { height:205px}
.title-sd > img { display: inline; vertical-align:bottom}
.title-sd > .title-sd-corner { vertical-align:bottom; position:absolute; bottom:0}
.title-ibrain { padding-left:105px }
.title-sd-corner { 
    border-width: 0 0 75px 75px;
	margin-top:-75px
 }*/
.padL30 { padding-left:45px }
.bubble { margin:-55px 0 10px 45px; padding:25px 31px; color:#FFF; font-size:21px;font-size:20px\9; font-weight:bold; background: url(./image/bg-bubble.png) left top no-repeat; width:167px; height:167px; float:left;  position: relative;  min-height: 1px; }
.bubble p { margin-bottom:5px }
.legoman { width:55px; margin-top:15px; float:left; position: relative;  min-height: 1px; padding-left:10px }
.showcase { font-size:14px; text-align:center }
.showcase img { width: 268px }
.btn_download {
	margin:10px 10px 10px -25px; 
	display:table;
}

.btn_download .col-xs-16 { padding: 0 20px 0 15px }
.btn_download .pull-left span {padding-right:17px;}
.btn_download .pull-left span:last-of-type {padding-right:0;}
.SDUpdate { padding-top:20px }
/*.SDUpdate span {display:block }*/
.SD-flow { width:445px; padding-left:30px }
.SD-step { width:calc(100% - 445px); padding-right:30px }
/*.tabbable-line > ul {  margin: auto 25px!important }
.tabbable-line > .nav-tabs > li a:before, .tabbable-line > .nav-tabs > li a:after {
    border:none!important;
    position:relative;
    margin:auto;
}
.tabbable-line > .nav-tabs > li.active a:before, .tabbable-line > .nav-tabs > li.active a:after  {
    border:none!important;
}

.tabbable-line > .nav-tabs > li {
  width:316px;
  background:url(./image/IE_SD_step.png) right top no-repeat transparent!important;
  margin-right:-15px;
}
.tabbable-line > .nav-tabs > li:hover {  background:transparent!important;}
.tabbable-line > .nav-tabs > li.active {
	width:316px;
	background:url(./image/IE_SD_step_o.png) right top no-repeat transparent!important;
	margin-right:-15px
}
.tabbable-line > .nav-tabs > li > a, .tabbable-line > .nav-tabs > li.active > a { background-color:transparent!important }
*/
.tabbable-line > .tab-content { margin: auto 0!important }
}




/*使用說明選單*/
#navbar-main.navbar.navbar-default.sidebar { padding:0; min-height:50px;}
    #navbar-main.sidebar .icon-bar { background-color:#ffffff;}
    #navbar-main.sidebar .navbar-toggle {width:100%; margin:5px auto; padding:5px 10px }
    #navbar-main.sidebar .navbar-toggle:focus, #navbar-main.sidebar .navbar-toggle:hover { background-color:#ff8900; color:#fff }
    #navbar-main.sidebar .navbar-toggle:focus .icon-bar, #navbar-main.sidebar .navbar-toggle:hover .icon-bar { background-color:#fff;}
    #navbar-main.sidebar .navbar-toggle div:first-of-type { width:60%; float:left; text-align:right; padding-right:10px;}
    #navbar-main.sidebar .navbar-toggle div:last-of-type { width:40%; float:left; padding-top:6px}

	#navbar-main ul.nav.navbar-nav li { display:block!important; list-style:none; width:100% }
        #navbar-main .nav.navbar-nav a { line-height: 22px; }
        #navbar-main .nav.navbar-nav a small { display:block; color:#707070; margin-top:-5px}
	/*Animated 'X' icon for bootstrap toggle*/
	/*.navbar-toggle {
      border: none;
      background: transparent !important;
    }
    .navbar-toggle:hover {
      background: transparent !important;
    }*/
    .navbar-toggle .icon-bar {
      transition: all 0.2s;     
    }
    .navbar-toggle:focus .top-bar {
      transform: rotate(45deg);
      transform-origin: 10% 10%;
    }
    .navbar-toggle:focus .middle-bar {
      opacity: 0;
    }
    .navbar-toggle:focus .bottom-bar {
      transform: rotate(-45deg);
      transform-origin: 10% 90%;
    }
    .navbar-toggle.collapsed .top-bar {
      transform: rotate(0);
    }
    .navbar-toggle.collapsed .middle-bar {
      opacity: 1;
    }
    .navbar-toggle.collapsed .bottom-bar {
      transform: rotate(0);
    }
    @media (max-width:767px) {
        #guide-sidebar .nav-tabs { border-width:0; }
        #navbar-main.navbar.navbar-default.sidebar { background-color:#ff7f00; color:#ffffff; margin:0;
            -webkit-box-shadow: 0px 10px 10px 0px rgba(0,0,0,0.35);
            -moz-box-shadow: 0px 10px 10px 0px rgba(0,0,0,0.35);
            box-shadow:  0px 10px 10px 0px rgba(0,0,0,0.35);}
        #navbar-main .nav.navbar-nav li a { color:#ffffff; padding:10px 30px 10px; border-bottom:1px solid rgba(255,255,255,0.2) }
        #navbar-main .nav.navbar-nav li a.submenu { padding-left:45px; text-align:left; background-color:#ff7f00}
	        #navbar-main .nav.navbar-nav a small { display:inline-block; color:rgba(251,243,220,1.00); margin-top:0; padding-left:10px;}
        #navbar-main .nav.navbar-nav li.active a { background-color:#f57500; color:#fff0e1!important; }
		#guide-sidebar div { color:#e5d8ca; text-align:center; margin-left:-10px; margin-right:-10px;} 
        #guide-sidebar div a { color:#FFF; padding-right:5px; padding-left:5px; display:inline!important;}
    }
    /*手機版選單靠上*/
      .affix {
          top: 0;
          width: 100%;
          z-index: 999 !important;
      }
    
      .affix + .container-fluid {
          padding-top: 60px;
    
      }
      
    @media (min-width:768px) {      
      #navbar-main, #main { display:block; float:left; position: relative; min-height: 1px; }
      #navbar-main { width:22%; padding:0;}
      #main {width:78%; padding:0 15px; border-left:1px solid #f1f1f1; margin-left:-2px!important; margin-top:10px; }

      #navbar-main .container-fluid { padding:0; border-right:1px solid #f1f1f1;}
	  #guide-sidebar div { display:none; }
      #guide-sidebar { padding:0; margin:0}
      #guide-sidebar .nav.navbar-nav {padding:0;}
      #guide-sidebar .nav.navbar-nav li a:hover, #guide-sidebar .nav.navbar-nav li:hover { background-color:#f2f2f2;}
      #guide-sidebar .nav.navbar-nav li a { color:#ff7f00; border-bottom:1px solid #e5e5e5; padding:15px 0 15px 15px; }
      #guide-sidebar .nav.navbar-nav li a.submenu { padding-left:35px;background-color:#fff;}
	  #guide-sidebar .nav.navbar-nav li.active a { background-color:#f5f5f5; }
    }
    @media (min-width:992px) {
      #main section { padding:0 30px}
      
    }

    #history{ position:absolute;width:300px; padding:10px 10px 0; background-color:#ffffde; border:1px solid #f2f0cb;top:25px;left:0;}
    #history ul {padding-left:15px;}

#imgTag { background-color:rgba(0,0,0,0.35); position:fixed; top:0; left:0; width:100%; height:100%;display:flex; justify-content:center;align-items: center; z-index:999;text-align:center; flex-wrap: wrap;flex-direction: column;}
#imgTag img { max-width:100%; height:auto; border-radius:12px; position:relative;}
#imgTag:after{content:"╳"; margin-top:10px;width:48px;height:48px;line-height:48px;display:block;color:#ffffff;font-size:36px;border-radius:50%; border:2px solid #ffffff; cursor:pointer;}

/*zoomify 圖片放大縮小*/
.zoomify{cursor:pointer;cursor:-webkit-zoom-in;cursor:zoom-in}.zoomify.zoomed{cursor:-webkit-zoom-out;cursor:zoom-out;padding:0;margin:0;border:none;border-radius:0;box-shadow:none;position:relative;z-index:1501}.zoomify-shadow{position:fixed;top:0;left:0;right:0;bottom:0;width:100%;height:100%;display:block;z-index:1500;background:rgba(0,0,0 ,.3);opacity:0}.zoomify-shadow.zoomed{opacity:1;cursor:pointer;cursor:-webkit-zoom-out;cursor:zoom-out}