@charset "utf-8";
/* MOBILE-HEADER */
/* Mobile-Header-1001 */
/* #mobile-header-1001{ display: none; position: absolute; left: 0; top: 0; width: 100%; height: 40px; z-index: 10; background: #ffffff; box-shadow: 0 2px 2px 0px rgba(0,0,0,0.2);}
#mobile-header-1001 .logo{ width: auto; height: 30px; padding: 5px; text-align: center;}
#mobile-header-1001 .logo img{ height: 30px;}
@media screen and (max-width: 1240px) {
    #mobile-header-1001{ display: block;}
} */

/* Mobile-Header-1001 */
#mobile-header-1001{ display: none; position: absolute; left: 0; top: 0; width: 100%; height: 40px; z-index: 10; background: #ffffff; border-bottom: 1px solid #f5f5f5; box-shadow: 0 0 2px 0px rgba(0,0,0,0.2);}
#mobile-header-1001 .col1{ width: 120px;}
#mobile-header-1001 .col2{ width: calc(100% - 120px);}
#mobile-header-1001 .logo{ width: auto; height: 40px; padding: 5px 0; text-align: left;}
#mobile-header-1001 .logo img{ height: 30px;}
#mobile-header-1001 .tel{ width: auto; height: 40px; text-align: right;}
#mobile-header-1001 .tel a{ width: auto; line-height: 40px; color: #0b1531; font-size: 15px;}
#mobile-header-1001 .tel i{ color: #163d8a; margin-right: 10px;}
@media screen and (max-width: 1240px) {
    #mobile-header-1001{ display: block;}
}

/* MOBILE-BANNER */
/* Mobile-Banner-1001 */
#mobile-banner-1001{ display: none; width: 100%; height: auto; background: none;}
#mobile-banner-1001 #mobilebanner1001{ width: 100%; height: auto;}
#mobile-banner-1001 #mobilebanner1001 .swiper-slide img{ width: 100%;}
#mobile-banner-1001 #mobilebanner1001 .swiper-pagination-bullet{ width: 8px; height: 8px; background: #ffffff; opacity: 1;}
#mobile-banner-1001 #mobilebanner1001 .swiper-pagination-bullet-active{ width: 20px; height: 8px; border-radius: 4px; background: #ffffff;}
@media screen and (max-width: 1240px) {
    #mobile-banner-1001{ display: block;}
}

/* MOBILE-MENU */
/* Mobile-Menu-1001 */
/* #mobile-menu-1001{ display: none; width: 100%; height: auto; background: #ffffff; padding: 20px 0 0 0; border-bottom: 1px solid #f5f5f5;}
#mobile-menu-1001 .col{ width: 20%;}
#mobile-menu-1001 dl{ width: 100%; height: auto; margin-bottom: 20px;}
#mobile-menu-1001 dl dt{ width: 40px; height: 40px; margin: 0 auto; margin-bottom: 5px;}
#mobile-menu-1001 dl dt a{ display: block; width: 40px; height: 40px; border-radius: 10px; overflow: hidden;}
#mobile-menu-1001 dl dt a i{ display: inline-block; width: 40px; height: 40px; line-height: 40px; text-align: center; vertical-align: bottom; color: #ffffff;}
#mobile-menu-1001 dl dd{ width: 100%; height: 16px; line-height: 16px; text-align: center; overflow: hidden;}
#mobile-menu-1001 dl dd a{ font-size: 10px;}
@media screen and (max-width: 1240px) {
    #mobile-menu-1001{ display: block;}
} */

/* MOBILE-MENU */
/* Mobile-Menu-1001 */
#mobile-menu-1001{ display: none; width: 100%; height: auto; background: #ffffff; padding: 20px 0 0 0; border-bottom: 1px solid #f5f5f5;}
#mobile-menu-1001 .col{ width: 25%;}
#mobile-menu-1001 dl{ width: 100%; height: auto; margin-bottom: 20px;}
#mobile-menu-1001 dl dt{ width: 50px; height: 50px; margin: 0 auto; margin-bottom: 10px;}
#mobile-menu-1001 dl dt a{ display: block; width: 50px; height: 50px; border-radius: 10px; overflow: hidden;}
#mobile-menu-1001 dl dt a i{ display: inline-block; width: 50px; height: 50px; line-height: 50px; text-align: center; vertical-align: bottom; color: #ffffff;}
#mobile-menu-1001 dl dd{ width: 100%; height: 16px; line-height: 16px; text-align: center; overflow: hidden;}
#mobile-menu-1001 dl dd a{ font-size: 14px;}
@media screen and (max-width: 1240px) {
    #mobile-menu-1001{ display: block;}
}

