html, body {
    /* height: 100%;*/
 }
 body {
     font-size: 16px;
 }
 ul{
     padding: 0;
 }
 li{
     list-style: none;
 }
 
 .btn .spinner-border {
     display: none;
 }
 .btn.disabled, .btn:disabled {
     opacity: .65;
     pointer-events: none;
 }
 .btn.disabled .spinner-border, .btn:disabled .spinner-border {
     display: inline-block;
 }
 
 /*銵典鱓*/
 .form-control.valid {
     border-color: rgba(87,172,172,0.36);
     padding-right: calc(1.5em + .75rem);
     background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%2328a745' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
     background-repeat: no-repeat;
     background-position: center right 8px;
     background-size: calc(.75em + .375rem) calc(.75em + .375rem);
 }
 .form-control.valid~.invalid-tooltip, .form-control.valid~.invalid-feedback {
     display: none!important;
     position: relative;
 }
 .form-control.valid:focus {
 border-color: rgba(87,172,172,0.36);
 box-shadow:0 0 0 .2rem rgba(87,172,172,0.16);
 }
 .form-control.invalid {
     border-color: #e60012;
     padding-right: calc(1.5em + .75rem);
     background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23dc3545' viewBox='-2 -2 7 7'%3e%3cpath stroke='%23dc3545' d='M0 0l3 3m0-3L0 3'/%3e%3ccircle r='.5'/%3e%3ccircle cx='3' r='.5'/%3e%3ccircle cy='3' r='.5'/%3e%3ccircle cx='3' cy='3' r='.5'/%3e%3c/svg%3E");
     background-repeat: no-repeat;
     background-position: center right 8px;
     background-size: calc(.75em + .375rem) calc(.75em + .375rem);
 }
 .form-control.invalid~.invalid-tooltip, .form-control.invalid~.invalid-feedback {
     display: block!important;
     position: relative;
 }
 .form-control.invalid:focus {
 border-color: #e60012;
 box-shadow: 0 0 0 .2rem rgba(230,0,18,.25)
 }
 .form-control {
     line-height: 1.5;
 }
 /*銵典鱓*/
 
 .navbars-box.sub {
     height: 92px;
 }
 .navbars-box-top.sub {
     padding-top: 92px;
 }
 .owl-carousel .owl-wrapper-outer::before{
     content: "";
     width: 100%;
     position: absolute;
     clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
     background-color: whitesmoke;
     z-index: 9999;
     bottom: 0;
     left: 0;
     height: 100px;
 }
 .bg-c2{
     background-color: #3E3A39;
 }
 
 /*�詨鱓����䠷��*/
