@charset 'utf-8';
*, :after, :before {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.section_padding {
    padding: 200px 0px;
    display:block
}


/*---banner---*/
.breadcrumb_part {
    height: 350px;
    display: flex;
    align-items: center;
    justify-content: center;
   background-color: #B08EAD;
   margin:0;
   padding:0
}

.breadcrumb_inner {
	z-index:1;
	display:block;
		background-image:url(../images/ishop_banner.jpg);
	background-repeat:no-repeat;
	background-position:center;
	background-size: cover; 	
    text-align: center;
	height:350px
}
    
    .breadcrumb_inner h2{ 
	   font-family: "微軟正黑體", sans-serif;
    font-size:46px;
    line-height: 1.2;
    color:#1d1285;
	text-align:left;
    font-weight: 500;
    text-transform: capitalize;
	position:absolute;
	top:10%;
	left:15%
}
 .breadcrumb_inner h3{ 
  font-family: "微軟正黑體", sans-serif;
    font-size:29px;
    line-height: 1.2;
    color:#1d1285;
	text-align:left;
    font-weight:500;
	position:absolute;
	top:31%;
	left:15%
}
 .breadcrumb_inner p{ 
	   font-family: "Arial", sans-serif;
    font-size:55px;
    line-height: 1.2;
    color:#1d1285;
	text-align:left;
    font-weight:700;
	position:absolute;
	top:41%;
	left:15%
}

 .contact_form{
    padding: 0;
    margin: 0;
	margin-top:20px
  
}
/*----登入區---*/

    .login_part .login_part_text {
    background-image: -moz-linear-gradient(90deg, #B08EAD 0%, #4B3049 64%, #B08EAD 100%);
    background-image: -webkit-linear-gradient(90deg, #B08EAD 0%, #4B3049 64%, #B08EAD 100%);
    background-image: linear-gradient(90deg, #B08EAD 0%, #4B3049 64%, #B08EAD 100%);
    background-size: 200% auto;
}
  .login_part  {
    padding: 80px 70px;
    height: 600px;
    display: table;
    margin:auto
}  
  
.login_part_text, .login_part_form{
    padding: 80px 15px;
    height: 600px;
    display: table;
}

.login_part .login_part_text .login_part_text_inner,
 .login_part .login_part_text .login_part_form_inner,
 .login_part .login_part_form .login_part_text_inner,
 .login_part .login_part_form .login_part_form_inner{
     display: table-cell;
    vertical-align: middle; 
    text-align:center
}


/*---Welcometxt---*/
  .login_part .login_part_text p {
    color: #fff;
    line-height: 25px;
font-family: "微軟正黑體", sans-serif;
    line-height: 2;
    font-size: 17px;
    margin-bottom: 0px;
    font-weight: 400;
    text-align:center
}

.login_part .login_part_text h2 {
    font-size: 28px;
    line-height: 36px;
    font-weight: 700;color: #fff;
    margin-bottom:30px;
}
  .login_part .login_part_text h3 {
    font-size: 24px;
    font-weight: 700;
    line-height: 35px;
    color: #fff;
    margin-bottom: 17px;
}


/*--up  img---*/
.file_upload {
    opacity: 0;
    width: 518px;
    height: 80px;
    cursor: pointer;
    z-index: 1;
    position: absolute;
   box-sizing: border-box;
    width: 100%;
    margin: 0;
    height: 40px;
    padding: 10px 10px 0px 0px;
    line-height: 20px;
    font-size: 14px;
 }
.type-store-file-wrapper {
      height: 80px;
    background: #eee;
    border-radius: 4px;
    margin:30px 0 10px 0;
    height: 80px;
	padding:0;
    position: relative; 
	border: 2px dashed #ddd; 
	 max-width: 100%;
	 width: 100%;
	     display: table;
}


.upload-wrapper {
    position: relative;
    margin-left:auto;
    width: 100%;
}

.upload-wrapper p{
	 line-height: 20px;
    display: block;
}
.upload-wrapper span{
	cursor:pointer;
	font-weight:bold;
	color:#B08EAD
}

.upload-wrapper img{
	cursor:pointer
}
/*---登入BTN---*/
 .join_btn {
    display: inline-block;
    padding: 18px 36px;
    border-radius: 5px;
    background-color: transparent;
    border: 1px solid #B08EAD;
    font-size: 15px;
    font-weight: 700;
    color: #B08EAD;
    text-transform: uppercase;
    font-weight: 400;
    -webkit-transition: 0.5s;
    transition: 0.5s;
    border: 1px solid #fff;
    background-color: transparent;
    font-size: 14px;
    margin-top: 28px;
    color: #fff ;  
 
}

.join_btn_r {
    border: 1px solid #B08EAD;
    color: #B08EAD;
}

.join_btnBox {
    display:block; 
      width: 100%;
    margin: 20px 0 15px;
}
.p_star {
    display: inline-block;
    position: relative;
}
    .p_star input {margin: 0;
    font-family: inherit;
        overflow: visible; 
        outline: 0;
    }
.join_form_group {
    margin-bottom: 1rem;
}

  .join_form_control {
    display: block;
    width: 100%;
    height: calc(1.5em + .75rem + 2px);
    padding: .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
  .login_part .login_part_form .join_form_control {
    border: 0px solid transparent;
    border-bottom: 1px solid #dddddd;
    border-radius: 0;
}


  .login_part_label {
    position: relative;
    line-height: 20px;
    color:#333;
    font-weight:900;
    text-align: left!important;
    display: block;
    float: left;
    margin:10px 0;
    padding-left:10px;
}


  .login_part_label span {
    display: inline-block;
    margin-left: 8px;
    font-size: 16px;
    color: #FC5659;
}

 @media (max-width: 768px){
	 .login_part  {
    padding: 80px 0px;
    height: 600px;
    display: table;
    margin:auto 
	  }
  .login_part_form{padding:60px 0}
	 } 
	 
/*----------------------------

一般消費 者登入頁面
--------------------------------*/ 
.login-Area {
    background:#fff;
    width: 100%;
    padding-top:15px;
    padding-bottom: 30px;
    clear: both;
    display: flex;
    box-sizing: border-box;
}


.login-box {
	border: 1px solid #ddd;
    background-color: #fff;
    border-radius: 5px;
    margin-top: 30px;
      padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
    max-width: 100%;   
	 box-shadow: 0 1px 3px rgba(0,0,0,.2);
    -webkit-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: all 200ms cubic-bezier(0.55,0.055,0.675,0.19);
}



.login-sec {
    margin-top: 30px;
    margin-bottom: 30px;
    padding: 0;
    position: relative;
    border: #ddd solid 1px;
}



.banner-sec {
    padding: 0;
    position: relative;
    margin: 60px 0 15px 20px;
}

.login_Tit {
    margin-bottom: 10px;
    text-align: center;
    font-size: 18px;
    margin: 8px auto 8px auto;
    color: #222;
}

@media (max-width:1024px) {

    .login-box {
        padding: 0;
        margin: 60px auto;
        position: relative;
    }

    .login-sec {
        margin: 30px auto;
    }
}



/*----------------------------
切換身份
--------------------------------*/

.side-nav-box {
    max-width: 100%;
    margin: 0 auto;
    padding: 0 0;
    position: relative;
    box-sizing: border-box;
    z-index: 1;
}

    .side-nav-box nav {
        display: table;
        content: " ";
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

.side-nav {
    width: 100%;
    padding: 0;
    margin: 0;
    display: block;
    top: auto;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
    left: auto;
}


    .side-nav > li {
        border-color: transparent #ddd #ddd #ddd;
        float: none;
        display: table-cell;
        width: 1%;
        position: relative;
        margin-bottom: -1px;
        list-style-position: inside;
        margin: 0;
        padding: 0;
        list-style-position: inside;
    }

        .side-nav > li.active > a, .side-nav > li.active > a:hover, .side-nav > li.active > a:focus {
            color: #fff;
            background-color:#283d58;
            border: none !important;
            border-color: transparent #ddd transparent transparent;
        }


        .side-nav > li > a {
            text-decoration: none;
            position: relative;
            display: block;
            font-size: 16px;
            line-height: 1.42857143;
            text-align: center;
            color: #222;
            cursor: default;
            background-color: #F8F8F8;
            margin-right: 0;
            padding: 20px 15px;
            margin-bottom: 0;
        }

            .side-nav > li > a:hover {
                color: #fff;
                text-decoration: none;
                background-color: #00587c;
            }

        .side-nav > li:hover > a,
        .side-nav > li.active > a {
            border-color: transparent;
        }

            .side-nav > li:hover > a:after,
            .side-nav > li.active > a:after {
                background: none;
                width: auto;
                height: auto;
                border-top: 5px solid #333333;
                margin-top: 0;
            }

    .side-nav .primary {
        color: #000;
        font-weight: bold;
        box-sizing: border-box;
        background-color: #fff !important;
        border-right: none !important;
    }

    .side-nav > li.primary > a:after {
        background: #FFFFFF;
        border: none;
        width: 12px;
        height: 2px;
        vertical-align: middle;
        margin: -1px;
        opacity: 0;
    }

    .side-nav .primary:hover a {
        background: #fff !important;
        color: #222;
    }

@media (max-width:800px) {
    .side-nav-box {
        padding: 0;
        max-width: 100%;
        width: 100%;
    }

    .side-nav > li > a {
        display: block;
    }

    .side-nav > li {
        float: left;
        display: block;
        width: 50%;
        margin-bottom: 0.838em;
    }

        .side-nav > li > a:after {
            right: 1px;
            width: 10px;
        }

    .side-nav .primary a {
        padding: 0 1em;
        line-height: 40px;
        height: 40px;
    }
}	 
	 
	 
	 /*---左右空間---*/
.form-col {
    float: left;
    width: 49%;
    /*padding: 0 0.313em;*/
}
 /*---------註冊 輸入框空間------*/
.form-box {
    margin: auto;
    max-width:100%;
    padding: 0.313em 1em;
}

    .form-box .required {
        position: relative;
        padding: 0;
    }


    /*------性別-----*/


    .form-box .radio-box label {
        display: inline-block;
        margin-bottom: 0;
    }


    .form-box.radio-box {
        line-height: 36px;
        display: block;
        position: relative;
        right: 0;
        bottom: 0;
        margin: auto;
    }

        .form-box .radio-box label {
            margin-bottom: 0;
        }


/*-----form-detail-----*/

.form-control {
    outline: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    border: none;
    display: block;
    width: 100%;
    background: #fff;
    border: 1px solid #ddd;
    box-sizing: border-box;
    margin-bottom: 0.375em;
    padding: 0 10px;
    border-radius: 3px;
    line-height: 1.5em;
    resize: vertical;
    height: auto;
    padding: .375rem .75rem;
    font-size: 1em;
    word-break: break-all;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}




    .form-control:focus {
        background-color: #fff;
        border-bottom: 2px solid #5fbae9;
    }


.form-group {
    margin-bottom: 1em;
    padding: 0.313em 0.625em;
}


.control-label, .control-box {
    display: block;
    width: auto;
    position: relative;
}


.control-label em {
    color: #ff4d4d;
    font-style: normal;
    font-weight: normal;
    margin-left: 3px;
}
/*-------------------------------------------------
          social login
------------------------------------------------------*/

.socil_loginBox {
    max-width: 100%;
    margin: 20px auto 0px auto;
    margin-right: auto;
    margin-left: auto;
}

.socil_login_row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-left: 0;
    margin-right: 0;
    clear: both;
}

.kepbtnBox {
    text-align: center;

    display: inline-block;
    padding: 8px 10px 15px 10px;
    margin: 0 auto;
}

.social-btn-block {
    padding: 8px 12px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.428571429;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    border: 1px solid transparent;
    border-radius: 4px;
    justify-content: center;
    align-items: center;
    display: block;
}
@media (max-width:800px) {
	.social-btn-block { margin-bottom:15px}
	
}
.btn-primary-fb {
    color: #fff;
    background-color: #3a59a4;
}

    .btn-primary-fb:hover, .btn-primary-fb:focus, .btn-primary-fb:active {
        color: #fff;
        background: rgba(59,92,163,0.8);
    }

.btn-primary-google {
    color: #fff;
    background-color: #d94821;
}

    .btn-primary-google:hover, .btn-primary-google:focus, .btn-primary-google:active {
        color: #fff;
        background: rgba(217,72,33,0.8);
    }

.login-hr {
    position: relative;
    padding-top: 5px;
    padding-bottom: 0px;
    margin: auto;
}
/*--- 訂條件--*/

.divider {
    box-sizing: content-box;
    height: 0;
    overflow: inherit;
    position: relative;
    margin: 20px 30px 30px;
    border-width: 1px;
    border-color: rgba(0, 0, 0, 0.2);
}

    .divider:after {
        content: "or";
        text-align: center;
        position: absolute;
        top: 0px;
        width: 50px;
        color: #aaa;
        background: #fff;
        font-weight: 400;
        left: 50%;
        transform: translate(-50%, -50%);
    }


.divider_footer {
    box-sizing: content-box;
    height: 0;
    overflow: inherit;
    position: relative;
    margin: 0 auto;
    border-width: 1px;
    border-color: rgba(0, 0, 0, 0.2);
}



/*--登入頁忘記帳密--*/
a.login_innerTxt:link {
    color: #0096ff;
    font-size: 12pt;
    text-decoration: none;
    letter-spacing: 1px;
}

a.login_innerTxt:visited {
    color: #0096ff;
    font-size: 12pt;
    text-decoration: none;
    letter-spacing: 1px;
}

a.login_innerTxt:hover {
    color: #315096;
    font-size: 12pt;
    text-decoration: underline;
    letter-spacing: 1px;
    font-weight: bold;
}

a.login_innerTxt:active {
    color: #315096;
    font-size: 12pt;
    text-decoration: underline;
    letter-spacing: 1px;
    font-weight: bold;
}

/*----加入條件---*/
.media-body {
    float: left;
    display: inline-block;
    -ms-flex: 1;
    flex: 1;
    overflow-wrap: break-word;
	    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0 -1px 5px -1px;

}

.media-body span {
    word-break: break-all;
    line-height: 1.9rem;
    margin: 0px;
    padding: 5px;
    font-size: 16px;
	display:inline-block
}
.media-body span a{
   color: #315096;
    font-size: 12pt;
    text-decoration: underline;
    letter-spacing: 1px;
    font-weight: bold;}

.media-body span a:hover{
    color: #0096ff;}
.additemWrapper {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0 -1px 5px -1px;
}

/*---勾選框---*/
.add-chkbox {
    display: inline-block;
    float: left;
    position: relative;
    padding: 0;
    height: 16px;
    width: 16px;
    margin:18px 10px 0 0;
}

.add-chkbox-1 {
    display: inline-block;
    float: left;
    position: relative;
    padding: 0;
    height: 16px;
    width: 16px;
    margin:8px 10px 0 0;
}
.addon {
    position: relative;
    z-index: 1;
    height: 100%;
    width: 100%;
}

.addImgBox {
    float: left;
    display: inline-block;
    margin-bottom: 0 5px 5px 0;
    position: relative;
    padding: 0;
    width: 70px;
    height: 70px;
    text-align: center;
    border: 1px solid #dee2e6!important;
    vertical-align: middle;
    padding: .25rem!important;
    box-sizing: border-box;
}

/*----備註登入---*/
.sign_footer {
    display: block;
    text-align: center;
    padding: 20px 0;
    margin: auto;
    background: #f8f8f8;
    text-align: center;
    vertical-align: bottom;
    position: relative;
    bottom: 0;
    display: flex;
    width: 100%;
}

.login_inner {
    display: inline-block;
    text-align: center;
    padding-top: 0em;
    margin: auto;
}

/*----登入btn---*/
.login_btn{
	    -webkit-appearance: button;
    cursor: pointer;
        display:block;
    margin-bottom: 0;
      font-weight: normal;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
       background-color: #283d58;
	border: none;
    font-size: 15px;
    font-weight: normal;
    line-height: 1.4;
    border-radius: 4px;
    padding: 10px 15px;
	color:#FFF;
	text-decoration:none
}

.login_btn:hover{opacity: 0.8;}

/*--------------------

忘記帳密

---------------*/
.innerArea_notice {
    width: auto;
    display: block;
    border-bottom: 1px dotted #878787;
    font-size: 16px;
    padding: 20px 15px 20px;
    line-height: 24px;
    color: #212121;
    letter-spacing: 1px;
    background-color: #ededed;
    margin-bottom: 1.75em;
}


.remark-box {
    font-weight: bold;
    font-size: 1em;
    color: #1F1F1F;
    line-height: 1.45;
    text-align: left;
    margin-left: auto;
    margin-right: auto;
}

.innerArea ul {
    margin: 14px 0px 0px 28px;
    padding: 0px;
    list-style: none;
    text-align: left;
}
.innerArea ul b {
    color: #000000;
    text-align: right;
    display: inline-block;
	float:left;
	padding-left:10px
}
	.innerArea ul li .checkNo b:before {
 content: "X";
     font-size: 14px;
    /* padding-top: 5px; */
    position: relative;
    color: #FFF;
    background-color: #ff0000;
    width: 30px;
    height: 30px;
    display: block;
    border-radius: 100%;
    right: 5px;
    text-align: center;
}
	.innerArea ul li {
    margin: 10px 0px;
    display: block;
}
.innerArea ul input[type=radio] {
    width: inherit;
    height: inherit;
    top: inherit;
}
.innerArea ul input {
    width: 50%;
    color: #888888;
    border: 1px solid #ddd;
    position: relative;
    font-size: 1em;
    word-break: break-all;
    outline: none;
    border-radius: 3px;
    line-height: 1.5em;
    resize: vertical;
    height: auto;
    padding: .375rem .75rem;
}


.innerArea ul li .checkNo {
    color: #ff0000;
}


.innerArea ul .btnArea {
    display: table !important;
    margin: 20px auto 40px 115px;
}


.innerArea ul .btnArea a {
    display: inline-block;
    width: 160px;
    height: 40px;
    color: #fff;
    text-align: center;
    cursor: pointer;
    border-width: 1px;
    border-style: solid;
    border-color: #fff;
    background-color: #7f7f7f;
    border-radius: 3px;
    font-family: "微軟正黑體" ,sans-serif;
    line-height: 40px;
}

.innerArea ul .btnArea a:hover {
    opacity: 0.7;
    -moz-opacity: 0.7;
    -khtml-opacity: 0.7;
    filter: alpha(opacity=70);
}

/*---預設---*/
.innerArea ul .btnArea .confirm {
    margin-left: 20px;
    background-color: #283d58;
    color: #FFF;
}
/*--------------------

註解

---------------*/
.spe_remark {
    line-height: 1.5;
    color: #ff4d4d;
    padding: 0 5px;
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 1px;
}