@import url('mainbanner-flexslider.css');
@charset 'utf-8';

/*STYLE CLEAR*/
h4#btn_menu {display: none; } #rwd_nav {display: none; } #normal_nav {/*pc*/ display: block; } #off {display: none; } /*共用*/ .MarginAuto {margin: 0 auto; } .ClearBoth {clear: both; } .floatLeft {float: left; } .floatRight {float: right; } .DisplayInBlock {display: inline-block; } .red {color: #c00; } .blue {color: #1785e9; } .orange {color: #c60; } .red span {font-size: 1.55em; font-weight: bolder; line-height: 260%; color: #c00; } .blue span {font-size: 1.55em; font-weight: bolder; line-height: 260%; color: #1785e9; } .W70 {width: 90%; } .W50 {width: 50%; } .W60 {width: 70%; } .W30 {width: 30%; } .W25 {width: 25%; } article h2 {font-weight: 700; margin: .8em auto .8em; color: #252525; } article section {width: 100%; margin: auto; } section h3 {font-weight: 500; margin: 1.0em auto 0; padding: 10px 15px; color: #252525; border-radius: 2px; background: #f7f7f7; } section h3.second {background: none; } section h4 {font-size: 120%; font-weight: 500; margin: 10px 0 10px 2%; padding-left: 15px; color: #252525; background-image: url(../images/qa/icon_arrow.png); background-repeat: no-repeat; } section h5 {font-size: 120%; font-weight: 500; width: 100%; margin: 20px 0 20px 2%; color: #1785e9; } section h6 {font-size: 140%; font-weight: bolder; margin: 0 0 0 0; margin: 1em auto 0; padding: 10px 15px; color: #666; } article h2 span, article h3 span {font-size: .8em; font-weight: normal; margin-left: 10px; } section p {font-size: 100%; line-height: 200%; margin: 1em 3%; } section ul {width: 95%; margin: 20px auto; } section ul li {line-height: 160%; margin-bottom: 15px; margin-left: 5%; list-style-type: decimal; } section ul li img {display: block; clear: both; margin: 15px; } section ul li span {color: #999; } section ol {width: 100%; margin: 10px auto; } section ol li {line-height: 200%; list-style-type: decimal; } section ol li img {display: block; clear: both; margin: 15px; } section ol li span {color: #999; } section img {display: block; width: 100%; height: auto; margin: auto; } section a {text-decoration: underline; color: #314da5; } section a:visited {color: #314da5; } section a:hover {color: #414da5; } section a:active {color: #dd4b39; }

/*----------------------
	QA
-----------------------*/
#qaContent ul,
li
{
    margin: 0;
    padding: 0;

    list-style-type: none !important;
}
#qaContent
{
    width: 100%;
}
#qaContent h2,
h3
{
    clear: both;
}
#qaContent h5
{
    font-weight: 700;

    margin: 0 auto !important;

    color: #666 !important;
}
#qaContent ul.accordionPart
{
    margin: 10px 0 30px 0;
}
#qaContent ul.accordionPart li
{
    margin-top: 12px;
    margin-right: 0;
    padding-bottom: 12px;

    border-bottom: solid 1px #e3e3e3;
}
#qaContent ul.accordionPart li .qa_title
{
    padding-left: 28px;

    cursor: pointer;

    color: #314da5;
    background: url(../images/qa/icon_q_a.gif) no-repeat 0 3px;
}
#qaContent ul.accordionPart li .qa_title_on
{
    text-decoration: underline;
}
#qaContent ul.accordionPart li .qa_content
{
    margin: 6px 0 0;
    padding-right: 20px;
    padding-left: 28px;

    color: #666;
    background: url(../images/qa/icon_q_a.gif) no-repeat 0 -24px;
}

/*#qaContent img
{
    width: auto;
    height: auto ;
    margin-left: 0;
}*/

.noline
{
    margin-left: 0;;

    border: solid 1px #fff!important;
}
.noline img
{
    width: 60% !important;
    height: auto ;
    margin-left: 0;
}
.noline2
{
    margin-left: 0;;

    border: solid 1px #fff!important;
}
.noline2 img
{
    width: 100% !important;
    height: auto ;
    margin-left: 0;
}
.fontbold
{
    font-weight: 600;

    color: #666;
}


.qa
{
    margin-bottom: 50px;
}

#QandA img
{
    width: auto;
    max-width: 100%;
    height: auto ;
    margin-left: 0;
}

#QandA .Question
{
    /*標題的CSS定義*/
    width: 95%;
    margin-right: 30px;
    padding-top: 0;
    padding-left: 20px ;

    color: #212121;
    border-bottom: 1px #aaa dotted;
    background: url(../images/qa/icon_q.gif);
    background-repeat: no-repeat;
    background-position: 0 8px;
}



#QandA .Answer
{
    /*內文的CSS定義*/
    display: none;

    width: 95%;
    padding: 0 0;
    padding-top: 0;
    padding-left: 20px ;

    color: #212121;
    border-bottom: 1px #fff dotted;
    background: url(../images/qa/icon_a.gif);
    background-repeat: no-repeat;
    background-position: 2px 7px;
}