.top-menu-btn-box>div, .top-menu-btn-box>a {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
    height: 46px;
    background-color: #3E3A39;
    color: #fff;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, opacity .15s ease-in-out;
}
.top-menu-btn-box>div, .top-menu-btn-box>a {
    border-right: 1px solid #595757;
}
.top-menu-btn-box>div:last-child, .top-menu-btn-box>a:last-child {
    border-right: 0px;
}
.top-menu-btn-box>div:hover, .top-menu-btn-box>a:hover {
}
.top-menu-btn-box>div.active , .top-menu-btn-box>a.active {
}
.nav-pills .nav-link {
    border-radius: 0px;
    padding: 0px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
    color: inherit;
    background-color: whitesmoke;
}

 /*銵冽聢*/
 .table.sp_safe.ml--1 {
     margin-left: -1px;
 }
 .table.sp_safe {
     -ms-user-select: none;
     user-select: none;
     white-space: nowrap!important;
     margin-bottom: 0px;
     
     max-width: 800px;
     margin-left: auto;
     margin-right: auto;
     background-color: #fff;
 }
 .table.sp_safe thead {
     color: #fff;
     background-color: rgba(193,19,22,1);
 }
 .table.sp_safe td, .table.sp_safe th {
     padding: 8px 8px;
     vertical-align: middle;
 }
 .table-hover.sp_safe tbody tr {
     transition: color .15s ease-in-out, background-color .15s ease-in-out, opacity .15s ease-in-out;
 }
 .table-hover.sp_safe tbody tr:hover {
     color: inherit;
     background-color: rgba(0,0,0,.05);
 }
 .table.sp_safe.left-1 thead tr>th:first-child, .table.sp_safe.left-1 tr>td:first-child {
     text-align: left;
 }
 /*銵冽聢*/
 
 /*�嗡��*/
 .scrollspy-menu {
     position: relative;
     top: 0;
     left: 0;
     right: 0;
     margin: 0 auto;
     -webkit-transform: translate(0px, 0px);
     transform: translate(0px, 0px);
     will-change: transform;
     z-index: 5;
 }
 .scrollspy-menu.show {
     position: fixed;
     -webkit-transform: translate(0px, 46px);
     transform: translate(0px, 46px);
     z-index: 99999;
 }
 .scroll-body-new {
     height: 0px;
 }
 .scroll-body-new.active {
     height: 46px;
 }
 .share-icon {
     display: block;
     padding: 15px 16px;
     text-align: center;
     color: #fff;
     position: fixed;
     right: 0px;
     bottom: 0px;
     background-color: rgba(193,19,22,1);
     opacity: .6;
     border-radius: 4px;
     z-index: 1001;
     -ms-user-select: none;
     user-select: none;
     cursor: pointer;
     -webkit-transform: translate(-15px, -65px);
     transform: translate(-15px, -65px);
     will-change: transform;
     transition: transform .3s ease-out;
 }
 .share-icon.active {
     -webkit-transform: translate(-15px, -120px);
     transform: translate(-15px, -120px);
 }
 
 /*銝餉�*/
 .franchise_top {
     background-position: center;
   background-size: cover;
     background-image: url(https://www.etwarm.com.tw/images/franchise/franchise_top.jpg);
     transition: all .15s ease-in-out;
 }
 .franchiseBox {
     position: absolute;
     bottom: 0;
     left: 0;
 }
 .franchiseBoxC {
     color: white;
     background-color: rgba(193,19,22,0.9);
     width: 240px;
     transition: all .15s ease-in-out;
 }
 .franchise_top, .franchiseBoxC {
     height: 550px;
 }
 .franchiseBoxC.back {
     width: auto;
     background-color: transparent;
     text-shadow: 0px 0px 3px rgba(0,0,0,0.4);
     padding-top: 140px;
 }
 .franchiseText {
     padding: 0px 48px;
 }
 .franchiseLine {
     border-bottom: 1px solid #fff;
     margin-bottom: 8px;
 }
 .franchiseLogo {
     width: 80px;
     margin-bottom: 16px;
 }
 @media (max-width: 1080px) {
 .franchise_top {
 }
 .franchiseBoxC {
     width: 220px;
 }
 .franchise_top, .franchiseBoxC {
     height: 480px;
 }
 }
 @media (max-width: 920px) {
 .franchise_top, .franchiseBoxC {
 
 }
 }
 @media (max-width: 768px) {
 .franchise_top {
 
     background-image: url(https://www.etwarm.com.tw/images/franchise/20211019/franchise_top_680.jpg);
 }
 .franchiseBoxC {
     width: 150px;
 }
 .franchise_top, .franchiseBoxC {
     height: 340px;
     
 }
 .franchiseBoxC.back {
     padding-top: 60px;
 }
 .franchiseText {
     padding: 0px 32px;
 }
 }
 @media (max-width: 680px) {
 .franchise_top {
 /*	background-position: center;*/
     /* background-position: center -50px; */
 }
 .franchiseBoxC {
     width: 680px;
     height: 150px;
 }
 .franchiseBoxC.back {
     padding-top: 0px;
     padding-bottom: 72px
 }
 .franchiseText {
     padding: 0px 20px;
 }
 }
 @media (max-width: 320px) {
 .franchise_top, .franchiseBoxC {
     height: 376px;
 }
 .franchiseBoxC {
     width: 320px;
     height: 150px;
 }
 }
 
 .consultationBox {
     position: fixed;
     top: 0;
     right: 0;
     bottom: 0;
     margin: auto 0;
     z-index: 5;
     width: 300px;
     height: 160px;
     text-align: center;
 
     -webkit-transform: translate(300px, 0px);
     transform: translate(300px, 0px);
     will-change: transform;
     transition: transform .6s ease-out;
 }
 .consultationBoxC {
     height: 160px;
     background-color: #EFEFEF;
     box-shadow: 0 0 8px rgba(62, 58, 57, 0.253);
 }
 .consultationBox.show {
     -webkit-transform: translate(0px, 0px);
     transform: translate(0px, 0px);
     z-index: 99;	
 }
 .consultationBoxCBox {
     color: #fff;
     line-height: 20px;
     font-size: 15px;
     padding: 8px;
     width: 32px;
     height: 160px;
     background-color: #3E3A39;  
 }

.s-btn-b{
     background-color: #a11216;
 }
 .consultationBox .fa-times {
     display: none;
 }
 .consultationBox.show .fa-plus-circle {
     display: none;
 }
 .consultationBox.show .fa-times {
     display: block;
 }
 .consultationBox.show.hide {
     -webkit-transform: translate(268px, 0px);
     transform: translate(268px, 0px);
 }
 .consultationBox.show.hide .fa-plus-circle {
     display: block!important;
 }
 .consultationBox.show.hide .fa-times {
     display: none!important;
 }
 .consultationBoxCC {
     text-align: left;
     padding: 16px;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-align: center;
     align-items: center;
 }
 .animated5s {
   -webkit-animation-duration: 5s;
   animation-duration: 5s;
   -webkit-animation-fill-mode: both;
   animation-fill-mode: both;
   -webkit-animation-iteration-count: infinite;
   animation-iteration-count: infinite;
 }
 .franchiseColBox {
     margin-top: 64px;
 }
 .franchiseColBox>div{
     margin:  0 auto;
 }
 .franchiseColBox>div:nth-child(odd) {
     padding: 48px 66px 48px 48px;
     text-align: left;
     overflow: hidden;
 }
 .franchiseColBox>div:nth-child(even) {
     padding: 48px 48px 48px 66px;
     text-align: right;
     overflow: hidden;
 }
 .franchiseColBox.ver2>div:nth-child(odd) {
     padding: 48px 24px 48px 48px;
     text-align: left;
     overflow: hidden;
 }
 .franchiseColBox.ver2>div:nth-child(even) {
     padding: 48px 48px 48px 24px;
     text-align: left;
     overflow: hidden;
 }
 .franchiseColBox.ver3>div:nth-child(odd) {
     padding: 48px 48px 48px 48px;
     text-align: left;
     overflow: hidden;
 }
 .franchiseColBox.ver3>div:nth-child(even) {
     padding: 48px 48px 48px 48px;
     text-align: left;
     overflow: hidden;
 }
 @media (max-width: 768px) {
 .franchiseColBox>div:nth-child(odd) {
     padding: 32px 48px 32px 32px;
     text-align: left;
     overflow: hidden;
 }
 .franchiseColBox>div:nth-child(even) {
     padding: 32px 32px 32px 48px;
     text-align: right;
     overflow: hidden;
 }
 }
 @media (max-width: 680px) {
 .franchiseColBox.ver3>div:nth-child(odd) {
     padding: 32px 16px 16px 16px;
 }
 .franchiseColBox.ver3>div:nth-child(even) {
     padding: 32px 16px 16px 16px;
 }
 }
 @media (max-width: 320px) {
 
 }
 .franchiseBgc {
     background-color: #EFEFEF;
 }
 .franchiseColTitleBox {
     position: absolute;
     left: 0;
     top: 32px;
 }
 .franchiseColTitle {
     line-height: 40px;
     font-size: 32px;
     color: white;
     padding: 32px 32px;
 /*	background-color: rgba(193,19,22,0.9);*/
 }
 .radiusBottom16 {
     /* border-radius: 0px 0px 16px 16px; */
 }
 .radius8 {
     border-radius: 8px;
 }
 .radius16 {
     border-radius: 16px;
 }
 .franchiseColBoxEmpty {
     margin-bottom: 160px;
 }
 .franchiseColBoxEmpty2 {
     margin-bottom: 100px;
 }
 .franchiseColBoxEmpty3 {
     margin-bottom: 80px;
 }
 .franchiseImgBox>div {
     margin-bottom: 32px;
 }
 .franchiseImgBox>div:last-child {
     margin-bottom: 0px;
 }
 .franchiseImgBoxTextBox {
     margin: auto;
     position: absolute;
     top: 0;
     bottom: 0;
     
     display: -ms-flexbox;
     display: flex;
     -ms-flex-align: center;
     align-items: center;
     -ms-flex-pack: center;
     justify-content: center;
 }
 .franchiseImgBoxTextBox.left {
     right: -32px;
     padding-left: 64px;
 }
 .franchiseImgBoxTextBox.right {
     left: -32px;
     padding-right: 64px;
 }
 .franchiseImgBoxTextNum {
     position: absolute;
     top: 0;
     background-color: rgba(193,19,22,1);
     color: white;
     font-weight: bold;
     font-size: 20px;
     width: 48px;
     height: 48px;
     
     display: -ms-flexbox;
     display: flex;
     -ms-flex-align: center;
     align-items: center;
     -ms-flex-pack: center;
     justify-content: center;
 }
 .franchiseImgBoxTextNum.left {
     right: 0;
     border-radius: 0px 8px 0px 0px;
 }
 .franchiseImgBoxTextNum.right {
     left: 0;
     border-radius: 8px 0px 0px 0px;
 }
 .franchiseImgBoxText {
     position: relative;
     padding: 32px;
     background-color: rgba(255,255,255,0.93);
     box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
     border-radius: 8px;
     width: 300px;
 }
 .franchiseImgBoxText>div:nth-child(1) {
     font-size: 48px;
     font-weight: bold;
 /*	color: #e60012;*/
 }
 .franchiseImgBoxText>div:nth-child(2) {
     font-size: 20px;
     line-height: 28px;
 }
 .franchiseImgBoxText2 {
     font-size: 28px;
     font-weight: bold;
     margin-bottom: 8px;
 }
 .franchiseImgBoxText3 {
     padding-top: 32px;
     font-size: 32px;
     line-height: 40px;
     font-weight: bold;
     padding-bottom: 16px;
     margin-bottom: 16px;
     border-bottom: 1px dashed #DCDDDD;
 }
 .franchiseImgBoxText4 {
     font-size: 48px;
     font-weight: bold;
 }
 .franchiseImgBoxText5 {
     font-size: 28px;
 /*	font-weight: bold;*/
 }
 @media (max-width: 768px) {
 .franchiseImgBoxText {
     width: 232px;
 }
 .franchiseImgBoxText>div:nth-child(1) {
     font-size: 32px;
     line-height: 40px;
 }
 .franchiseImgBoxText>div:nth-child(2) {
     font-size: 18px;
     line-height: 26px;
 }
 .franchiseImgBoxText {
     padding: 16px;
 }
 }
 @media (max-width: 680px) {
 .franchiseImgBoxTextNum.right {	
     left: auto;
     right: 0;
     border-radius: 0px 8px 0px 0px;
 }
 .franchiseImgBoxTextBox.left {
     right: 0px;
     padding-left: 0px;
     padding: 0 40px;
 }
 .franchiseImgBoxTextBox.right {
     left: 0px;
     padding-right: 0px;
     padding: 0 40px;
 }
 .franchiseColBox {
     margin-top: 64px;
 }
 .franchiseColBox.ver4 {
     margin-bottom: 16px;
 }
 .franchiseColBox>div:nth-child(odd) {
     padding: 0px 24px 24px 24px;
     text-align: left;
 }
 .franchiseColBox>div:nth-child(even) {
     padding: 0px 24px 24px 24px;
     text-align: left;
 }
 .franchiseColBox.ver2>div:nth-child(odd) {
     padding: 0px 32px 32px 32px;
 }
 .franchiseColBox.ver2>div:nth-child(even) {
     padding: 0px 32px 32px 32px;
 }
 .franchiseColBox.ver2>div:nth-child(odd) {
     padding: 0px 24px 24px 24px;
 }
 .franchiseColBox.ver2>div:nth-child(even) {
     padding: 0px 24px 24px 24px;
 }
 .franchiseImgBoxText2 {
     font-size: 20px;
 }
 .franchiseImgBoxText3 {
     font-size: 28px;
 }
 .franchiseColTitleBox {
     top: 16px;
 }
 .franchiseColTitle {
     line-height: 36px;
     font-size: 28px;
     padding: 20px 20px;
 }
 .franchiseColBoxEmpty {
     margin-bottom: 86px;
 }
 .franchiseColBoxEmpty2 {
     margin-bottom: 48px;
 }
 .franchiseColBoxEmpty3 {
     margin-bottom: 16px;
 }
 .franchiseImgBox>div {
     margin-bottom: 24px;
 }
 .franchiseImgBox>div:last-child {
     margin-bottom: 0px;
 }
 .franchiseImgBoxText4 {
     font-size: 32px;
     line-height: 40px;
     font-weight: bold;
 }
 .franchiseImgBoxText5 {
     font-size: 20px;
 /*	font-weight: bold;*/
 }
 }
 
 .franchiseColor {
     color: rgba(193,19,22,1);
 }
 .franchiseCBox {
     margin-top: 16px;
 }
 
 @media (max-width: 680px) {
 .franchiseCBox>div {
     margin-bottom: 28px;
 }
 .franchiseCBox.ver3>div {
     margin-bottom: 8px;
 }
 .franchiseCBox>div:last-child {
     margin-bottom: 0px;
 }
 }
 .franchiseCLogo {
     margin-left: auto;
     margin-right: auto;
     padding: 0px 12px;
 }
 .franchiseCLogo img {
     height: 56px;
 }
 .franchiseCAdImg {
     max-width: 332px;
     padding: 8px;
 }
 .franchiseCAdImg img, .franchiseImgShadow {
     box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
 }
 
 .franchiseCLogoBox {
     position: relative;
     margin: 12px 12px 28px 12px;
     color: white;
     text-align: center;
     font-size: 24px;
     line-height: 32px;
     font-weight: bold;
     padding: 8px;
     border-radius: 8px;
     z-index: 1;
     
     height: 84px;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-align: center;
     align-items: center;
     -ms-flex-pack: center;
     justify-content: center;
 }
 .franchiseCLogoBox.color1 {
     background-color: #ed7920;
 }
 .franchiseCLogoBox.color2 {
     background-color: #2c2969;
 }
 .franchiseCLogoBox.color3 {
     background-color: #6001d2;
 }
 .franchiseCIcon {
     position: absolute;
     left: 0;
     right: 0;
     bottom: -24px;
     font-size: 48px;
     z-index: -1;
     
     color: #3E3A39;
 }
 .franchiseCIcon.color1 {
     color: #ed7920;
 }
 .franchiseCIcon.color2 {
     color: #2c2969;
 }
 .franchiseCIcon.color3 {
     color: #6001d2;
 }
 .franchiseCText {
     display: inline-block;
     padding: 8px 12px;
     margin: 0px 12px 0px 12px;
     text-align: center;
     font-size: 24px;
     font-weight: bold;
     border: 2px solid #595757;
     border-radius: 8px;
 }
 .franchiseRound>div {
     margin: 8px;
     width: 128px;
     height: 128px;
     background: rgb(251,190,52);
     background: linear-gradient(225deg, rgba(251,190,52,1) 0%, rgba(213,0,0,1) 100%);
     border-radius: 50%;
     color: white;
     
     display: -ms-flexbox;
     display: flex;
     -ms-flex-align: center;
     align-items: center;
     -ms-flex-pack: center;
     justify-content: center;
     
     text-align: center;
 }
 .franchiseRound>div>div>div {
     line-height: 24px;
 }
 .franchiseRound>div>div>div:nth-child(1) {
     font-weight: bold;
     font-size: 22px;
     line-height: 30px;
 }
 .nineText {
     font-size: 28px;
 }
 @media (max-width: 768px) {
 .nineText {
     font-size: 20px;
 }
 }
 .franchiseBox1 {
     position: relative;
     padding: 8px 16px;
     margin: 0px 16px 32px 16px;
     color: white;
     text-align: center;
     font-size: 24px;
     font-weight: bold;
     border-radius: 8px;
     z-index: 1;
     
     height: 84px;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-align: center;
     align-items: center;
     -ms-flex-pack: center;
     justify-content: center;
     
     background-color: #3E3A39;
 }
 .franchiseBox1.color4 {
     background-color: rgba(193,19,22,1);
 }
 .franchiseBox1.color5 {
     background-color: #ed7920;
 }
 .franchiseCIcon.color4 {
     color: rgba(193,19,22,1);
 }
 .franchiseCIcon.color5 {
     color: #ed7920;
 }
 @media (max-width: 768px) {
 .franchiseBox1 {
     font-size: 20px;
 }
 }
 .witnessBox {
     padding-top: 32px;
     line-height: 26px;
 }
 .witnessBox>div {
     padding: 0 32px;	
     -ms-flex: 0 0 33.333333%;
     flex: 0 0 33.333333%;
     max-width: 33.333333%;	
     margin-bottom: 32px;
 }
 .witnessBox>div:nth-last-child(1), .witnessBox>div:nth-last-child(2) {	
     margin-bottom: 0px;
 }
 .witnessPhoto {
     text-align: center;
     padding: 8px;
     background-color: #EFEFEF;
     box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
 }
 .witnessText1 {
     margin-top: 16px;
     font-size: 24px;
     font-weight: bold;
 }
 .witnessText2 {
     margin-top: 8px;
     font-size: 18px;
 }
 .witnessBoxC {
     display: none;
 }
 .witnessTextBox {
     position: relative;
     overflow: hidden;
 /*	text-align: justify;*/
 }
 .witnessTextBox.hide {
     height: 120px;
 }
 .witnessTextBoxMask {
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
     margin: auto;
     background: rgb(255,255,255);
     background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 40%);	
 }
 @media (max-width: 980px) {
 .witnessBox>div {
     -ms-flex: 0 0 50%;
     flex: 0 0 50%;
     max-width: 50%;
 }
 }
 @media (max-width: 680px) {
 .witnessBox>div {
     padding: 0 24px;
     -ms-flex: 0 0 100%;
     flex: 0 0 100%;
     max-width: 100%;
     margin-bottom: 24px;
 }
 .witnessBox>div:nth-last-child(2) {	
     margin-bottom: 24px;
 }
 .witnessBox>div:nth-last-child(1) {	
     margin-bottom: 8px;
 }
 .witnessBox {
     padding-top: 36px;
 }
 .witnessTextBox {
     padding-right: 16px;
 }
 }
 .franchiseVideoBox {
     margin-top: 32px;
     margin-bottom: 32px;
 }
 @media (max-width: 680px) {
 .franchiseVideoBox {
     margin-top: 16px;
     margin-bottom: 16px;
 }
 }
 /*�坔�贝��⏛�膄*/
 /* .franchiseTableRow>div:nth-child(1) {
     -ms-flex: 0 0 58.333333%;
     flex: 0 0 58.333333%;
     max-width: 58.333333%;
     padding-right: 32px;
 }
 .franchiseTableRow>div:nth-child(2) {
     -ms-flex: 0 0 41.666667%;
     flex: 0 0 41.666667%;
     max-width: 41.666667%;
 } */
 .franchiseTable {
     padding: 32px;
     background-color: #f9e7e7;
 }
 .franchiseTableText1 {
 /*	font-weight: bold;*/
     font-size: 20px;
     line-height: 28px;
 }
 .franchiseTableText2 {
     font-weight: bold;
     font-size: 32px;
     line-height: 40px;
 }
 .franchiseTableForm {
     margin-top: 16px;
 }
 .franchiseTableForm .form-control {
     height: 40px;
 }
 .franchiseTableRow2 {
     font-size: 18px;
 }
 .franchiseTableRow2>div {
     margin-bottom: 16px;
 }
 .franchiseTableRow2 .pl {
     padding: 0 0 0 8px;
 }
 .franchiseTableRow2 .pr {
     padding: 0 8px 0 0;
 }
 .franchiseTableBtnBox {
     margin: 16px 0px 0px 0px;
 }
 .franchiseTableBtn {
     height: 40px;
 }
 @media (max-width: 940px) {
 /* .franchiseTableRow>div:nth-child(1) {
     -ms-flex: 0 0 100%;
     flex: 0 0 100%;
     max-width: 100%;
     padding-right: 0px;
 }
 .franchiseTableRow>div:nth-child(2) {
     display: none;
 } */
 }
 @media (max-width: 680px) {
 .franchiseTable {
     padding: 16px;
 }
 .franchiseTableText1 {
     font-size: 16px;
     line-height: 24px;
 }
 .franchiseTableText2 {
     font-size: 24px;
     line-height: 32px;
 }
 .franchiseTableRow2 .pl {
     padding: 0 0 0 0px;
 }
 .franchiseTableRow2 .pr {
     padding: 0 0px 0 0;
 }
 .franchiseTableBtnBox {
     margin: 8px 0px 0px 0px;
 }
 }
 
 .search-box-div {
     text-align: left;
     position: absolute;
     top: 38px;
     left: 0;
     z-index: 1;
     width: 560px;
     box-shadow: 2px 2px 2px rgba(0, 0, 0, .1);
 }
 .search-box-div.search-city .search-body.franchise .s-btn {
     margin: 0px;
 }
 .search-box-div .search-body.franchise .s-btn {
     padding: 8px 8px;
 }
 .search-box-div .search-body-title {
     padding: 2px 10px;
 }
 @media (max-width: 680px) {
 .nav.search-body.franchise {
     overflow-y: auto;
     height: auto;
     max-height: 220px;
 }
 .search-box-div {
     left: auto;
     right: 0;
     width: 100%;
 }
 .search-box-div .search-box {
     border: #EFEFEF 1px solid;
 }
 .search-box-div.search-city .search-body.franchise .s-btn {
     margin: 2px 2px;
 }
 .search-box-div.search-city .nav.search-body.franchise {
     display: block!important;
     overflow-y: auto;
     height: auto;
     max-height: 208px;
 }
 }
 /* �� IE10+ CSS 憸冽聢璅��� */
 @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
 .search-box-div.search-city .search-body.franchise .s-btn {
     margin: 2px 0px;
 }
 }
 @media (max-width: 360px) {
 
 }
 @media (max-width: 320px) {
 
 }
 
 /*push-modal-box*/
 .push-modal-box {
     position: fixed;
     right: 0;
     bottom: 0;
     z-index: 0;
     pointer-events: none;
     opacity: 0;
 
     transform: translate(0px, 40px);
     will-change: transform;
     transition: all .3s ease-out;
 
     display: flex;
     align-items: center;
     justify-content: center;
     width: 100%;
     height: 100%;		
 }
 .push-modal-box.show {
     opacity: 1;
     transform: translate(0px, 0px);
 }
 .push-modal-box.show .push-modal-imgBox {
     pointer-events: auto;
 }
 .push-modal-imgBox {
     position: relative;
     max-width: 600px;
     height: auto;
     border-radius: 16px;
     background-color: #90bbc2;
     box-shadow: 0px 1px 6px 1px rgba(0, 0, 0, .2);
 }
 .push-modal-imgBox>img {
     border-radius: 8px;
     width: 100%;
     height: auto;	
 }
 .push-modal-imgBox .button-box {
     position: absolute;
     left: 0;
     right: 0;
     bottom: 28px;
     margin: auto;
     text-align: center;
     font-size: 20px;
 }
 .push-modal-close {
     position: absolute;
     top: -13px;
     right: -13px;
     padding: 2px;
     border-radius: 50%;
     font-size: 32px;
     color: #3E3A39;
     background-color: white;
     width: 36px;
     height: 36px;
     cursor: pointer;
     box-shadow: 0px 1px 6px 1px rgb(0 0 0 / 20%);
 }
 @media (max-width: 680px) {
 .push-modal-imgBox {
     max-width: 300px;
 }
 .push-modal-imgBox>img {
 }
 .push-modal-imgBox .button-box {
     bottom: 6px;
 }
 }
 @media (max-width: 320px) {
 
 }
 /*push-modal-box*/
 

 body{
    color:#595757; 
}
p{
    line-height: 1.4;
}
.font_red{
    color: #E50012;
    font-weight: bold;
}
.font_border{
    border-bottom: 1px solid #E50012;
    font-weight: normal;
}
main{
    background-color: #EFEFEF;
}
main>section{
    padding: 60px 0 60px 0;
    line-height: 1.2;
}
.main-top-pic{
    background-color: #BD1B21;
    background-image: url(/images/business2021/bg.jpg);
    background-position: center;
    background-size: cover;
    min-height: 340px;
    object-position: center;
    padding: 0;
    overflow: hidden;
}

