@charset "utf-8";

/** bootstrap **/
@import url(bootstrap.css);

/** 文字icon **/
@import url(font-awesome.min.css);

/** 手機選單 **/
@import url(slicknav.css) screen and (max-width:767px);

*{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
html{width:100%; height:auto;}
body{background:#ffffff; margin:0; padding:0; width:100%; height:auto; font-size:14px;line-height: 1.6;font-family: "Microsoft JhengHei","arial";word-break: break-word;letter-spacing: 1px;}
a,a:hover{text-decoration:none;transition: all 0.5s ease 0s;cursor: pointer;}
img{border:0; vertical-align:middle; max-width:100%;}
input{vertical-align:middle;border-radius: 0; }
input:focus, select:focus, textarea:focus, button:focus{outline:0;}
/** 取消ios按鈕樣式 **/
input[type="button"], input[type="submit"], input[type="reset"], button[type="button"], button[type="submit"], button[type="reset"], a[type="button"], a[type="submit"], a[type="reset"], textarea{border-radius: 0; -webkit-appearance: none;-moz-appearance: none;appearance: none;}
.slicknav_menu{display:none;}
table{border-collapse:inherit;}
::-webkit-scrollbar {width: 6px;}
::-webkit-scrollbar-track {background: #f3f3f3;}
::-webkit-scrollbar-thumb {background: #000000;}
::-webkit-scrollbar-thumb:hover {background: #666666;}

/** 表單預設文字顏色設定 **/
::-webkit-input-placeholder{color:#999999;}
::-moz-placeholder{color:#999999;}
:-ms-input-placeholder{color:#999999;}
input:-moz-placeholder{color:#999999;}
#field2::-webkit-input-placeholder{color:#999999;}
#field3::-webkit-input-placeholder{color:#999999; background:lightgreen; text-transform:uppercase;}
#field4::-webkit-input-placeholder{font-style:italic; text-decoration:overline; letter-spacing:3px; color:#999999;}
#field2::-moz-placeholder{color:#999999;}
#field3::-moz-placeholder{color:#999999; background:lightgreen; text-transform:uppercase;}
#field4::-moz-placeholder{font-style:italic; text-decoration:overline; letter-spacing:3px; color:#999999;}
.writing-mode-vertical{writing-mode:tb-lr; -ms-writing-mode:tb-lr; -webkit-writing-mode:vertical-lr; -moz-writing-mode:vertical-lr; -ms-writing-mode:vertical-lr; writing-mode:vertical-lr;}

/** 手機選單、選單 色塊-變色 **/
.b-color, .slicknav_menu{}
.slicknav_icon-bar{background-color:#000000;}
.b-color>li:hover, .b-color>li>ul>li>a:hover, .slicknav_nav .slicknav_row:hover, .slicknav_nav a:hover{color:#000000;}
.border-color{border-left:7px #A0A0A0 solid;}
.slicknav_nav .slicknav_arrow{font-family:Arial;}

/** 浮動icon **/
.float-icon-main{position: fixed;width: 40px; height: auto;bottom: 55px;right: 7px;z-index: 10000;}
.float-icon{}
.float-icon ul{list-style: none;padding: 0;margin: 0;display: block;}
.float-icon ul li{padding: 0;margin:7px 0;display: block;width: 40px; height: 40px;}
.float-icon ul li a{display:flex;width: 40px; height: 40px;align-items: center;justify-content: center; background: #ffffff;padding: 10px;border-radius: 50px;border: 2px #000000 solid;}
.float-icon ul li a:hover{background: #000000;border: 2px #ffffff solid;box-shadow: 0 0 10px 0 rgba(0,0,0,.2);}
.float-icon ul li a:hover img{-webkit-filter:invert(100%);}

/** 上版 **/
header{position: fixed;top: 0;left: 0;width: 100%; background:#ffffff;padding: 0 3.29%;border-top: 6px #000000 solid;border-bottom: 1px #dddddd solid;z-index: 10000;}
.head-main{margin:0;padding:0; position:relative;display: flex;align-items: center;}
.head-main .logo{width: 241px; height:auto;}
.head-main .logo a{display: block;color:#000000;}
.head-main .logo img{width:100%; height:auto;}
.home{display:none;}
@media screen and (max-width:1280px){
    header{padding: 0 15px;}
}
@media screen and (max-width:767px){
	header{border-top: 0;border-bottom:0;}
    .head-main .logo{width: 180px;position:fixed;top:12px;left: 10px;z-index: 10000;}
}

/** 主選單與下拉 **/
nav{flex: 1;}
.menu{ padding:0; list-style:none; position:relative; margin:0; display:flex;justify-content: flex-end;}
.menu>li{width: 96px;;color:#000000; font-size:12px; text-align:center; position:relative; cursor:pointer; padding:0; margin:0;}
.menu>li .menu-ch{display: none;transition: all 0.5s ease 0s;}
.menu>li .menu-en{display: block;text-transform: uppercase;transition: all 0.5s ease 0s;}
.menu>li>a{color:#000000; display:block; padding:25.42px 15px; margin:0;}
.menu>li>a:hover{}
.menu>li:hover .menu-ch{display: block;transition: all 0.5s ease 0s;}
.menu>li:hover .menu-en{display: none;transition: all 0.5s ease 0s;}
.menu>li.sub>ul.sub-menu{background:rgba(0,0,0,0.5); display:none; position:static; z-index:999; margin:0; padding:0; border-radius:0 0 5px 5px; overflow:hidden;}
.menu>li.sub:hover ul.sub-menu{position:absolute; display:block; width:100%; left:0; top:47px;}
.menu>li.sub>ul.sub-menu>li{display:block; border-top:1px #fff dotted;}
.menu>li.sub>ul.sub-menu>li>a{display:block; color:#fff; padding:5px 10px; margin:0;}
.menu>li.sub>ul.sub-menu>li>a:hover{background:#000000;}
@media screen and (max-width:767px){
	#menu{display:none;}
	.slicknav_menu{display:block;position: fixed;top: 0;left: 0;width: 100%; background:#ffffff;border-top: 4px #000000 solid;border-bottom: 1px #dddddd solid;z-index: 10000;}
}

/** edm輪播 **/
.edm-main{background:#ffffff; max-width:1280px;/* EDM滿版 max-width:100%; */ margin:0 auto; position:relative;}
.edm-main img{vertical-align:middle; width:100%; height:auto; position:absolute;}
.edm{position: relative; margin: 0 auto; top: 0px; left: 0px; width: 1280px; height: 480px; overflow: hidden; visibility: hidden;}
.edm-loading-main{position: absolute; top: 0px; left: 0px;}
.edm-loading{filter: alpha(opacity=70); opacity: 0.7; position: absolute; display: block; top: 0px; left: 0px; width: 100%; height: 100%;}
.edm-loading-photo{position:absolute;display:block;background:url(../images/loading.gif) no-repeat center center;top:0px;left:0px;width:100%;height:100%;}
.edm-photo{cursor: default; position: relative; top: 0px; left: 0px; width: 1280px; height: 480px; overflow: hidden;}
.edm-navigator{width:16px;height:16px;}
.swiper-slide a{display: block;}

/** 配置 **/
.warpper{overflow: hidden;}
.main{}

/** 首頁作品 **/
.i-work-main{padding:77px 0 0 0;}
.i-work{ max-height: calc(100vh - 127px);display: flex;align-items: center;padding: 9.15vh 0 4.77vh 0;}
.i-work .swiper-button-prev{background: rgba(0,0,0,.7) url("../images/arrow-left.svg")no-repeat center center;background-size: 24px;width: 40px; height: 70px;left: 0;}
.i-work .swiper-button-next{background: rgba(0,0,0,.7) url("../images/arrow-right.svg")no-repeat center center;background-size: 24px;width: 40px; height: 70px;right: 0;}
.swiper-button-prev:after, .swiper-rtl .swiper-button-next:after{display: none;}
.swiper-button-next:after, .swiper-rtl .swiper-button-prev:after{display: none;}
@media screen and (max-width:767px){
	.i-work-main{padding: calc(52px + 9vw) 0 5.8vw 0;}
    .i-work .swiper-button-prev{background: rgba(0,0,0,.7) url("../images/arrow-left.svg")no-repeat center center;background-size: 18px;width: 30px; height: 53px;}
    .i-work .swiper-button-next{background: rgba(0,0,0,.7) url("../images/arrow-right.svg")no-repeat center center;background-size: 18px;width: 30px; height: 53px;}
}

/** 內頁banner **/
.inside-banner{padding:20px 0;}
.inside-banner .banner-title{max-width:1280px; font-size:16px; color:#000000; margin:0 auto; padding:0;text-align: center;}
.inside-banner .banner-title .banner-title-en{font-size:16px; color:#000000;text-transform: uppercase;display: table;margin: 0 auto;padding:0 15px 5px 15px;border-bottom: 1px #000000 solid;}
@media screen and (max-width:767px){
	.inside-banner{padding:0;}
}

/** Breadcrumb **/
.breadcrumb{display:flex; flex-wrap:wrap; width:100%; max-width:1280px; margin:0 auto; padding:0.75rem 1rem 0.75rem 0; list-style:none; background-color:#e9ecef; border-radius:0.25rem;}
.breadcrumb-item{padding-left:0.5rem;}
.breadcrumb-item + .breadcrumb-item::before{display:inline-block; padding-right:0.5rem; color:#6c757d; content:"/";}
.breadcrumb-item a{font-weight:bold; text-decoration:none; color:#4697bf;}
.breadcrumb-item a:hover{color:#007bff; text-decoration:none;}

/** 內頁架構 **/
.content-body-main{background-position: center center;background-repeat: no-repeat;background-size: cover;background-attachment: fixed;padding:107px 15px 6.0658vh 15px;overflow: hidden;}
.content-body{max-width: 1280px; margin:0 auto; padding:30px 0 0 0;}
.page-title{width: 100%; font-size:18px; color:#000000;font-weight: bold;padding:3px 0 3px 8px; margin:0 0 20px 0;border-left: 3px #000000 solid;line-height: 1.4;}
.page-title02{font-size:18px; color:#000000;font-weight: bold;border-bottom: 3px #000000 solid; border-top: 1px #000000 solid;padding:10px 10px; margin:0 0 20px 0;line-height: 1.4;}
.page-main{padding:0; font-size:14px; color:#000000;line-height: 1.8;}
.page-main p{margin-bottom: 1.5rem;}
@media screen and (max-width:767px){
	.content-body-main{padding:82px 15px 5.8vw 15px;}
    .content-body{min-height:inherit;}
}

/** 左邊分類 **/
.left-menu-title{background:#e9ecef; text-align:center; font-size:18px; font-weight:bold; padding:8px 0; border-radius:5px 5px 0 0; margin-bottom:3px; border-bottom:2px solid #6d6d6d; color:#525252;}
.in-left-menu-main{}
.in-left-menu{max-width:1280px; margin:0 auto;}
.in-left-menu>ul{margin:0; padding:0; list-style:none;display: flex;justify-content: center;}
.in-left-menu>ul>li{width: auto; font-size:14px; color:#000000; padding:0;margin: 0 8px;}
.in-left-menu>ul>li>a{color:#000000;  display:block; padding:5px 15px;border-radius: 3px;position: relative;z-index: 1;overflow: hidden;}
.in-left-menu>ul>li>a:after{content: "";display: block;width: 0%;height: 100%;background:#e0cf77;position: absolute;top: 0;left: 0;transition: all 0.5s ease 0s;z-index: -1;}
.in-left-menu>ul>li>a:hover{color: #ffffff;}
.in-left-menu>ul>li>a:hover:after{width: 100%;transition: all 0.5s ease 0s;}
.in-left-menu>ul>li>.current{background: #e0cf77;color: #ffffff;}
.in-left-menu>ul>li>.current:hover:after{width:0;}
.in-left-menu>ul>li ul{margin:5px 0 0 30px; padding:0; list-style:square;}
.in-left-menu>ul>li ul li{border-top:1px #CCC dotted; padding:5px 5px 5px 0;}
.in-left-menu>ul>li ul li a{font-size:13px; color:#666; display:block;}
.in-left-menu>ul>li ul li a:hover{color:#71743D;}
.left-beautify img{width:100%; height:auto; margin-top:0px;}
.m_classLink{display:none;}
@media screen and (max-width:767px){
    .in-left-menu-main{margin: 20px 0 0 0;}
}
@media screen and (max-width:575px){
	.in-left-menu>ul>li{margin: 0 6px;}
    .in-left-menu>ul>li>a{padding:8px 10px;}
}

/** 公司簡介 **/
.company-main{display: flex;}
.company-main .company-video{flex: 1;}
.video{overflow: hidden;margin: 0;position: relative;padding-bottom: 56.3%;height: 0;display: block;width: 100%;}
.video canvas {width: 100%;height: 100%;}
.video video {position: absolute;top:0;left: 0;width: 100%;height: 100%;object-fit: cover;}
.company-main .company-info{flex: 1;padding:30px calc(15px + 4vw);margin:0;background: #cdcdcd;max-height:25.45vw;overflow-y: auto;}
.company-main .company-info>ul{list-style: none;padding: 0;margin: 0;}
.company-main .company-info>ul>li{padding:15px 0;margin: 0;display: flex;}
.company-main .company-info>ul>li .company-title{width: 100px;margin: 0 15px 0 0;font-size: 14px;font-weight:bold;color: #000000;}
.company-main .company-info>ul>li .company-content{flex: 1;color: #666666;}
@media screen and (max-width:900px){
    .company-main{display: block;padding: 0;}
    .company-main .company-video{flex:inherit;width: 100%;}
    .video{height:auto;padding-bottom: 0;margin: 0 0 -7px 0;}
    .video video {position: inherit;top:inherit;left: inherit;}
    .company-main .company-info{flex:inherit;width: 100%; padding:20px 15px;max-height:inherit;}
}
@media screen and (max-width:575px){
    .company-main .company-info>ul>li{display: block;}
    .company-main .company-info>ul>li .company-title{width:100%;margin: 0 0 8px 0;}
    .company-main .company-info>ul>li .company-content{flex:initial;width: 100%;}
}

/** 作業流程 **/
.process{}
.process>ul{list-style: none;padding: 0;margin: 0;display: flex;flex-wrap: wrap;}
.process>ul>li{flex: 1;padding: 30px 15px 30px 35px;border-right: 1px #cccccc solid;min-height:calc(100vh - 20.70832vh - 276px);position: relative;}
.process>ul>li:after{content: "";display: block;width: 0;height: 0;border-style: solid;border-width: 30px 0 30px 20px;border-color: transparent transparent transparent #e0cf77;position: absolute;top: 28%;right: -20px;}
.process>ul>li:nth-child(8n){border-right: 0;}
.process>ul>li:nth-child(8n):after{display: none;}
.process>ul>li .process-step{font-size: 20px;text-transform: uppercase;}
.process>ul>li .process-icon{max-width: 66px;margin: 20px 0;}
.process>ul>li .process-info{}
.process>ul>li .process-info h2{padding: 0;margin: 0 0 5px 0;line-height: 1.6;font-size: 16px;font-weight:bold;color: #000000;}
.process>ul>li .process-info .process-content{color: #666666;}
.process>ul>li .process-info .process-content>ul{list-style: none;padding: 0;margin: 0;}
.process>ul>li .process-info .process-content>ul>li{padding: 0 0 0 10px;margin: 0;position: relative;}
.process>ul>li .process-info .process-content>ul>li:before{content: " - ";display:block;position: absolute;top: 0px;left: 0;}
@media screen and (max-width:1100px){
    .process>ul>li{flex:initial;width: calc(100%/4);min-height:inherit;}
    .process>ul>li:nth-child(8n){border-right: 1px #cccccc solid;}
    .process>ul>li:nth-child(4n){border-right: 0;}
    .process>ul>li:nth-child(8n):after{display: block;}
    .process>ul>li:nth-child(4n):after{display: none;}
}
@media screen and (max-width:767px){
    .process>ul>li{width: calc(100%/2);}
    .process>ul>li:nth-child(4n){border-right: 1px #cccccc solid;}
    .process>ul>li:nth-child(2n){border-right: 0;}
    .process>ul>li:nth-child(4n):after{display: block;}
    .process>ul>li:nth-child(2n):after{display: none;}
    .process>ul>li .process-icon{max-width: 60px;}
}
@media screen and (max-width:575px){
    .process>ul>li{padding: 20px 10px 20px 25px;}
    .process>ul>li:after{border-width: 25px 0 25px 15px;top: 28%;right: -15px;}
}

/** 收費標準 **/
.toll{}
.toll>ul{list-style: none;padding: 0;margin: 0 0 4vw 0;}
.toll>ul>li{padding:20px;margin: 0;display: flex;border-bottom: 1px #cccccc dashed;}
.toll>ul>li .toll-title{width: 180px;margin: 0 15px 0 0;font-size: 14px;font-weight:bold;color: #000000;}
.toll>ul>li .toll-content{flex: 1;color: #666666;}
.toll>ul>li .toll-content span{display: inline-block;}
.toll>ul>li .toll-content>ul{list-style: square;padding: 0;margin: 0 0 0 20px;}
.toll>ul>li .toll-content>ul>li{padding: 0;margin:0 0 5px 0;}
@media screen and (max-width:900px){
    .toll>ul{margin: 0 0 30px 0;}
}
@media screen and (max-width:767px){
    .toll>ul>li{padding:20px 10px;}
}
@media screen and (max-width:575px){
    .toll>ul>li{display: block;}
    .toll>ul>li .toll-title{width:100%;margin: 0 0 8px 0;}
    .toll>ul>li .toll-content{flex:initial;width: 100%;}
}

/** 最新消息 **/
.news {}
.news ul{margin:0; padding:0; list-style:none;display: flex;flex-wrap: wrap;}
.news ul li{width: calc(100%/4 - 30px);margin: 15px;}
.news ul li a{color:#000000; display:block; align-items:center; padding:0;}
.news ul li a:hover{}
.news-photo-main{overflow: hidden;position: relative;}
.news-photo{background-color:#f7f7f7;background-position: center top;background-repeat: no-repeat;background-size:cover;transform:scale(1);transition: all 0.5s ease 0s;}
.news ul li .news-photo-main:before{content: "";display: block;width: 10px;height: 10px; border-top: 1px #ffffff solid;border-left: 1px #ffffff solid;position: absolute;top: 10px;left: 10px;z-index: 1;transition: all 0.5s ease 0s;}
.news ul li .news-photo-main:after{content: "";display: block;width: 10px;height: 10px; border-bottom: 1px #ffffff solid;border-right: 1px #ffffff solid;position: absolute;bottom: 10px;right: 10px;z-index: 1;transition: all 0.5s ease 0s;}
.news ul li:hover .news-photo-main:before{width:calc(100% - 20px);height: calc(100% - 20px); border-top: 1px #ffffff solid;border-left: 1px #ffffff solid;transition: all 0.5s ease 0s;}
.news ul li:hover .news-photo-main:after{width:calc(100% - 20px);height:calc(100% - 20px); border-bottom: 1px #ffffff solid;border-right: 1px #ffffff solid;transition: all 0.5s ease 0s;}
.news ul li:hover .news-photo{transform:scale(1.1);transition: all 0.5s ease 0s;}
.news ul li .news-info{padding: 15px 0;}
.news ul li .news-info .news-date{color:#666666; font-size:12px;text-transform: uppercase;}
.news ul li .news-info h3{font-size:14px; color:#000000; font-weight:bold; padding:0; margin:10px 0 0 0;line-height: 1.4;}
.news-detail-date{color:#ffffff;font-size: 12px; padding:5px 15px;background: #000000; display: table;margin: 0 0 25px 0;position: relative;z-index: 1;text-transform: uppercase;}
.news-detail-date:after{content: "";display: block;width: 100%;height: 100%;position: absolute;top: 6px;left: 6px; border:1px #000000 solid;}
@media screen and (max-width:767px){
	.news ul li{width: calc(100%/3 - 20px);margin: 10px;}
}
@media screen and (max-width:575px){
	.news ul li{width: calc(100%/2 - 16px);margin: 8px;}
}

/** 作品欣賞 **/
.work-store-info{font-size:16px; color:#666; padding:10px; margin-bottom:20px;}
.work ul{ margin:0 ; padding:0; list-style:none; display:flex; flex-wrap:wrap;}
.work ul li{width:calc(100%/2 - 30px); margin:15px; padding:0;}
.work-photo-main{overflow: hidden;}
.work-photo{background-color:#f7f7f7;background-position: center center;background-repeat: no-repeat;background-size:cover;transform:scale(1);transition: all 0.5s ease 0s;}
.work ul li a{display: block;}
.work ul li a:hover{}
.work ul li:hover .work-photo{transform:scale(1.1);transition: all 0.5s ease 0s;}
.work ul li .work-info{padding:30px 10px 10px 10px;border-left: 1px #000000 solid;margin: -20px 25px 0 25px;position: relative;z-index: 1;}
.work ul li .work-info h3{font-size:14px; color:#000000; font-weight:bold; padding:0; margin:0;line-height: 1.4;}
@media screen and (max-width:767px){
	.work ul li{width:calc(100%/2 - 20px); margin:10px; }
    .work ul li .work-info{padding:30px 10px 10px 10px;margin: -20px 20px 0 20px;}
}
@media screen and (max-width:575px){
	.work ul li{width:calc(100%/1 - 0px); margin:10px 0; }
}

/** 作品欣賞明細 **/
.work-detaile{display:flex; flex-wrap:wrap; margin:0;padding: 0; position: relative;z-index: 1;}
.work-detaile-photo-box{flex:2; margin:0 0 0 4vw;position: relative;padding:0 15px ;max-height:calc(100vh - 6.0658vh - 276px - 58.8px);overflow-y: auto;}
.work-detaile-spe-box{flex: 1; position:relative;padding:0 15px ;max-height:calc(100vh - 6.0658vh - 276px - 58.8px);overflow-y: auto;}
.work-detaile .work-detaile-photo-box>ul{list-style: none;padding: 0;margin: 0;}
.work-detaile .work-detaile-photo-box>ul>li{padding: 0;display: block;width: 100%;margin: 10px 0;}
.work-detaile .work-detaile-photo-box>ul>li:first-of-type{margin:0 0 10px 0;}
.work-time{background:url(../images/time.png) left center no-repeat; font-size:12px; color:#968c69; padding-left:20px;}
.work-specification{font-size:16px; color:#333; position:relative;}
h3.work-introduce{background:#999; font-weight:normal; border-left:5px #111111 solid; padding:8px 10px; font-size:20px; color:#fff; margin:25px 0 15px 0;}
.work-content{padding:0px 0; font-size:16px; color:#333; clear:both;}
@media screen and (max-width:1100px){
}
@media screen and (max-width:900px){
	.work-detaile{display:block; }
	.work-detaile-photo-box{width:100%; margin:30px 0 0 0;padding: 0; max-height: inherit;}
	.work-detaile-spe-box{width:100%;padding: 0;max-height: inherit;}
}

/** 聯絡我們 **/
.contact-body{display: flex;flex-wrap: wrap;}
.contact-body .contact-body-photo{flex: 1;background-position: center center;background-repeat: no-repeat;background-size: cover;height: calc(100vh - 151.61px);position: fixed;top: 97px;left: 0;width: 45%;}
.contact-body .contact-body-info{flex: 1;margin: 0 0 0 45%;padding:30px calc(15px + 8vw);height: calc(100vh - 151.61px);overflow-y: auto;background: #cdcdcd;}
.contact-note{padding:10px 0; font-weight:bold; font-size:16px; color:#900;}
.contact-info{width: 100%; margin: 0;min-height: calc(100vh - 211.61px);display: flex;flex-wrap: wrap;align-content: center;padding: 15px 0 ;}
.contact-form{width: 100%;margin: 0;min-height: calc(100vh - 211.61px);display: flex;flex-wrap: wrap;align-content: center;padding: 15px 0;}
.contact-content{color: #222222;flex: 1;margin:0;width: 100%;}
.contact-content>ul{list-style: none;padding: 0;margin: 0;display: block;}
.contact-content>ul>li{width:100%;margin:25px 0;padding: 0;display: flex;font-size: 12px; color: #222222;}
.contact-content>ul>li .contact-icon{width: 18px;margin: 0 10px 0 0;}
.contact-content>ul>li .contact-dep{flex: 1;}
.contact-content>ul>li a{color: #222222;display: inline-block;}
.contact-content>ul>li a:hover{color: #666666;}
.googlemap {position: relative;padding-bottom: 50%;padding-top: 30px;height: 0;overflow: hidden;margin: 5px 0 0 0;width: 100%;}
.googlemap iframe {position: absolute;top:0;left: 0;width: 100%;height: 100%;}
@media screen and (max-width:900px){
	.contact-body{display:block;}
    .contact-body .contact-body-photo{flex: initial;height:50vh;position:inherit;top:inherit;left:inherit;width: 100%;}
    .contact-body .contact-body-info{flex: initial;margin: 0;width: 100%;padding:20px 15px;height:auto;overflow-y:inherit;}
    .contact-info{min-height: inherit;margin: 0 0 20px 0;padding: 0;}
    .contact-form{min-height: inherit;padding: 0;}
    .googlemap {padding-bottom: 56%;}
}
@media screen and (max-width:767px){
    .contact-content>ul>li{margin:20px 0;}
}

/** 表單欄位 **/
label{min-width: 100px;margin: 3px 0;}
.form-box{width: 100%;}
.form-box input, .form-box img{vertical-align:middle;}
.opinion{display:flex; flex-wrap:wrap; margin:15px 0; overflow:hidden;background: #ffffff;padding: 20px;border-radius: 10px;}
.opinion-left01{width:100%; padding:5px 0; font-size:14px; color:#000000; display:flex; align-items:center;}
.input-main-style01{background:rgba(255,255,255,.9); flex:1; width:100%; border:0;border-bottom:1px solid #bbbbbb; margin:0; padding:8px 1px; font-size:14px; color:#000000;  min-height:40.39px;}
.input-main-style02{background:rgba(255,255,255,.9); flex:1; width:100%; border:0;border-bottom:1px solid #bbbbbb; margin:0; padding:8px 1px; font-size:14px;  color:#000000;  min-height:40.39px;}
.input-main-style03{background:rgba(255,255,255,.9); width:100%; border:0;border-bottom:1px solid #bbbbbb; margin:5px 0 0 0; padding:8px 1px; font-size:14px;  color:#000000; line-height:1.8; min-height:40.39px;}
.input-main-style04{ flex:1; width:100%; border:0; margin:0; padding:8px 0; font-size:14px; color:#000000;  min-height:40.39px;}
.input-main-style05{background:rgba(255,255,255,.9); flex:1; width:auto; border:0;border-bottom:1px solid #bbbbbb; padding:5px 15px; font-size:14px; color:#000000;  min-height:34.39px;margin: 0 0 0 8px;}
.input-main-select{background:none; flex:1; width:100%; border:0; margin:0; padding:0; font-size:14px; color:#000000; display:flex; flex-wrap:wrap;}
.input-main-select select{background:rgba(255,255,255,.8);flex: 1; padding:8px 1px;border-bottom:1px solid #bbbbbb; font-size:14px; color:#000000; min-height:40.39px;margin: 0 5px 0 0;}
.input-main-select select:nth-child(even){margin: 0;}
.input-main{width: calc(100%/2 - 7.5px);display: flex;align-items: center;margin: 5px 15px 5px 0;}
.input-main:nth-of-type(2n){margin: 5px 0;}
.input-main .input-main-style01{margin: 0 8px;}
.select-style{background:#8a6e0c; font-size:14px; color:#ffffff; line-height:20px; padding:8px 10px; border:0;}
.input-style01{background:#f4f8fb; flex:1; width:100%; border:0; margin:0; padding:8px 1px; font-size:14px;color:#000000; min-height:40.39px;}
input:disabled{background-color:#fff; color:#2d7fb9; cursor:no-drop;}
.btn.openlink{margin:3px 0; padding:0 10px; text-align:center; font-size:14px; line-height:1.5; font-weight:bold; background-color:#2d7fb9; color:#fff; border-radius:5px;}
.btn.openlink:hover{background-color:#ffbe00;}
img.code{width:100px; height:40.39px; margin:0; vertical-align:middle; display:inline-block;}
.pay-main{padding:0;font-size: 14px; color: #333333;border-radius:0;margin: 15px 0 ;}
.input-main-style01:focus,.input-main-style02:focus,.input-main-style03:focus,.input-main-style04:focus,.input-main-select select:focus{border-bottom: 1px #000000 solid;}
input[type="checkbox"] {display:none;}
input[type="checkbox"] + label {width:calc(100%/3 - 3px);display: inline-block;padding: 0 5px 0 0;font-size: 14px;}
input[type="checkbox"] + label span {display:inline-block;width:19px;height:19px;margin:-4px 2px 0 0;vertical-align:middle;background:url(../images/input-button.png) left top no-repeat;cursor:pointer;}
input[type="checkbox"]:checked + label span {background: url(../images/input-button.png) -19px top no-repeat;}
input[type="radio"] {display:none;}
input[type="radio"] + label {width:calc(100%/3 - 3px);display:inline-block;padding: 0 5px 0 0 ;font-size: 14px;}
input[type="radio"] + label span {display:inline-block;width:19px;height:19px;margin:-4px 2px 0 0;vertical-align:middle;background:url(../images/input-button.png) -38px top no-repeat;cursor:pointer;}
input[type="radio"]:checked + label span {background:url(../images/input-button.png) -57px top no-repeat;}
.input-main02 input[type="checkbox"] + label:last-of-type {width:calc(100%/1 - 1px);}
.star{color: #ff0000;font-size: 12px;padding: 0 5px;}
.input-main-note{color: #666666;}
@media screen and (max-width:1250px){
    input[type="checkbox"] + label {width:calc(100%/2 - 3px);}
    input[type="radio"] + label {width:calc(100%/2 - 3px);}
}
@media screen and (max-width:900px){
    .opinion{padding: 15px;}
	input[type="checkbox"] + label {width:calc(100%/4 - 4px);}
    input[type="radio"] + label {width:calc(100%/4 - 4px);}
}
@media screen and (max-width:767px){
	input[type="checkbox"] + label {width:calc(100%/3 - 3px);}
    input[type="radio"] + label {width:calc(100%/3 - 3px);}
}
@media screen and (max-width:575px){
	input[type="checkbox"] + label {width:calc(100%/2 - 3px);}
    input[type="radio"] + label {width:calc(100%/2 - 3px);}
}
@media screen and (max-width:374px){
    .input-main{width: calc(100%/1 - 0px);margin: 5px 0;}
	input[type="checkbox"] + label {padding: 0;}
    input[type="radio"] + label {padding: 0;}
}

/** 按鈕 **/
.cart-btn{padding:0; text-align:center; margin-top:30px; display:flex; flex-wrap:wrap;justify-content: flex-end; align-items:center;}
.btn-send{font-size:14px;}
a.btn-send{background: #000000; padding:10px 30px; text-align:center; font-size:14px; color:#ffffff;display: table;margin:0; }
a.btn-send:hover{ background:#e0cf77;}
a.btn-reset{background: #ffffff; padding:8px 20px; text-align:center; font-size:14px;color:#999999;width: calc(50% - 10px); margin:5px; border:1px solid #999999;}
a.btn-reset:hover{color:#000000; border:1px solid #000000;}
a.btn-send-over{background:#7ea2c5; padding:8px 20px; text-align:center; font-size:14px; color:#fff; min-width:100px; margin:2px; border-radius:5px; border:2px solid #7ea2c5;}
a.btn-send-over:hover{background:#96b9dc; border:2px solid #96b9dc;}

/** 送出訊息 **/
.jump-window-box{max-width:500px;width: 100%; margin:0 auto; border:1px #bbbbbb solid; padding:20px; background: rgba(255,255,255,.8);height: 100%;}

/** 頁次 **/
.page{font-size:13px; color:#222222; text-align:center; clear:both; margin:30px 0 0 0;}
.page a {display:table;margin: 0 auto;background: #000000; color:#ffffff;padding: 4px 15px;}
.page a:hover {background: #e0cf77;}
.page>ul {list-style: none;display:flex;padding: 0;margin: 0;justify-content: center;align-items: center;flex-wrap: wrap;}
.page>ul>li {padding: 0;margin: 0;width: 34px;height: 34px;}
.page>ul>li a {background: none; display:flex;align-items: center;justify-content: center; color:#222222;padding: 6px 6px;width: 34px;height: 34px;}
.page>ul>li a.active { background: #e0cf77;color: #ffffff;}
.page>ul>li a:hover:not(.active) {background: #e0cf77;color: #ffffff;}

/** 下版 **/
footer{background:#ffffff;border-top: 1px #dddddd solid;padding:9.62px 3.29%;}
footer .footer{ display: flex;align-items: center;}
footer .footer .f-contact{color: #222222;flex: 1;display: none;}
footer .footer .f-contact>ul{list-style: none;padding: 0;margin: 0;display: flex;flex-wrap: wrap;}
footer .footer .f-contact>ul>li{width: auto;margin: 5px 3.6vw 5px 0;padding: 0;display: flex;font-size: 12px; color: #222222;}
footer .footer .f-contact>ul>li .f-contact-icon{width: 18px;margin: 0 6px 0 0;}
footer .footer .f-contact>ul>li .f-contact-dep{flex: 1;}
footer .footer .f-contact>ul>li a{color: #222222;display: inline-block;}
footer .footer .f-contact>ul>li a:hover{color: #666666;}
footer .footer .copyright{width:100%; color:#999999; font-size:12px; display:block; text-transform:uppercase;text-align: center;line-height: 1.2;}
footer .footer .copyright .wd{display:inline-block;width:auto;padding: 0 0 0 16px;}
footer .footer .copyright .wd a{display: block;color:#999999;}
footer .footer .copyright .wd a:hover{color:#222222;}
@media screen and (max-width:1280px){
    footer{padding:9.62px 15px;}
}
@media screen and (max-width:900px){
    footer .footer{ display:block;}
    footer .footer .f-contact{flex:initial;width: 100%;}
    footer .footer .f-contact>ul{justify-content: center;}
    footer .footer .f-contact>ul>li{margin: 5px 16px;}
}
@media screen and (max-width:575px){
    footer .footer .f-contact>ul>li{width:100%;margin: 5px 0;justify-content: center;}
}
@media screen and (max-width:374px){
    footer .footer .copyright .wd{display:block;width:100%;padding:0;}
}