#QandA:hover
{
    /*滑鼠移至區塊變色*/
}

#QandA .Answer ul
{
    margin: 0 30px;
}
#QandA .Answer li
{
    margin: 0;
    padding: 0;

    list-style-type: none !important;
}
#QandA .Answer h2
{
    clear: both;
}
#QandA .Answer h5
{
    font-weight: 700;

    margin: 0 auto !important;

    color: #666 !important;
}
.btn_b
{
    display: inline-block;
    display: block;;

    padding: 10px 25px;

    text-align: center;
    white-space: nowrap;
    text-decoration: none;

    color: #333;
    border: 1px solid #dcdcdc;
    -webkit-border-radius: 4px;
       -moz-border-radius: 4px;
            border-radius: 4px;
    background: -moz-linear-gradient( center top, #ededed 5%, #dfdfdf 100% );
    background:  -ms-linear-gradient( top, #ededed 5%, #dfdfdf 100% );
    background: -webkit-gradient( linear, left top, left bottom, color-stop(5%, #ededed), color-stop(100%, #dfdfdf) );
    background-color: #ededed;
    -webkit-box-shadow: inset 1px 1px 0 0 #fff;
       -moz-box-shadow: inset 1px 1px 0 0 #fff;
            box-shadow: inset 1px 1px 0 0 #fff;
    text-shadow: 1px 1px 0 #fff;

    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf');
}
.btn_b:hover
{
    background: -moz-linear-gradient( center top, #dfdfdf 5%, #ededed 100% );
    background:  -ms-linear-gradient( top, #dfdfdf 5%, #ededed 100% );
    background: -webkit-gradient( linear, left top, left bottom, color-stop(5%, #dfdfdf), color-stop(100%, #ededed) );
    background-color: #dfdfdf;

    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed');
}
.btn_b:active
{
    position: relative;
    top: 1px;
}
.btn_b:visited
{
    color: #313030;
}


/*----------------------------------
	INDEX_QA
----------------------------------*/
.box
{
    float: left;

    width: 31%;
    height: 200px;
    margin: 20px 1% 0;

    border: #e7e7e7 1px solid;
}
.box h3
{
    /*-----置中-----*/ display: flex;

    height: 50px;
    margin-top: 0 !important;

    text-align: center;

    background: #e7e7e7;

    align-items: center;
    justify-content: center;
}
.box li
{
    line-height: 120%;

    margin-top: 10px;
    margin-left: 50px;

    list-style-type: disc !important;
}
.tel_box p
{
    font-size: .88em;
    line-height: 240%;

    margin: 20px auto;;

    text-align: center;
}

/*-----------QA分類下拉------------*/
.qalist
{
    font-size: 1.0em;

    display: inline-block;

    width: 60%;
    margin-left: 0;

    vertical-align: top;
}

.qa_choice
{
    line-height: 3.0em;;

    margin-top: 25px ;
}

.qalist li
{
    line-height: 1.2em;

    float: left;

    margin-left: 10px;

    list-style: none;
}
.qalist select
{
    display: flex !important;

    width: 120px !important;
    height: 40px;;
    margin-right: 0;
    padding: 8px;

    border: solid 1px #e8e8e8;
}

.qalist li a
{
    color: #666;
}
.qalist li a:visited
{
    color: #666;
}
.qalist li a:hover
{
    color: #666;
}
.qalist li a:active
{
    color: #666;
}


/*-----------QA 麵包屑------------*/
#qa_crumb
{
    font-size: .8em;

    clear: both;

    width: 100%;
    height: 30px;
    margin: 0 auto 0;
    padding-left: 10px;
}

#qa_crumb li
{
    line-height: 1.875em;

    float: left;

    margin: 10px auto 20px;;
    padding: 0 1px 0 0;
}

#qa_crumb li a
{
    color: #666;
}
#qa_crumb li a:visited
{
    color: #666;
}
#qa_crumb li a:hover
{
    color: #666;
}
#qa_crumb li a:active
{
    color: #666;
}


/*-----------問題下拉------------*/
.pblist
{
    display: block;
    float: left;
    clear: both;

    width: 80%;
    margin-left: 15%;
}

.pblist span
{
    display: block;
    float: left;

    margin: 0 35px 10px 0;
    margin-left: 0;

    color: #666;
}
.pblist ul
{
    float: left;

    margin-top: 0;;
    margin-bottom: 0;
}

.pblist li
{
    font-size: 1.0em;

    float: left;

    margin-left: 6px;

    list-style: none;
}
.pblist select
{
    display: flex !important;

    width: 200px ;
    height: 40px;;
    margin-right: 10px;
    padding: 2px 10px;

    border: solid 1px #e8e8e8 ;
}

.pblist li a
{
    color: #666;
}
.pblist li a:visited
{
    color: #666;
}
.pblist li a:hover
{
    color: #666;
}
.pblist li a:active
{
    color: #666;
}

/*----------------------
	input info
-----------------------*/

.login
{
    width: 100%;
    margin: 0 auto;
    padding: 30px 0 20px 0;

    border: 1px solid #ececec;
}
.login p
{
    width: 100%;
    margin: 0;

    text-align: center;
}
.login span
{
    font-size: 90%;

    display: block;
}

.info
{
    clear: both;
    overflow: hidden;

    width: 100%;
    margin: 0 auto 0;
}
.info p
{
    display: block;
    overflow: hidden;

    width: 44%;  
    margin: 5px auto 5px;

    text-align: center;

    color: #555;
}
.info p span
{
    width: auto;

    color: #666;;
}
.login img
{
    display: inline-table;

    width: auto;

    vertical-align: middle;
}
.login h2 img
{
    margin-bottom: 8px;
}
.info p img
{
    display: inline-table; 

    margin-bottom: 8px;

    vertical-align: middle;
}
.info p label
{
    font-size: 110%;
    line-height: 2;

    float: left;

    width: 30%;
}
.info p input
{
    width: 100%;
    margin-right: 10px;
}
.info p .memory input
{
    width: auto;
}
.info input,
.info select
{
    font-family: '微軟正黑體', '新細明體', Arial, sans-serif;

    margin-bottom: 5px;
    padding: 7px 10px 5px;

    text-align: center;
    letter-spacing: .1em;

    color: rgb(153, 153, 153);
    border: 1px solid #999;
    border-radius: 4px;
}

.memory input,
.memory  select
{
    padding: 7px 0 5px; 

    border: 0;
}
.memory
{
    font-size: 14px;

    float: left;

    margin: 0 0 0 5px;
}

.forget a
{
    font-size: 14px;

    float: right;

    margin: 0 5px 0 0;

    letter-spacing: .05em;

    color: #314da5;
}
.forget a:hover
{
    text-decoration: underline;
}

#alert
{
    font-size: 14px;

    display: block;

    width: 45%;
    margin: 0 auto;
    padding: 8px 5px 6px 5px;

    text-align: center;
    letter-spacing: .05em;

    color: #bd0306;
    background-color: #fdecec;
}



.enabled-list
{
    line-height: 1.5em;

    display: block;
    overflow: hidden;

    margin: 20px auto 20px;

    text-align: left;

    color: #555;
}

.enabled-list img
{
    display: inline;

    width: auto;
    margin: 0 5px;

    vertical-align: top;
}

.enabled-list span
{
    display: block;
    float: left;

    margin: 0 35px 10px 0;
    margin-left: 0;

    color: #666;
}



.enabled-list.hb
{
    line-height: 280%;

    width: 100%;
    height: 60px;
}

.enabled-note
{
    font-size: 14px;

    margin: 5px 0 5px 85px;

    color: #333;
}

.enabled-list label
{
    font-size: 100%;

    margin: 10px 10px 10px 0;

    vertical-align: top;;

    color: #666;
}

.enabled-list input,
.enabled-list select
{
    margin-bottom: 10px;
    padding: 10px 10px ;

    text-align: center;
    letter-spacing: .1em;

    color: #666;
    border: 1px solid #999;
    border-radius: 4px;
}

.enabled-list input[type='radio']
{
    display: none;
}

.enabled-list  input[type='radio'] + label
{
    display: inline-block;

    width: 30%;
    padding: 5px 10px;

    cursor: pointer;

    background-color: #ccc;
}


.enabled-list  input[type='radio']:checked + label
{
    color: #333;
    background-color: #b1dcfb;
}


.enabled-list textarea
{
    height: 150px;
    margin-bottom: 10px;
    padding: 10px 10px;

    text-align: center;
    letter-spacing: .1em;

    color: #666;
    border: 1px solid #999;
    border-radius: 4px;
}

.enabledbox span
{
    margin: 10px 10px;

    color: #555;
}

.remind
{
    font-size: 14px;

    display: block;

    width: 90%;
    margin: 10px auto 20px;
    padding: 8px 5% 6px ;

    text-align: center;

    color: #bd0306;
    -webkit-border-radius: 10px;
       -moz-border-radius: 10px;
            border-radius: 10px;
    background-color: #fdecec;
}


.remind01
{
    font-size: 100%;

    display: block;

    width: 90%;
    margin: 10px auto 10px;
    padding: 8px 5% 6px ;

    text-align: center;

    color: #bd0306;
    -webkit-border-radius: 10px;
       -moz-border-radius: 10px;
            border-radius: 10px;
}

.txt_01
{
    width: 95%;
    height: 500px;
    margin: 0 auto; 

    border: 1px solid #ccc;
}
.txt_02
{
    overflow: hidden;  

    width: 70%;
    margin: 20px auto;
}
.txt_02 h2
{
    font-size: 140%;
    font-weight: bold;

    margin: 0 0 0 0;
    margin: 10px auto ;
    padding: 10px 15px;

    text-align: center;

    color: #083898;
    background: #f7f7f7;
}


.txt_02 p
{
    font-size: 120%; 

    padding: 10px;

    text-align: center;
}

.txt_03
{
    overflow: hidden;  

    width: 70%;
    margin: 30px auto 20px;
}

.txt_03 ul li
{
    font-size: 120%;

    float: left;

    width: 49%;
    margin: 0;
    padding: 20px;

    text-align: center;

    border: 1px solid #ccc;
    border-left: none;
}

.txt_03 ul li:first-child
{
    border-left: 1px solid #ccc;
}


.txt_L
{
    text-align: left;
}
.txt_C
{
    text-align: center;
}
.txt_R
{
    text-align: right;
}

/*----------------------
	submit
-----------------------*/
section .submit
{
    font-size: 110%;

    clear: both;
    overflow: hidden;

    width: 100%;
    margin: 30px auto;

    text-align: center;
}

section .submit2
{
    font-size: 110%;

    clear: both;
    overflow: hidden;

    width: 90%;
    margin: 20px auto 30px auto;

    text-align: left;
}

section .submit3
{
    font-size: 110%;

    clear: both;
    overflow: hidden;

    width: 100%;

    text-align: right;
}

section .submit4
{
    font-size: 110%;

    clear: both;
    overflow: hidden;

    width: 80%;
    margin: 30px auto;

    text-align: center;
}
section .submit input.button,
section .submit2 input.button,
section .submit4 input.button
{
    font-family: '微軟正黑體', '黑體', Arial, Helvetica, sans-serif;
    font-size: 100%;

    margin-right: 10px;
    margin-bottom: 10px;
    padding: 10px 50px;

    cursor: pointer;
    transition: all .1s linear;
    text-align: center;
    vertical-align: middle;
    text-decoration: none;

    color: #333;
    border: 1px solid #fbce23;
    -webkit-border-radius: 2px;
       -moz-border-radius: 2px;
            border-radius: 2px;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#feec98+1,fedf53+100 */
    background: -webkit-gradient(linear, left top, left bottom, from(#fee158), to(#fdc617));
    background: -webkit-linear-gradient(top, #fee158, #fdc617);
    background:    -moz-linear-gradient(top, #fee158, #fdc617);
    background:     -ms-linear-gradient(top, #fee158, #fdc617);
    background:      -o-linear-gradient(top, #fee158, #fdc617);
    background:         linear-gradient(top, #fee158, #fdc617);
    background-color: #fdca3d\9;

    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#feec98', endColorstr='#fedf53',GradientType=0 ); /* IE6-9 */
}

section .submit input.button:hover,
section .submit2 input.button:hover,
section .submit4 input.button:hover,
section .submit section.button2:hover
{
    transition: all .1s linear;

    border: 1px solid #f2c85c;
    background: -webkit-gradient(linear, left top, left bottom, from(#f2c85c), to(#f0af0b));
    background: -webkit-linear-gradient(top, #f2c85c, #f0af0b);
    background:    -moz-linear-gradient(top, #f2c85c, #f0af0b);
    background:     -ms-linear-gradient(top, #f2c85c, #f0af0b);
    background:      -o-linear-gradient(top, #f2c85c, #f0af0b);
    background: #ffd359\9;
}

section .submit input.button:active,
section .submit2 input.button:active,
section .submit section.button2:active
{
    position: relative;
    top: 3px;
}

/*----------------------
	STEP
-----------------------*/
/* = STEPS CONTAINER
----------------------------*/
.wizard-steps2
{
    font-weight: bold;

    margin: 0 ;
    padding: 0;
}
.wizard-steps2 div
{
    margin-bottom: 30px;
}

.wizard-steps2 dt
{
    font-size: 90%;

    float: left;

    margin-right: 0;
}
.wizard-steps2 dd
{
    float: left;
}
.blank
{
    margin-bottom: 10px;
}
/* = STEP NUMBERS
----------------------------*/

.stepnm
{
    line-height: 200%;

    display: block;
    float: left;

    width: 95%;
    margin: 0 5px 10px;

    text-align: center;

    color: #fff;
    border: 2px solid #ccc;
    -webkit-border-radius: 8px;
       -moz-border-radius: 8px;
            border-radius: 8px;
    background: #ccc;
}
/* = arrow
----------------------------*/
.wizard-steps2 .arrow
{
    margin-top: 25px;
    margin-right: 5px;
    margin-left: 5px;;

    border-top: 7px solid #fff;
    border-bottom: 7px solid #fff;
    border-left: 7px solid #ccc;
}
/* = COMPLETED STEPS
----------------------------*/

.wizard-steps2 .completed-step_3
{
    line-height: 160%;

    position: relative;

    display: block;
    float: left;

    width: 195px;
    height: auto;
    padding: 10px 0 10px 3px;

    text-align: center;

    color: #ccc;
    color: #666;
    border: 2px solid #ccc;
    -webkit-border-radius: 8px;
       -moz-border-radius: 8px;
            border-radius: 8px;
    background-color: #fff;
}
.wizard-steps2 .completed-step_4
{
    line-height: 160%;

    position: relative;

    display: block;
    float: left;

    width: 230px;
    height: auto;
    padding: 10px 0 10px 3px;

    text-align: center;

    color: #ccc;
    color: #666;
    border: 2px solid #ccc;
    -webkit-border-radius: 8px;
       -moz-border-radius: 8px;
            border-radius: 8px;
    background-color: #fff;
}
.wizard-steps2 .completed-step_4.wider
{
    width: 311px;
}

.circle
{
    font-family: Courier, Arial;
    font-size: 18px;
    line-height: 1.9;

    float: left;

    width: 35px !important;
    height: 35px;
    margin-right: 10px;
    padding: 0 10px 2px ;

    text-align: center;

    color: #333 !important;
    border: 2px solid #e7e7e7 !important;
    -webkit-border-radius: 35px;
       -moz-border-radius: 35px;
            border-radius: 35px;
    background-color: #fff;
}
.circle_r
{
    font-family: Courier, Arial;
    font-size: 14px;
    line-height: 1.7;

    display: inline-block;
    float: right;

    width: 24px !important;
    height: 24px;

    text-align: center;
    vertical-align: text-top;

    color: #333 !important;
    border: 2px solid #fff !important;
    -webkit-border-radius: 12px;
       -moz-border-radius: 12px;
            border-radius: 12px;
    background-color: #fff;
}
.completed-step_3 p
{
    font-weight: 800;
    line-height: 180%;

    margin: 0 30px;

    text-align: center;
}
.completed-step_3 ul
{
    margin-top: 20px;;

    text-align: center;
}
.completed-step_3 ul li
{
    line-height: 1.5;

    display: flex;

    margin-left: 8px;
    padding: 15px 5px;

    list-style: none;

    text-align: left;

    color: #666;
    background: #e7e7e7;

    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
}
.step4_box
{
    margin: 0 5px 15px 2px !important;

    border: 3px dotted #e7e7e7 ;
}
.step4_box h3
{
    font-size: 1.0em;

    margin: 5px;

    color: #666 ;
}
.completed-step_4 p
{
    font-weight: 800;
    line-height: 180%;

    margin: 0;

    text-align: center;
}
.completed-step_4 .step4_box ul li p
{
    line-height: 3;
}
.completed-step_4 ul
{
    width: 98%;
    margin-top: 20px;

    text-align: center;
}
.completed-step_4 ul li
{
    line-height: 3;

    display: flex;

    margin-bottom: 5px;
    margin-left: 5px;
    padding: 4px 10px;

    list-style: none;

    text-align: left;

    color: #666;
    background: #e7e7e7;

    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}
.wizard-steps2 .completed-step_3 span
{
    margin-left: 5px;;

    color: #fff;
    border: 2px solid #ccc;
    text-shadow: none; /*margin-bottom:10px;*/
}
.wizard-steps2 .completed-step_4 span
{
    margin-left: 5px;;

    color: #fff;
    border: 2px solid #ccc;
    text-shadow: none; /*margin-bottom:10px;*/
}


/* Contact */
.contact{
 	width:100%;
}
.contact ul{
	width: 100%;
  display: flex;
  margin: 30px auto;
  overflow: hidden;
 flex-wrap: wrap;
}
.contact ul li{
 flex: 0 0 32.3%;;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 160%;
  color: #4b4b4b;
  border: 2px solid #ddd;
 margin:5px;
}
.contact ul li:last-child{
    margin-right:0;
}
.box:nth-child(3n-1){
    margin-left:1.5%;
}
.box:nth-child(3n+1){
    margin-right:1.5%;
}
.contact .tel,.contact .fax,.contact .email{
	padding: 20px 10px 12px;
}
.contact dl.tel::before {
  background: url(../images/icon_tel.png) no-repeat center center;
  content: "";
  width: 50px;
  height: 50px;
  position: absolute;
  margin-top: -3px;
}
.contact dl.fax::before {
  background: url(../images/icon_fax.png) no-repeat center center;
  content: "";
  width: 50px;
  height: 50px;
  position: absolute;
  margin-top: -3px;
}
.contact dl.email::before {
  background: url(../images/icon_email.png) no-repeat center center;
  content: "";
  width: 50px;
  height: 50px;
  position: absolute;
  margin-top: -3px;
}

.contact dl{
	margin:0px auto;
}
.contact dt,.contact dd{
	margin-left:57px;
}
.contact dl h2{
	margin:auto;
	font-size: 1.475em;
	font-weight:600;
    line-height: 1;
	letter-spacing:3px;
	color:#4b4b4b;
}
.contact dd{
	
	font-size:1.55rem;
	font-weight:550;
	line-height:30px;
}
.contact .email dd{
	
	font-size:1.275rem;
}
.contact dd span{font-size:0.6125em;font-weight:normal;color:#4b4b4b;}

/* Guide */

h3.slogan{
	width:90%;
	margin:35px auto 5px;
	text-align:center;
	font-size:1.75em;
	font-weight:500;
	font-style:italic;
    line-height:1.8em;
	color:#41beee;
	background:none;
	letter-spacing:2px;
}
.kv_guide{
    width:100%;
    overflow: hidden;
}
.kv_guide .help{
    width:85%;
    display:flex;
    margin:0 auto 20px;
}
.kv_guide dl{
    display:block;
    width:33%;
    text-align: center;
    font-size:1.125em;
    letter-spacing: 2px;
}
.kv_guide dl dt, .kv_guide dl dd{
    width:100%;
}

.kv_guide dl img{
    width:auto;
    margin:auto;
}
.kv_guide .help dl h4{
    margin: 15px 10px 10px;
    padding:0px;
    font-size: 1.33em;
    font-weight: 500;
    color: #41beee;
    background: none;
}
.kv_guide .help dl:nth-child(2) h4{
    color:#e9569a;
}
/*step*/

.service_step {
  width: 100%;
  display: block;
  margin: 0px auto 20px;
  clear: both;
  float: left;
}

.service_step span.caption img{
    width: 53%;
    height: auto;
    float: left;
    margin-left: 10px;
    margin-top: 5%;
    border: 1px solid #e9e8e9;
    padding: 8px;
}

.service_step dl {
  line-height: 200%;
  float: left;
  display: block;
  width: 45%;
  height: auto;
  margin-bottom: 0;
  position: relative;
  padding: 5% 10px 5% 10px;
}
.service_step dt {
  float: left;
  padding-left: 2%;
  padding-right: 2%;
  width: 100%;
 
}
.service_step dt span{
    padding:7px 20px;
    background:#fce8f0;
    color:#e9569a;
    font-size:1.4125em;
    letter-spacing: 1px;
}
.service_step dt h3 {
  font-weight: normal;
  padding: 0;
  font-size: 1.75em;
  line-height: 160%;
  background:none;
    color:#e9569a;
    letter-spacing: 1px;
    margin:15px auto 0;
}
.service_step dd {
  float: left;
  padding-left: 2%;
  padding-right: 2%;
  width: 100% ;
  font-size:1.3125em;
}
.service_step dd p {
    margin: 10px auto;
    line-height: 1.5;
}

.service_step .next{
    width:100%;
    clear:both;
    text-align:center; 
    display:table; 
}
.service_step .next img{
    width:auto;
    height:auto;
    margin:30px auto; 
}
.hide-sm
{
    display: block;
}

.hide-lg
{
    display: none;
}

@media screen and (max-width: 1024px) and (min-width:769px){

#wrap {
    width: auto;
}
.contact dd {
    line-height: 1.25em;
}
.contact ul li {
   flex: 0 0 55%;
    padding-left: 10px;
    margin:7px auto;
    }
.contact ul li:last-child {
    margin-right: auto;
}
/*Guide step*/

.service_step {
  width: 80%;
  margin:20px auto auto;
  float: none;
}

.service_step span.caption img{
    margin:auto;
  width: auto;
  float: none;
  padding: 10px;
}

.service_step dl {
  line-height: 170%;
  float: none;
  width: 80%;
  margin:auto;
  padding: 20px 10px;
  font-size: 90%;
}
.service_step dt {
  float: none;
  padding-top: 0; 
}
.service_step dt span{
   margin: auto;
display: block;
text-align: center;
display: block;
text-align: center;
width: 40%;
}
.service_step dt h3 {
  text-align: center;
}
.service_step dd {
  float: none;
}
.service_step dd p {
  text-align: center;
}

}
@media screen and (max-width: 768px) /*---IPAD768x1014---*/
{
    #QandA .Answer
    {
        padding-top: 0;
        padding-left: 20px ;
        /*內文的CSS定義*/

        background: url(../images/qa/icon_am.gif);
        background-repeat: no-repeat;
        background-position: 6px 7px;
    }

    #QandA .Answer ul
    {
        margin: 15px;
    }

    .qalist
    {
        display: block;

        width: 80%;
    }

    .qa_choice
    {
        line-height: 3.0em;;

        margin-top: 25px ;
    }

    .qalist li
    {
        line-height: 1.2em;

        float: left;

        margin-left: 0;
    }
    .qalist select
    {
        display: flex !important;

        width: 100px  !important;
        margin-right: 5px;
        padding: 8px;
    }

.contact ul li {
    flex: 0 0 70%;
	display:block;
    margin: 7px auto;
    padding-left: 30px;
	}

    /*-----------問題下拉------------*/
    .pblist
    {
        display: block;
        float: left;
        clear: both;

        width: 100%;
        margin-left: 0;
    }


    .pblist span
    {
        margin: 0 0 10px 0;
    }

    .pblist li
    {
        margin-left: 10px;
    }
    .pblist select
    {
        width: 300px ;
        margin-right: 0;
    }

    .top_news
    {
        width: 100%;
    }

    .top_news_right
    {
        padding: 2%;
    }

    .top_news_right a
    {
        line-height: 150%; 

        padding-left: 0;
    }


    section img
    {
        width: 100%;
        margin: 0;
    }

    section h5
    {
        width: 100%;
        margin-left: 0;
    }

    section ol li
    {
        color: #666;
    }


    .number02
    {
        width: 90%;
    }

    .info p
    {
        width: 90%;
    }

    #alert
    {
        width: 92%;
    }

    .login img
    {
        width: auto;
        margin: 0;
    }

    .info p img
    {
        width: auto;
        margin: 0;
    }

    ul.submenu li
    {
        float: left;

        width: 100%;

        border-left: solid 1px #dfdfde;
    }

    .enabled-list
    {
        float: inherit;
    }


    .enabled-list label
    {
        display: inline-block;
        float: none;

        margin: 10px 0;
    }

    .enabled-list input,
    .enabled-list select
    {
        width: 100%;
    }

    .enabled-list textarea
    {
        width: 100%;
    }

    .floatLeft
    {
        float: none;
    }


    .W50
    {
        width: 100%;
    }


    .W60
    {
        width: 100%;
    }


    .W70
    {
        width: 100%;
    }

    .W25
    {
        width: 30%;
    }


    .qalist li
    {
        margin-left: 0;
    }

    /*----------------------------------
	INDEX_QA
----------------------------------*/

    /*-------STEP---------*/
    .blank
    {
        margin-bottom: 20px;
    }
    .wizard-steps2 div
    {
        margin-bottom: 10px !important;
    }
    .wizard-steps2 dt
    {
        font-size: 100%;

        float: left;
        clear: both;

        width: 100% ;
        margin-bottom: 0;
    }
    .wizard-steps2 dd
    {
        float: left;
        clear: both;

        margin-left: 48%;
    }
    .stepnm
    {
        font-size: .88em ;
        font-weight: 800;;
        line-height: 200%;

        display: block;
        float: left;

        width: 100%;
        margin: 0 5px 0 5px;

        text-align: center;

        color: #fff;
        border: 2px solid #ccc;
        -webkit-border-radius: 8px;
           -moz-border-radius: 8px;
                border-radius: 8px;
        background: #ccc;
    }
    .wizard-steps .completed-step_1
    {
        line-height: 200%;

        position: relative;

        display: block;
        float: left;

        width: 100%;
        height: 40px;
        margin: 0 auto;;
        padding: 8px 10px 0 3px;

        color: #333;
        color: #666;
        border: 2px solid #333;
        -webkit-border-radius: 8px;
           -moz-border-radius: 8px;
                border-radius: 8px;
        background-color: #fff;
    }
    .wizard-steps .completed-step_2
    {
        line-height: 200%;

        position: relative;

        display: none;
        float: left;

        width: 100%;
        height: 60px;
        margin: 0 auto;;
        padding: 8px 10px 0 3px;

        color: #333;
        color: #666;
        border: 2px solid #ccc;
        -webkit-border-radius: 8px;
           -moz-border-radius: 8px;
                border-radius: 8px;
        background-color: #fff;
    }
    .wizard-steps .completed-step_1
    {
        margin-bottom: 5px;
    }
    .wizard-steps .completed-step_2
    {
        margin-bottom: 5px;
    }
    .wizard-steps2 .completed-step_3
    {
        line-height: 200%;

        position: relative;

        display: block;
        float: left;

        width: 100%;
        height: 100%;
        margin: 0 auto;;
        padding: 8px 10px 8px 3px;

        color: #333;
        color: #666;
        border: 2px solid #ccc;
        -webkit-border-radius: 8px;
           -moz-border-radius: 8px;
                border-radius: 8px;
        background-color: #fff;
    }
    .completed-step_3
    {
        text-align: center;
    }
    .completed-step_3 ul
    {
        width: 100%;
    }
    .completed-step_3 ul li
    {
        margin: 0 0 5px 6px;
    }
    .wizard-steps2 .completed-step_4
    {
        line-height: 200%;

        position: relative;

        display: block;
        float: left;

        width: 100%;
        height: 100%;
        margin: 0 auto;;
        padding: 8px 10px 8px 3px;

        color: #333;
        color: #666;
        border: 2px solid #ccc;
        -webkit-border-radius: 8px;
           -moz-border-radius: 8px;
                border-radius: 8px;
        background-color: #fff;
    }
    .wizard-steps2 .completed-step_4.wider
    {
        width: 100%;
    }
    .completed-step_4
    {
        text-align: center;
    }
    .completed-step_4 ul
    {
        width: 100%;
    }
    .completed-step_4 ul li
    {
        margin: 0 5px 5px 6px;
    }
    .wizard-steps .completed-step_3
    {
        margin-bottom: 5px;
    }
    .wizard-steps .completed-step_4
    {
        margin-bottom: 5px;
    }
    .wizard-steps .arrow
    {
        display: none;;

        margin-top: 0;
        margin-bottom: 5px;

        border-width: 15px 10px 0 10px;
        border-style: solid;
        border-color: #ccc transparent transparent transparent;
    }
    .wizard-steps2 .arrow
    {
        margin-top: 10px;
        margin-bottom: 5px;

        border-width: 15px 10px 0 10px;
        border-style: solid;
        border-color: #ccc transparent transparent transparent;
    }
.contact ul li:last-child {
    margin-right: auto;
}

.service_step dl {

  padding:5% 10px 5% 10px;
  margin: 7px auto;
}

.kv_guide .help{
    width:90%;
}
.kv_guide dl img {
    width: 80%;
}
}

@media screen and (max-width: 568px){
    .box
    {
        float: left;

        width: 100%;
        height: auto;
        margin: 8px 0;;

        border: #e7e7e7 1px solid;
    }
    .box h3
    {
        /*-----置中-----*/ display: flex;

        height: 50px;
        margin-top: 0 !important;

        text-align: center;

        background: #e7e7e7;

        align-items: center;
        justify-content: center;
    }
    .box li
    {
        line-height: 120%;

        margin-top: 10px;
        margin-left: 50px;

        list-style-type: disc !important;
    }
.box:nth-child(3n-1){
    margin-left:auto;
}
.box:nth-child(3n+1){
    margin-right:auto;
}
.kv_guide dl img {
    width: 80%;
    margin:auto;
}
.service_step {
  width: 100%;
  }
.service_step .caption img {
    width: 100%;
    padding:8px;
    float: none;
    border: 1px solid #e9e8e9;
}
.service_step dl {
  width: 90%;
  float:none;
  margin:auto;
}
.service_step dt span{
    width:auto;
}

h3.slogan {
    margin: 15px auto 5px;
    line-height: 140%;
}
.kv_guide dl {
    display: block;
    width: 50%;
    margin:auto;
    }
.kv_guide .help {
   /* width: 80%;*/
    display: block;
    margin: auto;
}
.kv_guide dl dt, .kv_guide dl dd {
    margin: 0px auto 20px;
}
/*Guide step*/

.service_step {
  width: 95%;
  float:none;
}
.service_step dl {
  width: 90%;
  padding:0px;
  margin-top:30px;
}
.service_step dt {
    float: none;
    }
.service_step dt span{
width: 50%;
display: block;
margin: auto;
text-align: center;
}
.service_step dt h3{
    margin-bottom: 15px;
    text-align:center;
}
.service_step dd {
    float:none;
}
.service_step dd p{
    margin-top: 20px;
    line-height: 1.5;
    text-align:center;
}
.service_step .next img{
    margin:10px auto 0; 
}
.hide-sm
{
    display: none;
}

.hide-lg
{
    display: block;
}
}
@media screen and (max-width: 540px)
{
    #QandA .Answer
    {
        padding-top: 0;
        padding-left: 20px ;
        /*內文的CSS定義*/

        background: url(../images/qa/icon_am2.gif);
        background-repeat: no-repeat;
        background-position: 2px 7px;
    }

    #QandA .Answer ul
    {
        margin: 8px;
    }


    .pblist li
    {
        margin-left: 5px;
    }
    .pblist select
    {
        width: 250px ;
        margin-right: 0;
    }

    section img
    {
        width: 100%;
    }

    section h5
    {
        font-size: 100%;
    }

    section h6
    {
        font-size: 100%;
    }


    .enabledbox p
    {
        text-align: center;
    }

    .enabled-list
    {
        margin: 10px auto 20px;
    }

    .enabledbox span
    {
        line-height: 2em;
    }


    .W30
    {
        width: 100%;
    }

    .W25
    {
        width: 95%;
    }
.contact ul li {
   flex: 0 0 95%;
    padding-left: 10px;
    }
.kv_guide dl {
    width: 70%;
}
}



@media screen and (max-width: 385px)
{
    #QandA .Answer
    {
        padding-top: 0;
        padding-left: 20px ;
        /*內文的CSS定義*/

        background: url(../images/qa/icon_am2.gif);
        background-repeat: no-repeat;
        background-position: 2px 7px;
    }

    #QandA .Answer ul
    {
        margin: 8px;
    }

    section .submit input.button,
    section .submit2 input.button,
    section .submit4 input.button
    {
        width: 90%;
    }

    #alert img
    {
        display: none;
    }

    .info p img
    {
        margin: 2%;
    }


    .enabledbox p
    {
        text-align: center;
    }

    .floatLeft
    {
        float: none;
    }
}
@media screen and (max-width: 385px) and (min-width: 320px) {
	.wizard-steps2 dt {
    font-size: 90%;}
}

@media screen and (max-width: 320px)
{
.contact ul li {
    flex: 0 0 100%;
    padding-left: 0px;
    margin: 5px auto
}
.service_step dl {
    width: 100%;
    }
}