.main-top-pic div img{
    display: block;
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
    height: auto;
    object-fit: contain;
    object-position: center;
    /* width: 90%;
    margin-top: 10px; */
}
.bg-w{
    background-color: #fff;
}
.bg-g>div{
    position: relative;
}
.main-top-pic div img:nth-of-type(2){
    display: none;
}
@media (max-width: 680px) {
    .main-top-pic div img:nth-of-type(1){
        display: none;
    }
    .main-top-pic div img:nth-of-type(2){
        display: block;
    }
    .main-top-pic .container{
        padding: 0;
    }
}
/* .bg-c{
    background-image: url(/images/franchise/20211019/bg-color.jpg);
    background-position: center;
    background-size: cover;
} */

.bg-g{
   background-color: #E5E5E5;
   position: relative;
   height: auto;
}
main>section:nth-of-type(10){
    background-image: url(/images/franchise/20211019/bg-ribbons.png);
    background-size: cover;
}

.bg-g2{
    background-color: #d6d6d6;
}

.tilte {
    margin: 0 auto;
}
.tilte h2{
    display: block;
    width: 100%;
    max-width: 360px;
    margin: 0 auto;
    font-size: 1.5rem;
    font-weight: 600;
    letter-spacing: 0.5rem;
    text-align: center;
    position: relative;
    margin-bottom: 2rem;
    color: #898989;
}
.tilte img{
    width: 30px;
    height: 30x;
    display: block;
    padding-right: 0.5rem;
    margin: 0 auto;
    margin-bottom: 1rem;
    object-position: center;
    object-fit: contain;
}