/* MOBILE-BAR */
/* Mobile-Bar-1001 */
#mobile-bar-1001{ width: 100%; height: 40px; position: fixed; left: 0; bottom: 0; z-index: 11; background: #ffffff; border-top: 1px solid #eeeeee; display: none;}
#mobile-bar-1001 .col{ width: 20%;}
#mobile-bar-1001 a{ display: block; width: 100%; height: 40px; color: #163d8a;}
#mobile-bar-1001 a dl{ width: 100%; font-size: 0; text-align: center;}
#mobile-bar-1001 a dl dt{ display: inline-block; font-size: 18px; line-height: 24px;  width: 100%;  height: 24px; text-align: center; vertical-align: bottom;}
#mobile-bar-1001 a dl dd{ display: inline-block; width: 100%; height: 16px; line-height: 16px; font-size: 10px; text-align: center;}
#mobile-bar-1001 .col:nth-child(3) dt{ font-size: 30px; line-height: 50px; width: 50px; height: 50px; border-radius: 25px; background: #163d8a; color: #ffffff; margin-top: -15px;}
#mobile-bar-1001 .col:nth-child(3) dd{ display: none;}
@media screen and (max-width: 1240px) {
    #mobile-bar-1001{ display: block;}
}

/* Mobile-Bar-1002 */
#mobile-bar-1002{ width: 100%; height: auto; position: fixed; left: 0; bottom: 0; z-index: 18; display: none;}
#mobile-bar-1002 .col{ width: 100%;}
#mobile-bar-1002 .bar{ margin-left: -15px; margin-right: -15px; bottom: 0px; text-align: center; border-top: 1px solid #dfdddb; z-index: 19;}
#mobile-bar-1002 .bar .menu{ position: relative; float: left; width: 33.3333%; height: 40px; line-height: 40px; background: #f7f7f7;}
#mobile-bar-1002 .bar .menu+.menu{ border-left: 1px solid #dfdddb;}
#mobile-bar-1002 .bar .menu .tit{ font-size: 14px; color: #222222;}
#mobile-bar-1002 .bar .menu .tit a{ display: block; font-size: 14px; color: #222222;}
#mobile-bar-1002 .bar .menu .rb{ position: absolute; bottom: 5px; right: 5px; width: 0; height: 0; border: 5px solid transparent; border-right: 5px solid #000000; border-bottom: 5px solid #000000; opacity: 0.3; filter: alpha(opacity = 30);}
#mobile-bar-1002 .bar .menu .sub{ position: absolute; bottom: 50px; z-index: 20; width: calc(100% - 10px); margin: 0 5px; padding: 0px 10px; background: #ffffff; border: 1px solid #dfdddb; display: none;}
#mobile-bar-1002 .bar .menu .sub li{ width: 100%; float: none;}
#mobile-bar-1002 .bar .menu .sub li+li{ border-top: 1px solid #dfdddb;}
#mobile-bar-1002 .bar .menu .sub li a{ display: block; height: 40px; line-height: 40px; text-align: left; color: #222222; border: none; text-align: center; font-size: 14px;}
#mobile-bar-1002 .bar .menu .sub .tiggle{ position: absolute; width: 0px; height: 0px; left: 50%; margin-left: -10px; bottom: -9px; border-top: 10px solid #dfdddb; border-left: 10px solid transparent; border-right: 10px solid transparent; z-index: 20;}
#mobile-bar-1002 .bar .menu .sub .innertiggle{ position: absolute; width: 0px; height: 0px; left: 50%; margin-left: -9px; bottom: -8px; border-top: 9px solid #ffffff; border-left: 9px solid transparent; border-right: 9px solid transparent; z-index: 21;}
@media screen and (max-width: 1240px) {
    #mobile-bar-1002{ display: block;}
}

/* Color */
.bgcolor01{ background: #2196F3;}
.bgcolor02{ background: #ff534d;}
.bgcolor03{ background: #18cea5;}
.bgcolor04{ background: #00b7ee;}
.bgcolor05{ background: #fdba37;}
.bgcolor06{ background: #F44336;}
.bgcolor07{ background: #53bcf5;}
.bgcolor08{ background: #9C27B0;}
.bgcolor09{ background: #E91E63;}
.bgcolor10{ background: #4CAF50;}
.bgcolor11{ background: #00BCD4;}
.bgcolor12{ background: #8BC34A;}
.bgcolor13{ background: #03A9F4;}
.bgcolor14{ background: #CDDC39;}
.bgcolor15{ background: #FF9800;}
.bgcolor16{ background: #673AB7;}
.bgcolor17{ background: #b4ce0d;}
.bgcolor18{ background: #FFC107;}
.bgcolor19{ background: #009688;}
.bgcolor20{ background: #795548;}
.bgcolor21{ background: #3F51B5;}
.bgcolor21{ background: #607D8B;}
.bgcolor23{ background: #FF5722;}

.color01{ color: #2196F3;}
.color02{ color: #ff534d;}
.color03{ color: #18cea5;}
.color04{ color: #00b7ee;}
.color05{ color: #fdba37;}
.color06{ color: #F44336;}
.color07{ color: #53bcf5;}
.color08{ color: #9C27B0;}
.color09{ color: #E91E63;}
.color10{ color: #4CAF50;}
.color11{ color: #00BCD4;}
.color12{ color: #8BC34A;}
.color13{ color: #03A9F4;}
.color14{ color: #CDDC39;}
.color15{ color: #FF9800;}
.color16{ color: #673AB7;}
.color17{ color: #b4ce0d;}
.color18{ color: #FFC107;}
.color19{ color: #009688;}
.color20{ color: #795548;}
.color21{ color: #3F51B5;}
.color21{ color: #607D8B;}
.color23{ color: #FF5722;}