.content-1{
    box-sizing: border-box;
}
.content-1 .text-center{
    text-align: center;
}
.content-1 .text-center div{
    display: flex;
    margin:0 auto;
    justify-content: center;
    align-items: flex-end;
}
.content-1 .text-center img{
    width: 74px;
    height: 160px;
    object-fit: cover;
    object-position: center;
}
.content-1 .text-center div b {
    color: #E50012;
    font-size: 50px;
    font-weight: 900;
    position: relative;
}
.content-1 .text-center div b::after{
    content: "";
    position: absolute;
    width: 1rem;
    height: 1rem;
    background-image: url(/images/franchise/20211019/s-circle.png);
    background-size: cover;
    background-position: center;
    bottom: 0;
}

.content-1 .text-center div span{
    font-size: 24px;
    font-weight: 600;
    list-style: none;
    margin: 2rem  auto;
}

.icons{
    width: 95%;
    margin: 0 auto;
    margin-top: 30px;
}
.icons ul{
    display: flex;
    justify-content: space-around;
    text-align: center;
    flex-wrap: wrap;
}

.icons ul li>div:nth-of-type(1){
    width: 30px;
    height: 30px;
    display: flex;
    justify-items: center;
    align-items: center;
    margin: 0 auto;
}
.icons li div img{
    width: 100%;
    height: 100%;
    margin: 0 auto;
    object-fit: contain;
    object-position: center;
}

.icons li b{
    display: inline-block;
    margin:8px auto;
    margin-top: 2rem;
    background-color: #E50012;
    font-size: 22px;
    padding: 2px 16px;
    color: #fff;
    font-weight: 600;
}
.icons li span{
    line-height: 1.5;
    font-weight: 600;
    font-size: 18px;
    letter-spacing: 2px;
}
.icons li a{
    display: block;
    font-size: 14px;
    margin-top: 1rem;
    padding: 4px;
    position: relative;
}
.icons li a::after{
    content: "";
    position: absolute;
    right: calc(50% - 3rem);
    width: 12px;
    height: 12px;
    background-image: url(/images/franchise/20211019/svg/right.svg);
}
.icons li a:hover{
    color: #E50012;
}
.textbox{
    width: 80%;
    max-width: 560px;
    display: flex;
    margin: 0 auto;
    align-items: flex-end;
}
.textbox b{
    font-weight: 600;
}
.textbox div img{
    width: 81px;
    height: 150px;
    object-position: center;
    object-fit: cover;
}
.textbox div:nth-of-type(2){
    margin-left: 0.5rem;
}
.textbox div b{
    color: #E50012;
    font-size: 50px;
    font-weight: 900;
    position: relative;
    padding-top: 1rem;
}
.textbox div b span{
    font-size: 40px;
}
.textbox div p{
    line-height: 1.3;
    margin-top: 10px;
}
.textbox div b::after{
    content: "";
    position: absolute;
    width: 12px;
    height: 12px;
    background-image: url(/images/franchise/20211019/svg/s-circle.svg);
    background-size: cover;
    background-position: center;
    bottom: 10px;
}
.textbox div>span{
    width: 100%;
    display: block;
    font-size: 24px;
    line-height: 1.4;
    font-weight: 600;
}
.textbox div:nth-of-type(2) span strong{
    font-size: 2rem;
}
.content-2{
    display: flex;
    align-items: center;
    width: 90%;
    max-width: 800px;
    margin: 0 auto;    
    flex-wrap: wrap;
    justify-content: center;

}
.content-2 .img-right img{
    width: 100%;
    height: auto;
    margin-top: 1rem;
}
.content-2 .textbox div img{
    width: auto;
}
.content-2>p{
    width: 90%;
    max-width: 600px;
    margin: 0 auto;
    margin-top: 2rem;
}
.content-3 .textbox{
    max-width: 360px;
    align-items: flex-end;
    margin-bottom: 40px;
}

.content-3 .textbox div>span{
    border-bottom: 0;
}
.content-3 div ul {
    display: grid;
    width:100%;
    max-width: 600px;
    margin: 0 auto;
    grid-template-columns: 33.33% 33.33% 33.33%;
}
.content-3 div ul li{
    text-align: center;
    margin: 20px 0;
    width: 90%;
}
.content-3 div ul li b{
    background-color: crimson;
    padding: 4px 1.5rem;
    color: #fff;
    font-weight: 600;
}
.content-3 div ul li p{
    padding: 10px 0;
}
.content-3 div ul li strong{
    font-size: 1.3rem;
}
.content-4{
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 800px;
    width: 95%;
    flex-wrap: wrap;
    margin: 0 auto;
    
}
.content-4 .textbox{
    display: grid;
    grid-template-columns: auto auto;
}
.content-4 .textbox>div:nth-of-type(1) div:nth-of-type(1) img{
    width: 100%;
    max-width: 220px;
    height: auto;

}
.content-4 .textbox>div:nth-of-type(1) div:nth-of-type(2) img{
    width: 100%;
    max-width: 360px;
    height: auto;
}
.content-4 p{
    margin: 1rem auto;
    max-width: 600px;
}

.content-4>div:nth-of-type(2){
    width: 90%;
    margin: 2rem auto;
    height: auto;
    max-width: 500px;

}
.content-4 div img{
    width: 100%;
    height: auto;
}

.content-5 .textbox{
    align-items: flex-end;
    justify-content: center;

}


.content-5 .textbox img{
    width: auto;
}
.content-5 ul{
    box-sizing: border-box;
}
.content-5 ul:nth-of-type(1){
   display: grid;
   grid-template-columns:50% 50%;
   width: 100%;
   box-sizing: border-box;

}
.content-5 ul:nth-of-type(2){
   display: grid;
   grid-template-columns: 33.33% 33.33% 33.33%;
   width: 100%;
   box-sizing: border-box;

}

.content-5 li .textbox{
    width: 100%;
    box-sizing: border-box;
    position: relative;
    align-items: flex-end;
    justify-content: flex-start;
    margin-bottom: 1rem;
}
.content-5 li {
   box-sizing: border-box;
   background-color: #F2F2F2;
   box-shadow: 0 7px 12px #0f0f0f4b;
   padding: 1rem;
   padding-top: 3.5rem;
   margin: 1.5rem;
   position: relative;
}

.content-5 li::before{
   content: "超級房仲家";
   position: absolute;
   width: auto;
   background-color: #4D4D4D;
   color: #fff;
   font-weight: 600;
   padding: 2px 0.5rem;
   display: block;
   text-align: center;
   font-size: 1.3rem;
   top: 1rem;
   left: -1rem;
   z-index: 9;
} 

.content-5 li:nth-child(2):before{
   content: "東森房屋官網";
}
.content-5 ul:nth-of-type(2) li:nth-child(1)::before{
   content: "e指通APP";
}
.content-5 ul:nth-of-type(2) li:nth-child(2)::before{
   content: "行動APP";
}
.content-5 ul:nth-of-type(2) li:nth-child(3)::before{
   content: "LINE東屋小秘書";
}
.content-5 ul li .picbox{
   width: 100%;
   height: 200px;
}

.content-5 li div img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
}

.content-5 li>div:nth-of-type(2){
    background-color: #fff;
    padding: 1rem;
    position: relative;
    margin-top: 1rem;
}



.content-5 li .textbox div:nth-of-type(1) img{
   height: 70px;
   width: auto;
   object-position: center;
   object-fit: contain;
}

.content-5 li .textbox div b{
    display: block;
    color: red;
    font-size: 28px;
    font-weight: 600;
}
.content-5 li .textbox div b::after{
    width: 8px;
    height: 8px;
    bottom: 2px;
}
.content-5 li .textbox div span{
    font-size: 18px;
    border: 0;
    font-weight: 600;
}

.content-6 .textbox{
    margin: 0;
    align-items: flex-end;
    width: 100%;
    margin: 0 auto;
    padding: 4px 12px;
}
.content-6 .textbox div:nth-of-type(1){
    display: flex;
    justify-content: flex-end;
}
.content-6 .textbox div img {
    height: 100px;
    width: auto;
}
.content-6 .textbox b::after{
    width: 10px;
    height: 10px;
    bottom: 5px;
}

.content-6 .textbox b{
    /* font-size: 30px; */
    font-weight: 600;
}
.content-6 .textbox span{
    /* font-size: 22px; */
    font-weight: 600;
    display: block;
    border: 0;
}
.content-6 .textbox img,
.content-6-2 .textbox img
{
    object-fit: contain;
    object-position: contain;
}
.content-6 p,
.content-6-2 p
{
    padding: 5px 12px ;
    line-height: 1.3;
    max-width: 600px;
    margin: 0 auto;
    font-size: 18px;
}
.content-6 ul{
    display: flex;
    margin-top: 80px;
 }
 .content-6 li,
 .content-8 li
 {
     width: 25%;
     height: auto;
     margin: 4px;
     overflow: hidden;
 }
 .content-6 li img,
 .content-8 li img
 {
     width: 100%;
     height: auto;
     object-fit: cover;
     object-position: center;
     transition: all 0.3s;
 }
 .content-6 li img:hover,
 .content-8 li img:hover
 {
     transform: scale(1.3);
     transition: all 0.3s;
 }
 .content-6>div>img,
 .content-6-2>div>img
 {
    margin: 2% auto;
    display: block;
    width: 80%;
    max-width: 650px;
 }

.content-7 .tilte h2{
    margin-bottom: 0;
}
.content-7 .textbox{
   max-width: 500px;
   align-items: flex-end;
   margin: 0 auto;
   text-shadow:  0 0px 15px rgba(255, 255, 255, 0.8);
}
.content-7 .textbox div img{
   object-fit:contain;
   height: 160px;
}
.content-7 p {
   max-width: 600px;
   width: 90%;
   margin: 2% auto;
   font-size: 18px;
}
.content-7 ul {
    display: grid;
    grid-template-columns: 33.33% 33.33% 33.33%;
    width: 96%;
    max-width: 600px;
    margin: 0 auto;
    margin-top: 80px;
    box-sizing: border-box;    
}
.content-7 li div{
    margin: 0 auto;
    background-color:  #E50012;
    text-align: center;
    color: #fff;
    font-weight: 600;
    padding: 0.5rem;
    width: 110px;
    box-shadow: 0 8px 8px rgba(62, 58, 57, 0.3);
    border-radius: 10px;
    border: 1px solid #fff;
   outline: 3px solid #E50012;
   
}
.content-7 li div b{
    font-size: 2rem;
    text-shadow: 0 4px 8px #3e3a397a;
}
.content-7 li div p{
    padding-top: 0.5rem;
    border-top:1px solid #fff;
    font-size: 1rem;
}
.content-8 div:nth-of-type(1){
    display: flex;
    align-items: flex-end;
}
.content-8 .textbox{
    margin: 0 auto;
}

.content-8 .textbox img{
    width: 100%;
    max-width: 320px;
    height: auto;
 }
 .content-8 .textbox div:nth-of-type(2){
    width: 100%;
    max-width: 600px;
    margin-left: 1rem;
 }
 .content-8 ul{
     display: flex;
     margin: 8% auto;
     justify-content: space-around;
 }
 .content-8 li{
     margin: 1rem;
 }
 .content-8  img{
     width: 100%;
     height: auto;
     object-fit: contain;
     object-position: center;
 }
 .content-8>p{
     width: 90%;
     max-width: 600px;
     margin: 0 auto;
     margin-top: 2rem;
 }

.content-9 ul {
    display: grid;
    grid-template-columns: 50% 50%;
}

.content-9 .card-out{
    width: 100%;
    max-width: 460px;
    height: 260px;
    margin: 1rem auto;
    perspective: 1000px;
}
.content-9 .card{
    position: relative;
    width: 100%;
    height: 100%;
    border: 0;
    background-color: transparent;
    cursor: pointer;
}
.content-9 ul span{
    position: absolute;
    bottom: 1rem;
    right: 0.5rem;

}
.content-9 ul span::after{
    content: "";
    clip-path: polygon(0 100%, 100% 100%, 100% 0);
    position: absolute;
    width: 60px;
    height: 60px;
    background-color: #EDDA80;
    bottom: -1rem;
    right: -0.5rem;
    z-index: -1;
}
.content-9 .front,
.content-9 .back{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -o-backface-visibility: hidden;
    backface-visibility: hidden;
    background-color: #fff;
    box-shadow: 0 4px 8px #00000040;
}
.content-9 .front{
    transform: rotateY(0deg);
    transition: all 1s;
}
.content-9 .back{
    transform: rotateY(180deg);
    transition: all 1s;
}
.content-9 .flipped .front{
    transform: rotateY(180deg);

}
.content-9 .flipped .back{
    transform: rotateY(0deg);
}
.content-9 .front{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;

}

.content-9 .front .figure{
    width: 35%;
    height: 100%;

}

.content-9 .front .figure img{
    width: 100%;
    height: 100%;
    object-position: top;
    object-fit: cover;
}
.content-9 .front div:nth-of-type(2){
    width: 65%;
    align-items: center;
    padding-left: 0.5rem;
}
.content-9 h3{
    display: inline-block;
    font-size: 1.4rem;
    font-weight: 600;
    margin-bottom: 1rem;

}
.content-9 b{
    background-color: #EDDA80;
    display: inline-block;
    font-size: 1.1rem;
    padding: 2px 4px;

}
.content-9 p{
    font-size: 1rem;
    line-height: 1.3;
}
.content-9 .back{
    padding: 1rem;
}
.content-9 .back h3{
    margin-bottom: 4px;
}
@media (max-width: 1080px){

}

@media (max-width: 920px){
   
}
@media (max-width: 768px){

   .content-1 .text-center img{
       width: 55px;
       height: 120px;
   }
   .content-1 .text-center div b {
       font-size: 30px;
   }
   .content-1 .text-center div b::after{
       content: "";
       width: 8px;
       height: 8px;
       bottom: 8px;
   }
   .content-1 .text-center div span{
       font-size: 20px;
       margin: 1rem  auto;
   }
   
   .icons{
       width: 90%;
       margin: 0 auto;
       margin-top: 30px;
   }
   .icons ul li{
       margin-bottom: 1rem;
   }

   .icons li span{
       line-height: 1.3;
       font-size: 14px;
   }


   .content-2 .textbox{
       flex-wrap: wrap;
       justify-content: center;  
   }
   .content-2 .textbox span{
       font-size: 1.1rem;
   }
   .content-3 .textbox{
       margin: 0 auto;
       justify-content: center;
       margin-bottom: 30px;   
   }
   .content-3 .textbox div>span{
       font-size: 1.1rem;
   }

   .content-3 div ul {
       width: 90%;
   }
   .content-3 div ul li{
       margin: 0 auto;
       width: 98%;
   }
   .content-3 div ul li b{
       padding: 4px 1rem;
       font-size: 1rem;
   }
   .content-3 div ul li p{
       padding: 10px 0;
       font-size: 0.9rem;
   }
   .content-4 div:nth-of-type(1){
       margin: 0 auto;
   }

   .content-5 ul {
       display: grid;
       grid-template-columns: 100%;
   }
 
   .content-5 li {
      box-shadow: 0 7px 12px #0f0f0f23;
   }

   .content-5 ul li .picbox{
      padding: 0.5rem;
   }
   .content-5 li .textbox{
       flex-wrap: wrap;
       margin-bottom: 1rem;
   }
   .content-5 .textbox div:nth-of-type(1){
       margin-right: 0.5rem;
   }
   .content-5 .textbox div:nth-of-type(2){
       margin: 0;
   }
   .content-5 ul:nth-of-type(1) li:nth-of-type(1) .textbox div:nth-of-type(1) img{
    height: 55px;
    }

   .content-5 li .textbox div:nth-of-type(1) img{
      height: 60px;
   }
   
   .content-5 li .textbox div b{
       font-size: 1.4rem;
   }

   .content-5 li .textbox div b::after{
       width: 8px;
       height: 8px;
       bottom: 4px;
   }
   .content-5 li .textbox div span{
       font-size: 1.1rem;
       border: 0;
       font-weight: 600;
   }
   .content-6{
       width: 90%;
       margin: 0 auto;
   }

   main>section:nth-of-type(7) .textbox{
       flex-wrap: wrap;
   }
 
   .content-6 ul{
        margin-top: 60px;
    }
    .content-6 li{
        padding: 4px;
    }
    .content-6 li{
        padding: 4px;
        display: none;
    }
    .content-6 li:nth-of-type(2){
        display: block;
        margin: 1% auto;
        width: 90%;
    }
    
    
   .content-7 ul {
        width: 98%; 
        grid-template-columns: auto;
        margin-top: 40px;
    }
    .content-7 li div{
        padding: 1rem;
        width: 70%;
        margin: 1rem auto;
    }
    .content-7 li div b{
        font-size: 1.8rem;
    }
    .content-7 li div p{
        font-size: 1rem;
    }
    .content-7 .textbox div img{
        height: 100px;
    }
    .content-6 li{

        display: none;
    }
    .content-8 ul {
        overflow: hidden;
        width: 90%;
    }
    .content-8 .textbox{
        flex-wrap: wrap;
    }
    .content-8 ul li {
        display: none;
    }
    .content-8 ul  li:nth-of-type(3) {
        display: block;
        width: 95%;
        margin: 0 auto;
    }
    .content-9{
        width: 90%;
        margin: 0 auto;
    }
    .content-9 .front .figure{
        width: 100%;
        height: 70%;
    }
    .content-9 .front div:nth-of-type(2){
        width: 100%;
        height: 30%;
    }
    .content-9 ul {
        display: grid;
        grid-template-columns: auto;
    }
    .content-9 .card-out{
        height: 450px;
        width: 60%;
    }
    .content-9 h3{
        font-size: 1.3rem;    
    }
    .content-9 b{
        font-size: 1rem;
        padding: 2px;
    
    }
    .content-9 p{
        font-size: 0.9rem;
    }

    .textbox-grid{
        display: grid !important;
        grid-template-columns: auto auto;
    }
    .content-6 .textbox div:nth-of-type(1) {
        display: flex;
        justify-content: flex-end;
    }
    .content-6 .textbox div img{
        height: 80px;
    }
    
    .content-8 .textbox img{
        margin: 0;
        width: 100% !important;
        height: auto;
        object-fit: contain;
        object-position: center;
    }
    

}
@media (max-width: 680px){
    .franchiseImgBoxText4{
        font-size: 1.7rem;
    }
    .franchiseImgBoxText5{
        font-size: 1.2rem;
    }

    .content-3 div ul {
        transform: scale(0.9);
    }
    .content-3 div ul li b{
       font-size: 0.9rem;
    }
    .textbox div b{
        font-size: 1.8rem;
    }
    .textbox div>span{
        font-size: 1.4rem;
    }


    .content-2{
        flex-wrap: wrap;
        justify-content: center;
    }
    .content-2 .textbox span{
        font-size: 1rem;
    }
    

    .content-5 ul:nth-of-type(1),
    .content-5 ul:nth-of-type(2){
       grid-template-columns:auto;
       width: 90%;
       margin: 5% auto;
   }
   .content-5>.textbox div span{
       line-height: 0.5;
   }
   .content-6 .textbox div img{
       height: 60px;
   }
    .content-9 ul {
        display: grid;
        grid-template-columns: 100%;
    }
    .content-9 .front .figure{
        width: 100%;
        height: 60%;
    }
    .content-9 .front div:nth-of-type(2){
        width: 100%;
        height: 40%;
    }


}
@media (max-width: 550px){
    .textbox {
        width: 90%;
    }
    .textbox div img{
        width: 56px;
        height: 100px;
    }
 
    .textbox div b{
        font-size: 1.3rem;
        padding-top: 0.5rem;
    }
    .textbox div span{
        font-size: 1.1rem;
    }
    .textbox div p{
        line-height: 1.2;
        margin-top: 10px;
    }
    .textbox div b::after{
        width: 8px;
        height: 8px;
        bottom: 10px;
    }
    .content-9 .card-out{
        height: 360px;
        width: 85%;
    }
    .content-9 .front .figure{
        width: 100%;
        height: 65%;
    }
    .content-9 .front div:nth-of-type(2){
        width: 100%;
        height: 35%;
    }
    .content-9 b{
        font-size: 0.95rem;
        padding: 2px;
    
    }
    .content-9 p{
        font-size: 0.85rem;
    }

 
}
@media (max-width: 360px){
    .content-5 ul:nth-of-type(1) li:nth-of-type(1) .textbox div:nth-of-type(1) img{
        height: 36px;
    }

    .content-5 li .textbox div:nth-of-type(1) img{
        height: 55px;
    }

    .content-9 .card-out{
        width: 90%;
    }


}
@media (max-width: 321px){
    .content-5 ul:nth-of-type(1) li:nth-of-type(1) .textbox div:nth-of-type(1) img{
        height: 32px;
    }
    .content-5 li .textbox div:nth-of-type(1) img{
        height: 40px;
    }
    .content-6 .textbox div img{
        height: 38px;
    }
}