@charset "utf-8";

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

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

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

/** font **/
@import url(Noto+Serif+TC.css);

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

*{-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:medium;line-height: 2;font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, "Droid Sans", "Helvetica Neue", Helvetica, Arial, "Microsoft JhengHei", sans-serifword-break: break-word;letter-spacing: 2.5px; overflow-y: scroll;}
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-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;}

/** 清除瀏覽器的默認選擇框樣式清除，隱藏拖動箭頭 **/
select {appearance:none;-moz-appearance:none;-webkit-appearance:none;background:#ffffff url("../images/select-icon.svg")no-repeat right 10px center;background-size: 10px;padding: 3px 35px 3px 15px; border: 0;border-bottom: 1px #dddddd solid;border-radius: 0;}
select::-ms-expand { display: none; }

/** 反白 **/
::selection {background: #eda12f;color: #ffffff;}
::-moz-selection {background:#eda12f;color: #ffffff;}

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

/** 浮動icon **/
.float-icon{position: fixed;width: 54px; height: auto;bottom: 8%;right: 10px;z-index: 10000;letter-spacing: 0;font-size: 14px; color: #ffffff;line-height: 1.4;}
.float-icon ul{list-style: none;padding: 0;margin: 0;display: block;}
.float-icon ul li{padding: 0;margin:5px 0;display: block;width: 54px; height: auto;text-align: center;}
.float-icon ul li a{display: block;width: 54px;background: #222222;padding:13px 10px;border-radius: 5px;border: 1px #ffffff solid;overflow: hidden;color: #ffffff;}
.float-icon ul li a i{width:100%;display: block;margin: 0 0 6px 0;}
.float-icon ul li a i img{width: 20px; height: 20px;}
.float-icon ul li a:hover{background: #ffffff;color: #222222;border: 1px #222222 solid;}
.float-icon ul li a:hover i img{filter: brightness(0) opacity(.87);}
@media screen and (max-width:1024px){
	.float-icon{width: 40px;bottom: 10px;}
    .float-icon ul li{width: 40px;}
    .float-icon ul li a{width: 40px;padding:10px 10px;}
    .float-icon ul li a i img{width: 16px; height:16px;}
}

/** 語系 **/
.lang{position: fixed;bottom: 25px;left: 0;z-index: 10000;letter-spacing: 0px;width: 140px;padding: 10px 16px;}
.lang>ul{list-style: none;padding: 0;margin: 0;display: flex;justify-content: center;}
.lang>ul>li{padding: 0;margin: 0;font-size: 14px;width: 54px;}
.lang>ul>li a{display: block;background: transparent;color: #ffffff;padding: 5px;transition: all 0.5s ease 0s;}
.lang>ul>li a.active{background: #ffffff;color: #000000;transition: all 0.5s ease 0s;}
.lang>ul>li a:hover:not(.active){background: rgba(255,255,255,.2); box-shadow: 0 0 0 1px #ffffff inset;transition: all 0.5s ease 0s;}
.header-height .lang>ul>li a{background: #f3f3f3;color: #000000;transition: all 0.5s ease 0s;}
.header-height .lang>ul>li a.active{background: #eca22e;color: #ffffff;transition: all 0.5s ease 0s;}
.header-height .lang>ul>li a:hover:not(.active){background: #a8ab4f;color: #ffffff;box-shadow: 0 0 0 0 #ffffff inset;transition: all 0.5s ease 0s;}
@media screen and (max-width:1024px){
    .lang{bottom: inherit;top: 17px; left:inherit;right: 80px;width: auto;padding: 0px;}
    .lang>ul>li{font-size: 13px;width: 50px;}
    .lang>ul>li a{padding:0 5px;}
}

/** 上版 **/
header{width: 140px;text-align: center;position: fixed;top: 0;left: 0;z-index: 10000;background: rgba(255,255,255,0);box-shadow: 0 0 0 0 rgba(0,0,0,0); transition: all 0.5s ease 0s;}
.head-main{}
.head-main .logo-main{text-align: center;position: fixed;top: 25px;left: 0;width: 140px;z-index: 10000;}
.head-main .logo-main a{display: block;}
.head-main .logo-main img{width:100%; height:auto;filter: brightness(100);transition: all 0.5s ease 0s;}
.head-main .logo-main .logo{height:auto;width: 80px;margin: 0 auto;}
.head-main .logo-main .logo-font{font-size: 18px;color: #222222; margin: 5px 0 0 0;letter-spacing: 0;filter: brightness(100);transition: all 0.5s ease 0s;}
.header-height{background: rgba(255,255,255,1);box-shadow: 0 0 15px 0 rgba(0,0,0,.2);transition: all 0.5s ease 0s;}
.header-height .head-main .logo-main img{filter: brightness(1);transition: all 0.5s ease 0s;}
.header-height .head-main .logo-main .logo-font{filter: brightness(1);transition: all 0.5s ease 0s;}
@media screen and (max-width:1024px){
    .head-main .logo-main{top: 10px;left: 15px; width: auto;text-align: left;}
    .head-main .logo-main a{display: flex;align-items: center;}
    .head-main .logo-main .logo{width: 47px;margin: 0;}
    .head-main .logo-main .logo-font{flex: 1; font-size: 16px;margin:0 0 0 8px;}
    .show-logo .head-main .logo-main img{filter: brightness(1);}
    .show-logo .head-main .logo-main .logo-font{filter: brightness(1);}
	.header-height{background: rgba(255,255,255,0);box-shadow: 0 0 0 0 rgba(0,0,0,0);}
}

/** 主選單與下拉 **/
nav{height: 100vh;padding: 140px 0;display:block;align-content: center;line-height: 1.6;}
.menu{ padding:0; list-style:none; position:relative; margin:0; }
.menu>li{width: 100%; color:#ffffff; font-size:16px; text-align:center; position:relative;cursor:pointer; padding:0; margin:5px 0;transition: all 0.5s ease 0s;}
.menu>li>a{color:#ffffff; display:block; padding:5px 10px; margin:0;position: relative;transition: all 0.5s ease 0s;}
.menu>li>a:after{content: "";display: block;width: 0px; height: 2px;background: #ffffff;position: absolute;bottom: 0;left: calc(50% - 0px);transition: all 0.5s ease 0s;}
.menu>li>a:hover{}
.menu>li>a:hover:after{width: 16px; left: calc(50% - 8px);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;}
.header-height .menu>li{color:#000000;transition: all 0.5s ease 0s;}
.header-height .menu>li>a{color:#000000;transition: all 0.5s ease 0s;}
.header-height .menu>li>a:after{background: #000000;transition: all 0.5s ease 0s;}
@media screen and (max-width:1024px){
    nav{height: auto;padding:0;}
	#menu{display:none;}
	.slicknav_menu{display:block;padding: 60px 0 0 0; position: fixed;top: 0;left: 0;width: 100%;z-index: 10000;background: rgba(255,255,255,0);box-shadow: 0 0 0 0 rgba(0,0,0,0); transition: all 0.5s ease 0s;}
    .slicknav_menu.show {background: rgba(255, 255, 255, .9);}
    .slicknav_menu.show .slicknav_icon-bar{background-color:#222222;}
    .slicknav_menu-height{height: 60px;background: rgba(255,255,255,1);box-shadow: 0 0 15px 0 rgba(0,0,0,.2);transition: all 0.5s ease 0s;}
    .slicknav_menu-height .slicknav_icon-bar{background-color:#222222;}
}

/** edm輪播 **/
.edm-main{position: relative;height: 100vh;overflow: hidden;}
.edm-main:before{content: "";display: block;width: 100%;height: 100%;position: absolute;top: 0;left: 0;background: rgba(0,0,0,.45);z-index: 9;}
.edm{position: relative;}
.edm .edm-font{writing-mode: vertical-rl;position: absolute;top:0;right:23.6vw;z-index: 10;width: auto;height: 100vh;padding:290px 0 290px 0;}
.edm .edm-font .edm-title{font-size: 24px; color: #ffffff;padding: 0;line-height: 1.6;font-weight: 400;font-family: "Noto Serif TC", serif;margin: 0 0 0 20px;letter-spacing: 5px;max-height: 398px;}
.edm .edm-font .edm-content{font-size: 16px; color: #dddddd;line-height: 2;}
@media screen and (max-width:1024px){
    .edm .edm-font{right:10vw;}
    .edm .edm-font .edm-title{font-size: 20px;margin: 0 0 0 15px;max-height: 344px;}
}
@media screen and (max-height:1024px){
    .edm .edm-font{right:12vw; height: 100vh;padding:150px 0 150px 0;}
}
@media screen and (max-height:768px){
    .edm .edm-font{right:12vw; height: 100vh;padding:100px 0 60px 0;}
}
@media screen and (max-height:600px){
    .edm .edm-font{padding:80px 0 30px 0;}
}

/** 配置 **/
.warpper{overflow: hidden;}
.main{}
.i-title-main{margin: 0 0 25px 0;text-align: center;}
.i-title{font-size: 24px; color: #222222;letter-spacing: 4px;margin: 0 auto;font-weight: 500;line-height: 1.6;font-family: "Noto Serif TC", serif;writing-mode: vertical-rl;background: #ffffff;padding: 20px 9px;width: 56.39px;position: absolute;top: -150px;left: calc(50% - 28.195px + 70px);text-align: center;z-index: 1;}
.i-title02{font-size: 20px; color: #222222;letter-spacing: 2px;padding:15px 0 0 0;margin: 0 0 15px 0;font-weight: 400;line-height: 1.6;font-family: "Noto Serif TC", serif;position: relative;width: 100%;}
.i-title02:before{content: "";display: block;width: 200%;height: 1px ;background: #777777;position: absolute;top: 0;right: -100%;}
.i-title03{font-size: 24px; color: #222222;letter-spacing: 0;padding:0;margin: 0;font-weight: 500;line-height: 1.6;font-family: "Noto Serif TC", serif;position: relative;width: 100%;}
.i-title04{font-size: 14px; color: #222222;letter-spacing: 0;padding:0;margin: 0;font-weight: 500;line-height: 1.6;font-family: "Noto Serif TC", serif;position: relative;width: 100%;}
.more{font-size: 15px; color: #777777;display: flex;justify-content: center;text-align: center;line-height: 1.6;margin: 30px 0 0 0;width: 100%;}
.more a{display: block;color: #777777;padding: 8px 40px ;position: relative;z-index: 1;}
.more a:before{content: "";display: block;width: 100%;height: 100%;border-top: 1px #777777 solid;border-bottom: 1px #777777 solid;position: absolute;top: 0;left: 0;z-index: -1;transition: all 0.5s ease 0s;}
.more a:after{content: "";display: block;width:100%;height: calc(100% + 8px);border-top: 2px #777777 solid;border-bottom: 2px #777777 solid;position: absolute;top: -4px;left: 0;z-index: -1;transition: all 0.5s ease 0s;}
.more a:hover{}
.more a:hover:before{height:calc(100% + 8px);top: -4px;transition: all 0.5s ease 0s;}
.more a:hover:after{height:100%;top: 0;transition: all 0.5s ease 0s;}
.photo-main{overflow: hidden;}
.photo{background-color:#ffffff;background-position: center center;background-repeat: no-repeat;background-size: contain;transform:scale(1);transition: all 0.5s ease 0s;}
@media screen and (max-width:1024px){
    .i-title-main{margin: 0 0 15px 0;}
    .i-title{font-size: 20px;width: 50px;left: calc(50% - 25px);}
    .i-title02{font-size: 18px; }
    .i-title03{font-size: 22px; }
    .i-title04{font-size: 13px;}
}
@media screen and (max-width:767px){
    .i-title{top: -100px;}
}

/** 首頁設備 **/
.i-equipment-main{background: #2b2c14 url("../images/i-bg.png") center;padding: calc(6% + 170px) 15px 6% 155px;position: relative;z-index: 10;line-height: 2.5;}
.i-equipment{max-width: 1350px ;margin: 0 auto;}
.i-equipment{}
.i-equipment .i-equipment-content{text-align: center;color: #ffffff;max-width: 600px;margin: 0 auto;}
.i-equipment .i-equipment-content h3{padding: 0;margin: 0 0 10px 0;line-height: 2;font-weight: 400;font-size: 20px;}
.i-equipment .i-equipment-content .i-equipment-info{font-size: 16px;}
.i-equipment .more{color: #ffffff}
.i-equipment .more a{color: #ffffff;}
.i-equipment .more a:before{border-top: 1px #ffffff solid;border-bottom: 1px #ffffff solid;}
.i-equipment .more a:after{border-top: 2px #ffffff solid;border-bottom: 2px #ffffff solid;}
@media screen and (max-width:1024px){
    .i-equipment-main{padding: calc(40px + 150px) 15px 40px 15px;}
    .i-equipment .i-equipment-content h3{font-size: 18px;}
}
@media screen and (max-width:767px){
    .i-equipment-main{padding: calc(40px + 180px) 15px 40px 15px;}
}

/** 首頁六大特色 **/
.i-features-main{padding: 6% 15px 6% 155px;letter-spacing: 0;}
.i-features{max-width: 1350px; margin: 0 auto;}
.i-features>ul{list-style: none;padding: 0;margin:0;display: flex;flex-wrap: wrap;justify-content: center;}
.i-features>ul>li{display: block;padding: 0;margin: 15px;width: calc(100%/6 - 30px);text-align: center;}
.i-features>ul>li a{display: block;}
.i-features>ul>li a:hover{}
.i-features>ul>li .photo-main{width: 126px;height: 126px;border: 1px #222222 solid;padding: 32px; display: flex;align-items: center;justify-content: center; margin: 0 auto;overflow: hidden;position: relative;z-index: 1;transform:scale(1);border-radius: 500px;transition: all 0.5s ease 0s;}
.i-features>ul>li .photo-main:after{content: "";display: block;width: calc(100% - 16px); height:  calc(100% - 16px);border: 1px #222222 dashed;position: absolute;top: 8px;left: 8px;border-radius: 500px;z-index: -1;transition: all 0.5s ease 0s;}
.i-features>ul>li .photo-main .photo{background-color: transparent;}
.i-features>ul>li h3{padding: 0;margin:15px 0 0 0;line-height: 1.4;font-size: 18px; color: #222222;font-weight: bold;transition: all 0.5s ease 0s;}
.i-features>ul>li h3 span{font-size: 16px; color: #444444;font-weight: normal;display: block;width: 100%;margin: 5px 0 0 0;}
.i-features>ul>li:hover .photo-main{transform:scale(1.1);transition: all 0.5s ease 0s;}
.i-features>ul>li:hover .photo-main:after{border: 1px #eca22e dashed;transition: all 0.5s ease 0s;}
@keyframes photo-after
{
0% {transform:rotate(0deg);}
100%{transform:rotate(-360deg);}
}
@-moz-keyframes photo-after /* Firefox */
{
0% {transform:rotate(0deg);}
100%{transform:rotate(-360deg);}
}
@-webkit-keyframes photo-after /* Safari 和 Chrome */
{
0% {transform:rotate(0deg);}
100%{transform:rotate(-360deg);}
}
@-o-keyframes photo-after /* Opera */
{
0% {transform:rotate(0deg);}
100%{transform:rotate(-360deg);}
}
.i-features>ul>li .photo-main:after{
animation: photo-after linear 8s infinite;
-moz-animation: photo-after linear 8s infinite;	/* Firefox */
-webkit-animation: photo-after linear 8s infinite;	/* Safari 和 Chrome */
-o-animation: photo-after linear 8s infinite;	/* Opera */
}
@keyframes photo-after2
{
    0% {transform:rotate(0deg);}
    100%{transform:rotate(360deg);}
}
@-moz-keyframes photo-after2 /* Firefox */
{
    0% {transform:rotate(0deg);}
    100%{transform:rotate(360deg);}
}
@-webkit-keyframes photo-after2 /* Safari 和 Chrome */
{
    0% {transform:rotate(0deg);}
    100%{transform:rotate(360deg);}
}
@-o-keyframes photo-after2 /* Opera */
{
    0% {transform:rotate(0deg);}
    100%{transform:rotate(360deg);}
}
.i-features>ul>li:nth-child(odd) .photo-main:after{
animation: photo-after2 linear 8s infinite;
-moz-animation: photo-after2 linear 8s infinite;	/* Firefox */
-webkit-animation: photo-after2 linear 8s infinite;	/* Safari 和 Chrome */
-o-animation: photo-after2 linear 8s infinite;	/* Opera */
}
@media screen and (max-width:1350px){
    .i-features>ul>li{width: calc(100%/3 - 30px);}
}
@media screen and (max-width:1024px){
    .i-features-main{padding: 40px 15px;}
    .i-features>ul>li{width: calc(100%/3 - 20px);margin: 10px;}
    .i-features>ul>li h3{font-size: 16px; }
    .i-features>ul>li h3 span{font-size: 14px;}
}
@media screen and (max-width:767px){
    .i-features>ul>li{width: calc(100%/2 - 20px);}
}
@media screen and (max-width:575px){
    .i-features>ul>li .photo-main{width: 116px;height: 116px;padding: 32px;}
    .i-features>ul>li .photo-main:after{width: calc(100% - 16px); height:  calc(100% - 16px);top: 8px;left: 8px;}
}


/** 首頁數據 **/
.i-data-main{padding: 6% 15px 6% 155px;letter-spacing: 0;background: url("../images/data_bg.jpg")no-repeat center fixed;background-size: cover;position: relative;}
.i-data-main:before{content: "";display: block;width: 100%;height: 100%;position: absolute;top: 0;left: 0;background: rgba(0,0,0,.45);z-index: 1;}
.i-data{max-width: 1350px; margin: 0 auto;position: relative;z-index: 2;}
.i-data>ul{list-style: none;padding: 0;margin: 0;display: flex;flex-wrap: wrap;}
.i-data>ul>li{padding:0;margin:15px;width: calc(100%/3 - 30px);display: flex;flex-wrap: wrap;align-content: flex-start;text-align: center;}
.i-data>ul>li .i-data-numb-main{display: flex;align-items: flex-end;justify-content: center; width: 100%;color: #ffffff;position: relative;padding: 0 0 10px 0;margin: 0 0 25px 0;}
.i-data>ul>li .i-data-numb-main:after{content: "";display: block;width: 70px; height: 1px;background: #eca22e;position: absolute;bottom: 0;left: calc(50% - 35px);}
.i-data>ul>li .i-data-numb-main .i-data-numb{font-size: 72px;font-weight: bold;width:auto;line-height: 1.2;}
.i-data>ul>li .i-data-numb-main .i-data-numb-unit{display: inline-block;font-size: 24px;font-weight: bold; padding:0;margin: 0;width: auto;}
.i-data>ul>li .i-data-dep{font-size: 18px; color: #ffffff;font-weight:bold;width: 100%;line-height: 1.6;}
.i-data>ul>li .i-data-dep span{font-size: 16px; font-weight:normal;width: 100%;display: block;margin: 5px 0 0 0;}
@media screen and (max-width:1024px){
    .i-data-main{padding: 40px 15px;background: url("../images/data_bg.jpg")no-repeat center;background-size: cover;}
    .i-data>ul>li{margin:10px;width: calc(100%/3 - 20px);}
    .i-data>ul>li .i-data-numb-main:after{width: 60px;}
    .i-data>ul>li .i-data-numb-main .i-data-numb{font-size: 60px; }
    .i-data>ul>li .i-data-numb-main .i-data-numb-unit{font-size: 20px; }
    .i-data>ul>li .i-data-dep{font-size: 16px;} 
}
@media screen and (max-width:575px){
    .i-data>ul>li{margin: 15px 0; width: calc(100%/1);}
    .i-data>ul>li .i-data-numb-main:after{left: calc(50% - 30px);}
}


/** 首頁關於小青田&專業團隊 **/
.i-about-team{position: relative;padding: 0 0 0 140px;}
.i-about-team .i-title{position: absolute;top: 50%;left: calc(50% + 70px);transform: translate(-50%, -50%);}
@media screen and (max-width:1024px){
    .i-about-team{padding: 0;}
    .i-about-team .i-title{left:50%;}
}

/** 首頁關於小青田 **/
.i-about-main{}
.i-about{display: flex;flex-direction: row-reverse;}
.i-about .i-about-content-main{flex: 1;padding:7% 40px;}
.i-about .i-about-content{max-width: 470px;width: 100%;}
.i-about .i-about-content .i-about-info{font-size: 16px; color: #777777;width: 100%;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 4;-webkit-box-orient: vertical;}
.i-about .i-about-photo{flex: 1.45;}
.i-about .i-about-photo img{width: 100%;height: 100%;object-fit: cover;object-position: center;}
.i-about .i-about-content .more{justify-content: flex-start;}
@media screen and (max-width:1024px){
    .i-about .i-about-content-main{padding:30px 15px 30px 30px;}
}
@media screen and (max-width:767px){
    .i-about{display: block;}
    .i-about .i-about-content-main{flex:initial;padding:30px 15px;}
    .i-about .i-about-content{max-width: inherit;}
    .i-about .i-about-photo{flex:initial;width: 100%;}
}

/** 首頁專業團隊 **/
.i-team-main{}
.i-team-main .i-title02:before{right: inherit;left: -100%;}
.i-team{display: flex;flex-direction: row-reverse;}
.i-team .i-team-content-main{flex: 1;padding:7% 40px;display: flex;justify-content: flex-end;}
.i-team .i-team-content{max-width: 470px;width: 100%;}
.i-team .i-team-content .i-team-info{font-size: 16px; color: #777777;width: 100%;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 4;-webkit-box-orient: vertical;}
.i-team .i-team-photo{flex: 1.45;}
.i-team .i-team-photo img{width: 100%;height: 100%;object-fit: cover;object-position: center;}
.i-team .i-team-content .more{justify-content: flex-start;}
@media screen and (max-width:1024px){
    .i-team .i-team-content-main{padding:30px 30px 30px 15px;}
}
@media screen and (max-width:767px){
    .i-team{display: block;}
    .i-team .i-team-content-main{flex:initial;padding:30px 15px;}
    .i-team .i-team-content{max-width: inherit;}
    .i-team .i-team-photo{flex:initial;width: 100%;}
}

/** 首頁環境介紹 **/
.i-environment-main{padding: 0 0 0 140px;overflow: hidden;}
.i-environment{position: relative;}
.i-environment>ul{list-style: none;padding: 0;margin: 0;display: flex;flex-wrap: wrap;}
.i-environment>ul>li{width: calc(100%/3);padding: 0;margin: 0;}
.i-environment .i-environment-content{background: rgba(0,0,0,.7);position: absolute;bottom: -100%;left: calc(50% - (calc(100%/3)/2));width: calc(100%/3);height: 100%;display: flex;flex-wrap: wrap;align-content: center;justify-content: center;text-align: center;color: #ffffff;padding:30px 5vw;opacity: 0;visibility: hidden; transition: all 0.5s ease 0s;}
.i-environment .i-environment-content h3{padding: 0;margin: 0 0 10px 0;line-height: 2;font-weight: 400;font-size: 24px;width: 100%;}
.i-environment .i-environment-content .i-environment-info{font-size: 16px;width: 100%;}
.i-environment .i-environment-content .more{color: #ffffff;margin: 50px 0 0 0;}
.i-environment .i-environment-content .more a{color: #ffffff;}
.i-environment .i-environment-content .more a:before{border-top: 1px #ffffff solid;border-bottom: 1px #ffffff solid;}
.i-environment .i-environment-content .more a:after{border-top: 2px #ffffff solid;border-bottom: 2px #ffffff solid;}
.i-environment:hover .i-environment-content{bottom: 0;opacity: 1;visibility: visible; transition: all 0.5s ease 0s;}
@media screen and (max-width:1024px){
    .i-environment-main{padding: 0;}
    .i-environment .i-environment-content{padding:25px;}
    .i-environment .i-environment-content h3{font-size: 20px;}
    .i-environment .i-environment-content .more{margin: 30px 0 0 0;}
}
@media screen and (max-width:767px){
    .i-environment>ul>li{width:100%;}
    .i-environment .i-environment-content{opacity: 1;visibility: visible;padding:25px 15px; bottom: calc(50% - (calc(100%/3)/2)); left:0;width:100%;height: calc(100%/3);}
    .i-environment:hover .i-environment-content{bottom: calc(50% - (calc(100%/3)/2));}
}

/** 首頁最新消息 **/
.i-news-main{padding: 6% 15px 6% 155px;letter-spacing: 0;}
.i-news{max-width: 1350px; margin: 0 auto;}
.i-news>ul{list-style:none;padding:0px; margin:20px 0;display: flex;flex-wrap: wrap;}
.i-news>ul>li{padding:0; font-size:16px;width: calc(100%/3 - 20px);margin: 10px;}
.i-news>ul>li a{color:#777777;display:block;padding:0; }
.i-news>ul>li a:hover{color:#eca22e;}
.i-news>ul>li .i-news-content{color:#666666;padding: 15px 0;}
.i-news>ul>li .i-news-content .i-news-date{color:#eca22e;font-size: 14px;padding: 0;margin:0;}
.i-news>ul>li .i-news-content h3{color:#222222;font-size: 18px;padding: 0;margin:5px 0 2px 0;line-height: 1.8;font-weight: 600;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;}
.i-news>ul>li .i-news-content .i-news-info{color:#777777;font-size: 16px;padding: 0;margin: 0;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;}
.i-news>ul>li:hover .photo{transform:scale(1.1);transition: all 0.5s ease 0s;}
@media screen and (max-width:1024px){
	.i-news-main{padding:40px 15px;}
    .i-news>ul{margin: 0;}
}
@media screen and (max-width:767px){
    .i-news>ul>li{width:100%;margin: 10px 0;}
}

/** 首頁影片 **/
.i-video-main{padding: 0 0 0 140px;position: relative;cursor: pointer;}
.i-video-main:before{content: "";display: block;width: 100%;height: 100%;position: absolute;top: 0;left: 0;background: rgba(0,0,0,.5);z-index: 1;}
.i-video{}
.i-video .i-video-photo{}
.i-video .i-video-btn{background: rgba(255,0,51,0); position: absolute;top: calc(50% - 3.125vw);left: calc(50% - 3.125vw + 70px);border: 2px #ffffff solid;border-radius: 50%;width: 6.25vw;height: 6.25vw;z-index: 2;transition: all 0.5s ease 0s;}
.i-video .i-video-btn:after{content: "";display: block;width: 0;height: 0;border-style: solid;border-width: 1.2vw 0 1.2vw 2.5vw;border-color: transparent transparent transparent #ffffff;position: absolute;top: calc(50% - 1.2vw);left: calc(50% - 1.25vw + .3vw);transition: all 0.5s ease 0s;}
.i-video-main:hover .i-video .i-video-btn{background: rgba(255,0,51,.5); top: calc(50% - 3.3855vw);left: calc(50% - 3.3855vw + 70px);width: 6.771vw;height: 6.771vw;transition: all 0.5s ease 0s;}
.i-video-main:hover .i-video .i-video-btn:after{border-width: 1.35vw 0 1.35vw 2.7vw;top: calc(50% - 1.35vw);left: calc(50% - 1.35vw + .3vw);transition: all 0.5s ease 0s;}
.modal-open {overflow: hidden;}
.i-video-modal {display: none;position: fixed;z-index: 10000;left: 0; top: 0;width: 100%; height: 100%;background-color: rgba(0,0,0,.8);}
.i-video-content-main {display: flex;align-items: center;justify-content: center;width: 100%; height: 100%;}
.i-video-content {position: relative;margin:6vw auto;padding: 0;width:calc(100% - 12vw);background-color: #000000;border-radius:0;overflow: hidden;}
.close {position: absolute;top: 10px;right: 16px;font-size: 40px;font-weight: bold;color: #ffffff;cursor: pointer;}
.close:hover {color: #eca22e;}
.i-video-modal .i-video-info{position: relative;width: 100%;padding-bottom: 46%;height: 0;overflow: hidden;}
.i-video-modal .i-video-info iframe {position: absolute;top:0;left: 0;width: 100%;height: 100%;border: 0;}
@media screen and (max-width:1024px){
    .i-video-main{padding: 0;}
    .i-video .i-video-btn{top: calc(50% - 35px);left: calc(50% - 35px);width:70px;height:70px;}
    .i-video .i-video-btn:after{border-width: 15px 0 15px 30px;top: calc(50% - 15px);left: calc(50% - 15px + 4px);}
    .i-video-main:hover .i-video .i-video-btn{top: calc(50% - 38px);left: calc(50% - 38px);width:76px;height:76px;}
    .i-video-main:hover .i-video .i-video-btn:after{border-width: 17px 0 17px 34px;top: calc(50% - 17px);left: calc(50% - 17px + 4px);}
    .i-video-content {margin:15px auto;padding: 0;width:calc(100% - 30px);}
    .i-video-modal .i-video-info{padding-bottom: 56.2%;}
}
@media screen and (max-width:575px){
    .i-video .i-video-btn{top: calc(50% - 25px);left: calc(50% - 25px);width:50px;height:50px;}
    .i-video .i-video-btn:after{border-width: 10px 0 10px 20px;top: calc(50% - 10px);left: calc(50% - 10px + 2px);}
    .i-video-main:hover .i-video .i-video-btn{top: calc(50% - 28px);left: calc(50% - 28px);width:56px;height:56px;}
    .i-video-main:hover .i-video .i-video-btn:after{border-width: 12px 0 12px 24px;top: calc(50% - 12px);left: calc(50% - 12px + 2px);}
}

/** 內頁banner **/
.inside-banner{background-color:#ffffff;background-position: center;background-repeat: no-repeat;background-size:cover;height: 100vh;position: relative;padding:0 0 0 140px;}
.inside-banner:before{content: "";display: block;width: 100%;height: 100%;position: absolute;top: 0;left: 0;background: rgba(0,0,0,.45);z-index: 1;}
.inside-banner .banner-title-main{width: 100%;height: 100%; margin: 0; padding:0;position: relative;z-index: 2;display: flex;align-items: center;justify-content: center;}
.inside-banner .banner-title-main:after{content: "";display: block;width: 1px; height:calc(50% - 60px);background: #ffffff; position: absolute;bottom: 0;left: calc(50% - .5px);animation:banner-line 1s 1 ease-out;}
.inside-banner .banner-title{font-size:34px;color:#ffffff;font-family: "Noto Serif TC", serif; margin:0; padding:0;text-shadow: 1px 1px 5px rgba(0,0,0,.3);letter-spacing: 12px; writing-mode: vertical-rl;line-height: 2;font-weight: 400;}
@keyframes banner-line{
      0%{
          height:calc(50% - 50%);
      }
      100%{
          height:calc(50% - 60px);
      }
  }
@media screen and (max-width:1024px){
	.inside-banner{height: 50vh; padding:60px 0 0 0;}
    .inside-banner .banner-title-main:after{height:calc(50% - 40px);}
    .inside-banner .banner-title{font-size:24px;}
@keyframes banner-line{
      0%{
          height:calc(50% - 50%);
      }
      100%{
          height:calc(50% - 40px);
      }
  }
}
@media screen and (max-width:767px){
	.inside-banner{height: 28vh;}
}

/** Breadcrumb **/
.breadcrumb{display:flex; flex-wrap:wrap; width:100%; max-width:1350px; 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{padding:5vw 15px 5vw 155px;position: relative;}
.content-body-main02{padding:0 0 5vw 140px;}
.content-body-main03{padding:0 0 0 140px;}
.content-body-main04{padding:0 15px 5vw 155px;}
.content-body-main:after{content: "";display: block;width: 1px; height: 4vw; background: #222222;position: absolute;top:0;left: calc(50% - .5px + 70px);}
.content-body-main02:after{display: none;}
.content-body-main03:after{display: none;}
.content-body-main04:after{display: none;}
.content-body{max-width:1350px; margin:0 auto; }
.page-title{font-size:24px;color:#222222;font-family: "Noto Serif TC", serif; margin:0 0 10px 0; padding:0;position: relative;line-height: 2;font-weight: 400;text-align: center;width: 100%;}
.page-main{padding:0; font-size:16px; color:#777777;}
.page-main a{color:#eca22e;}
.page-main a:hover{color: #a8ab4f;}
.content-title{font-size:24px;color:#222222;font-family: "Noto Serif TC", serif; margin:0 0 10px 0; padding:0;position: relative;line-height: 2;font-weight: 400;text-align: center;width: 100%;}
.content-title02{font-size:22px;color:#222222;font-family: "Noto Serif TC", serif; margin:30px 0 10px 0; padding:10px 0 0 0;position: relative;line-height: 2;font-weight: 400;width: 100%;}
.content-title02:before{content: "";display: block;width: 100%;height: 1px ;background: #777777;position: absolute;top: 0;right: 0%;}
.content-title02:first-of-type{ margin:0 0 10px 0;}
.content-title02-left:before{width:200%;left: -100%;right: inherit;}
.content-title02-right:before{width:200%;right: -100%;left: inherit;}
@media screen and (max-width:1024px){
    .page-title{font-size:20px;}
	.content-body-main{padding:40px 15px;}
    .content-body-main:after{left: calc(50% - .5px);}
	.content-body-main02{padding:0 15px 40px 15px;}
	.content-body-main03{padding:0 15px;}
	.content-body-main04{padding:0 15px 40px 15px;}
    .content-title{font-size:20px;}
    .content-title02{font-size:18px;}
}

/** 左邊分類 **/
.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>ul{margin:0; padding:0; list-style:none;}
.in-left-menu>ul>li{border-bottom:1px #fff solid; font-size:16px; color:#666; padding:0;}
.in-left-menu>ul>li>a{background:#f4f8fb; color:#333; border-left:3px #5f5f5f solid; display:block; padding:10px 5px 10px 25px; line-height:1.5em;}
.in-left-menu>ul>li>a:hover{background-color:#e9ecef; border-left:3px #111111 solid;}
.in-left-menu>ul>li>.current{background:url(../images/left-icon.png) no-repeat 7px 13px #e9ecef; border-left:3px #111111 solid;}
.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:575px){
	.classBox{padding:0 0 20px 0;}
	ul.classLink{display:none;}
	.m_classLink{display:block; position:relative; background-color:#eeeeee; border:1px solid #d1d1d1;}
	.m_classLink a.main{display:block; background:none; font-size:16px; font-family:"Microsoft JhengHei", "新細明體", sans-serif; color:#333; position:relative; padding:8px;}
	.m_classLink a.main i{display:block; font-size:16px; background:#afafaf; width:45px; height:100%; text-align:center; color:#FFF; line-height:40px; position:absolute; right:0; top:0;}
	.m_classLink ul{display:none; margin:0; padding:0; list-style:none; width:100%; background:#FFF; border:1px solid #d1d1d1; position:absolute; left:0; top:100%; z-index:99; box-sizing:border-box;}
	.m_classLink ul li{margin:0; padding:0;}
	.m_classLink ul li a{display:block; padding:8px; border-top:1px solid #d1d1d1; font-family:"Microsoft JhengHei", "新細明體", sans-serif; font-size:16px; color:#222;}
	.m_classLink ul li:first-child a{border:none;}
	.m_classLink ul li a:hover{background:#efeded;}
	.m_classLink ul li ul{display:block; margin:0 10px 10px 10px; padding:0; list-style:none; width:calc(100% - 20px); background:#FFF; border:1px solid #d1d1d1; position:inherit; left:inherit; top:inherit; z-index:999; box-sizing:border-box;}
	.left-menu-title{display:none;}
	.left-beautify{display:none;}
}

/** 起點 **/
.about{display: flex;}
.about .about-content{flex: 1;display: flex;align-items:flex-end;}
.about .about-info{max-width: 688px;padding:0 15px;width: 100%;}
.about .about-photo{flex: 1;display: flex;margin: 0 5px 0 0;}
.about .about-photo .about-photo001-01{flex: 1;margin: 0 20px 0 0;}
.about .about-photo .about-photo001-02{flex: 1;margin: 0 20px 0 0;}
.about-dep{background: #f9f9f9;padding:4% 15px;margin:0;text-align: center;color: #222222;position: relative;z-index: 1;}
.about-dep:after{content: "";display: block;width: 200%;height: 100%; background: #f9f9f9;position: absolute;top: 0;left: -50%;z-index: -1;}
@media screen and (max-width:1024px){
	.about{display: block;}
    .about .about-content{flex:initial;width: 100%;}
    .about .about-info{max-width: inherit; padding:0;}
    .about .about-photo{flex:initial;width: 100%;margin: 0 0 20px 0;}
    .about .about-photo .about-photo001-01{margin: 0 20px 0 0;}
    .about .about-photo .about-photo001-02{margin: 0;}
    .about-dep{padding:25px 0;}
}
@media screen and (max-width:575px){
	.about .about-photo .about-photo001-01{margin: 0 10px 0 0;}
}

/** 守護 **/
.team{display: flex;flex-wrap: wrap; margin:0 0 5vw 0;}
.team .team-photo{flex: 2;display: flex;}
.team .team-content{flex: 1;padding: 20px;}
.team .team-content>ul{list-style: none;padding: 0;margin: 0;width: 100%;}
.team .team-content>ul:first-of-type{margin: 0 0 30px 0;}
.team .team-content>ul>li{padding:0 0 0 25px;margin: 0;position: relative;}
.team .team-content>ul>li:after{content: "";display: block;width: 4px; height: 4px; background: #777777;position: absolute;top: 14px;left: 10px;}
.team .team-photo01{flex: 1;margin: 0 20px 0 0;}
.team .team-photo02{flex: 1;margin: 0 20px 0 0;}
@media screen and (max-width:1350px){
    .team .team-photo{flex: initial;width: 100%;margin: 0 0 20px 0;}
    .team .team-photo01{flex: initial;width: 100%; margin: 0 10px 0 0;}
    .team .team-photo02{flex: initial;width: 100%; margin:0 0 0 10px;}
}
@media screen and (max-width:1024px){
    .team{margin:0 0 30px 0;display: block;}
    .team .team-content{padding: 15px 0;flex: initial;width: 100%;}
}
@media screen and (max-width:575px){
    .team .team-photo{display:block;}
    .team .team-photo01{flex: initial;width: 100%;margin:0 0 20px 0;}
    .team .team-photo02{flex: initial;width: 100%; margin:0;}
}

/** 醫師團隊 **/
.doctor{}
.doctor>ul{list-style: none;padding: 0;margin: 0;display: flex;flex-wrap: wrap;}
.doctor>ul>li{width: calc(100%/3 - 30px);padding: 0;margin: 15px;}
.doctor>ul>li a{display: block;}
.doctor>ul>li a:hover{}
.doctor>ul>li .doctor-content{display: block;margin: -25px 15px 15px 15px;}
.doctor>ul>li .doctor-content h3{display: table;font-size: 20px;color: #222222;font-family: "Noto Serif TC", serif;margin:0 0 10px 0;padding:5px 15px;position: relative;font-weight: 500;width:auto;background: rgba(255,255,255,.9);line-height: 2;box-shadow: 0 0 0 0 rgba(0,0,0,0); transition: all 0.5s ease 0s;}
.doctor>ul>li .doctor-content .doctor-info{flex: 1; font-size: 16px;color: #444444;margin: 0 ;padding: 0 15px;line-height: 1.8;}
.doctor>ul>li:hover .doctor-content{transition: all 0.5s ease 0s;}
.doctor>ul>li:hover .doctor-content h3{box-shadow: 0 0 15px 0 rgba(0,0,0,.2); transition: all 0.5s ease 0s;}
.doctor>ul>li:hover .photo{transform:scale(1.1);transition: all 0.5s ease 0s;}
@media screen and (max-width:1024px){
    .doctor>ul>li{width: calc(100%/3 - 20px);margin: 10px;}
    .doctor>ul>li .doctor-content{display:block;margin: -23px 15px 15px 15px;}
    .doctor>ul>li .doctor-content h3{font-size: 18px;}
    .doctor>ul>li .doctor-content .doctor-info{font-size: 15px;}
}
@media screen and (max-width:767px){
    .doctor>ul>li{width: calc(100%/2 - 20px);}
}
@media screen and (max-width:575px){
    .doctor>ul>li{width:100%;margin: 10px 0;}
}

/** 醫師團隊明細 **/
.doctor-detail{margin: 0 0 5vw 0 ;display: flex;}
.doctor-detail-title{font-size:18px;color:#222222;font-family: "Noto Serif TC", serif; margin:30px 0 10px 0; padding:0;position: relative;line-height: 2;font-weight: 400;width: 100%;}
.doctor-detail-title:first-of-type{margin:0 0 10px 0;}
.doctor-detail .doctor-detail-photo{flex: 1;margin: 0 20px 0 0;}
.doctor-detail .doctor-detail-content{display: flex;flex-wrap: wrap;align-content: flex-start; flex: 3;padding: 20px 0;}
.doctor-detail .doctor-detail-content .doctor-detail-info{margin: 15px ; width: calc(100%/2 - 30px);}
.doctor-detail .doctor-detail-content .doctor-detail-info>ul{list-style: none;padding: 0;margin: 0;width: 100%;}
.doctor-detail .doctor-detail-content .doctor-detail-info>ul>li{padding:0 0 0 22px;margin:0;position: relative;}
.doctor-detail .doctor-detail-content .doctor-detail-info>ul>li:after{content: "";display: block;width: 4px; height: 4px; background: #777777;position: absolute;top: 14px;left: 6px;}
@media screen and (max-width:1350px){
    .doctor-detail .doctor-detail-photo{flex: 1.6;}
}
@media screen and (max-width:1024px){
    .doctor-detail{margin: 0 0 30px 0 ;display: block;}
    .doctor-detail-title{font-size:17px;margin:20px 0 10px 0; }
    .doctor-detail .doctor-detail-photo{flex: initial;width: 100%; margin:0 auto 20px auto;max-width: 400px;}
    .doctor-detail .doctor-detail-content{padding:15px 0;flex: initial;width: 100%;}
}
@media screen and (max-width:767px){
    .doctor-detail .doctor-detail-content .doctor-detail-info{margin: 10px 0; width: 100%;}
}

/** 境界 **/
.environment-main{display: flex;}
.environment{display: flex;flex-wrap: wrap; margin:0 0 5vw 0;flex: 1;}
.environment .environment-photo{flex: 2.25;margin: 0 0 0 20px;}
.environment .environment-content{flex: 1;padding: 20px;}
.environment .environment-content02{flex: 2;}
.environment .environment-content>ul{list-style: none;padding: 0;margin: 0;width: 100%;}
.environment .environment-content>ul>li{padding:0 0 0 25px;margin: 0;position: relative;}
.environment .environment-content>ul>li:after{content: "";display: block;width: 4px; height: 4px; background: #777777;position: absolute;top: 14px;left: 10px;}
.environment .environment-content-right{text-align: right;}
.environment .environment-content-right>ul>li{padding:0 25px 0 0;}
.environment .environment-content-right>ul>li:after{left: inherit;right: 10px;}
.environment .environment-photo02{flex: 1;margin: 0 0 0 20px;}
.environment .environment-photo03{flex: 2.25;margin: 0 20px 0 0;}
.environment .environment-photo04{flex: 1;margin: 0 20px 0 0;}
.environment .environment-photo05{flex: 2.25;margin: 0 0 0 20px;}
.environment .environment-photo06{flex: 2;margin: 0 10px 0 20px;}
.environment .environment-photo07{flex: 2;margin: 0 20px 0 10px;}
@media screen and (max-width:1350px){
	.environment-main{display: block;}
    .environment{flex: initial;width: 100%;}
    .environment .environment-photo05{flex:initial;width: 100%; margin:20px 0 0 0;}
    .environment .environment-photo06{flex: 2;margin: 0 0 0 20px;}
    .environment .environment-photo07{flex: 2;margin: 0 20px 0 0;}
}
@media screen and (max-width:1024px){
    .environment{margin:0 0 30px 0;}
    .environment .environment-content{padding: 15px 0;}
    .environment .environment-photo03{flex:initial;width: 100%; margin:0 0 20px 0;}
}
@media screen and (max-width:767px){
    .environment .environment-photo{flex: 1.5;}
    .environment .environment-photo02{flex:initial;width: 100%; margin:20px 0 0 0;}
    .environment .environment-photo06{flex: 1.5;}
    .environment .environment-photo07{flex: 1.5;}
}
@media screen and (max-width:575px){
    .environment{display:block;}
    .environment .environment-content{text-align: center;}
    .environment .environment-content>ul>li{padding:0;}
    .environment .environment-content>ul>li:after{display: none;}
    .environment .environment-content-right{text-align: center;}
    .environment .environment-photo{margin: 10px 0;}
    .environment .environment-photo02{margin: 10px 0;}
    .environment .environment-photo03{margin: 10px 0;}
    .environment .environment-photo04{margin: 10px 0;}
    .environment .environment-photo05{margin: 10px 0;}
    .environment .environment-photo06{margin: 10px 0;}
    .environment .environment-photo07{margin: 10px 0;}
}

/** 安居-房型 **/
.room{}
.room>ul{list-style: none;padding: 0;margin: 0;display: flex;flex-wrap: wrap;}
.room>ul>li{width: calc(100%/4 - 30px);padding: 0;margin: 15px;position: relative;}
.room>ul>li a{display: block;}
.room>ul>li a:hover{}
.room>ul>li .room-content{position: absolute;bottom: 0;right: 0;width: 100%;height: 100%;display: flex;align-items:flex-start;justify-content: flex-start;background: rgba(255,255,255,0);transition: all 0.5s ease 0s;}
.room>ul>li .room-content h3{font-size: 20px;color: #222222;font-family: "Noto Serif TC", serif;text-align: center; margin:0;padding:25px 10px;position: relative;font-weight: 500;width:auto;height: 100%; background: rgba(255,255,255,.9);writing-mode: vertical-rl;line-height: 2;letter-spacing: 4px; transition: all 0.5s ease 0s;}
.room>ul>li .room-content h3 span{font-size: 16px;color: #222222;display:inline-block;writing-mode: horizontal-tb;letter-spacing: 0px; }
.room>ul>li:hover .room-content{background: rgba(255,255,255,.7); align-items: center;justify-content: center;transition: all 0.5s ease 0s;}
.room>ul>li:hover .room-content h3{height:auto;background: rgba(255,255,255,0);writing-mode: horizontal-tb;transition: all 0.5s ease 0s;}
.room>ul>li:hover .photo{filter: blur(3px);transform:scale(1.1);transition: all 0.5s ease 0s;}
@media screen and (max-width:1350px){
    .room>ul>li{width: calc(100%/2 - 30px);}
}
@media screen and (max-width:1024px){
    .room>ul>li{width: calc(100%/2 - 20px);margin: 10px;}
    .room>ul>li .room-content h3{font-size: 18px;letter-spacing: 2px;}
    .room>ul>li .room-content h3 span{font-size: 14px;}
}
@media screen and (max-width:767px){
    .room>ul>li{width: 100%;margin: 10px 0;}
}

/** 房型明細 **/
.room-detail{display: flex;}
.room-detail .room-detail-content{flex: 1;display: flex;align-items:flex-end;}
.room-detail .room-detail-info{max-width: 550px;padding:20px 15px;width: 100%;}
.room-detail .room-detail-info>ul{list-style: none;padding: 0;margin: 0;width: 100%;}
.room-detail .room-detail-info>ul>li{padding:0 0 0 25px;margin: 0;position: relative;}
.room-detail .room-detail-info>ul>li:after{content: "";display: block;width: 4px; height: 4px; background: #777777;position: absolute;top: 14px;left: 10px;}
.room-detail .room-detail-photo{flex: 1.3;margin:0 25px 0 0;}
.room-detail .room-detail-photo02{flex: 1.3;margin:0 0 0 25px;}
@media screen and (max-width:1350px){
	.room-detail{display: block;}
    .room-detail .room-detail-content{flex:initial;width: 100%;}
    .room-detail .room-detail-info{max-width: inherit;padding:20px;}
    .room-detail .room-detail-photo{flex:initial;width: 100%;margin: 0;}
    .room-detail .room-detail-photo02{flex:initial;width: 100%;margin: 0;}
    .room-detail .room-detail-photo-margin{margin: 20px 0 0 0;}
}
@media screen and (max-width:1024px){
    .room-detail .room-detail-info{padding:20px 0;}
}

/** 安居-膳食 **/
.meals{display: flex;}
.meals .meals-content{flex: 1;display: flex;align-items:flex-end;justify-content: flex-end;}
.meals .meals-info{max-width: 584px;padding:20px 15px;width: 100%;}
.meals .meals-info>ul{list-style: none;padding: 0;margin: 0;width: 100%;}
.meals .meals-info>ul>li{padding:0 0 0 25px;margin: 0;position: relative;}
.meals .meals-info>ul>li:after{content: "";display: block;width: 4px; height: 4px; background: #777777;position: absolute;top: 14px;left: 10px;}
.meals .meals-photo{flex: 1.2;margin:0 25px 0 0;}
.meals .meals-photo02{flex: 1.2;margin:0 0 0 25px;}
.meals-list{margin: 5vw 0 0 0;}
.meals-list>ul{list-style: none;padding: 0;margin: 0;display: flex;flex-wrap: wrap;}
.meals-list>ul>li{padding: 0;margin: 0;width: calc(100%/2);display: flex;align-items: flex-start;}
.meals-list>ul>li .meals-title{font-size: 22px;color: #222222;font-family: "Noto Serif TC", serif;margin:30px -30px 0 30px;padding:25px 5px;position: relative;line-height: 2;font-weight: 400;writing-mode: vertical-rl;width: auto;background:#ffffff;box-shadow: 0 0 15px 0 rgba(0,0,0,.2);z-index: 1;}
.meals-list>ul>li .meals-content{flex: 1;}
.meals-list>ul>li .meals-content>ul{list-style: none;padding: 0;margin: 0;display: flex;flex-wrap: wrap;}
.meals-list>ul>li .meals-content>ul>li{padding: 0;margin: 10px 0 10px 10px;width: calc(100%/2 - 10px);}
@media screen and (max-width:1350px){
	.meals{display: block;}
    .meals .meals-content{flex:initial;width: 100%;}
    .meals .meals-info{max-width: inherit;padding:20px;}
    .meals .meals-photo{flex:initial;width: 100%;margin: 0;}
    .meals .meals-photo02{flex:initial;width: 100%;margin: 0;}
    .meals-list>ul>li{width:100%;}
    .meals-list>ul>li .meals-title{margin:30px -30px 0 20px;}
}
@media screen and (max-width:1024px){
    .meals .meals-info{padding:20px 0;}
    .meals-list{margin: 40px 0 0 0;}
    .meals-list>ul>li .meals-title{font-size: 18px;margin:30px -30px 0 0;}
}
@media screen and (max-width:575px){
	.meals-list>ul>li .meals-title{margin:15px -30px 0 0;padding:15px 0px;}
}

/** 樂學 **/
.learning{display: flex;}
.learning .learning-content{flex: 1;display: flex;align-items:flex-end;}
.learning .learning-info{max-width: 584px;padding:20px 15px;width: 100%;}
.learning .learning-info>ul{list-style: none;padding: 0;margin: 0;width: 100%;}
.learning .learning-info>ul>li{padding:0 0 0 25px;margin: 0;position: relative;}
.learning .learning-info>ul>li:after{content: "";display: block;width: 4px; height: 4px; background: #777777;position: absolute;top: 14px;left: 10px;}
.learning .learning-photo{flex: 1.2;margin:0 25px 0 0;}
@media screen and (max-width:1350px){
	.learning{display: block;}
    .learning .learning-content{flex:initial;width: 100%;}
    .learning .learning-info{max-width: inherit; padding:20px;}
    .learning .learning-photo{flex:initial;width: 100%;margin: 0;}
}
@media screen and (max-width:1024px){
    .learning .learning-info{padding:20px 0;}
}

/** 新知 **/
.news{letter-spacing: 0;}
.news>ul{list-style:none;padding:0; margin:0;display: flex;flex-wrap: wrap;}
.news>ul>li{padding:0; font-size:16px;width: calc(100%/3 - 20px);margin: 10px;}
.news>ul>li a{color:#777777;display:block;padding:0;}
.news>ul>li a:hover{color:#eca22e;}
.news>ul>li .news-content{color:#666666;padding: 15px 0;}
.news>ul>li .news-content .news-date{color:#eca22e;font-size: 14px;padding: 0;margin:0;}
.news>ul>li .news-content h3{color:#222222;font-size: 18px;padding: 0;margin:5px 0 2px 0;line-height: 1.8;font-weight: 600;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;}
.news>ul>li .news-content .news-info{color:#777777;font-size: 16px;padding: 0;margin: 0;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;}
.news>ul>li:hover .photo{transform:scale(1.1);transition: all 0.5s ease 0s;}
.news-detail-date{background:#eca22e;color: #ffffff; font-size: 14px;padding:5px 20px;margin:10px auto;text-align: center;display: table;border-radius: 3px;letter-spacing: 0;}
@media screen and (max-width:1024px){
    .news-detail-date{padding:4px 15px;}
}
@media screen and (max-width:767px){
    .news>ul>li{width: calc(100%/2 - 20px);}
}
@media screen and (max-width:575px){
    .news>ul>li{width:100%;margin: 10px 0;}
}

/** 好評 **/
.evaluate{}
.evaluate>ul {list-style: none;padding: 0;margin: 0;column-count: 2;column-gap:0;} 
.evaluate>ul>li {counter-increment: num;page-break-inside: avoid;padding:0;margin:0 15px 30px 15px;border: 1px #dddddd solid;border-radius: 20px;overflow: hidden;}
.evaluate>ul>li:before {font-size: 48px;font-weight: bold;background: #eda12f;color: #ffffff; content: counter(num, decimal-leading-zero);display: inline-block;padding: 15px 30px;border-radius:0 0 20px 0;line-height: 1.4;}
.evaluate>ul>li .evaluate-content {padding: 30px;}
.evaluate>ul>li .evaluate-content h3 {font-family: "Noto Serif TC", serif; color:#222222;font-size: 18px;padding: 0;margin:0 0 5px 0;line-height: 1.8;font-weight:500;}
.evaluate>ul>li .evaluate-content .evaluate-info {color:#777777;font-size: 16px;padding: 0;margin: 0;}
@media screen and (max-width:1024px){
    .evaluate>ul>li {margin:0 10px 20px 10px;}
    .evaluate>ul>li:before {font-size: 36px;padding: 10px 20px;}
    .evaluate>ul>li .evaluate-content {padding: 20px;}
}
@media screen and (max-width:767px){
    .evaluate>ul {column-count: 1;} 
    .evaluate>ul>li {margin:0 0 20px 0;}
    .evaluate>ul>li:before {padding: 10px 15px;}
    .evaluate>ul>li .evaluate-content {padding: 15px;}
}

/** 聯絡我們 **/
.contact-body{}
.contact-note{padding:0;font-size:14px; color:#eda12f;margin: 0 0 5px 0;}
.contact-main{display: flex;}
.contact-form{flex: 1;padding: 0 15px;}
.contact{flex: 1;padding: 0 15px;}
.googlemap{position: relative;padding-bottom: 40%;padding-top: 30px;height: 0;overflow: hidden;margin: 30px 0;}
.googlemap iframe {position: absolute;top:0;left: 0;width: 100%;height: 100%;}
.contact-content{}
.contact-content>ul{list-style: none;padding: 0;margin: 0;}
.contact-content>ul>li{padding: 0;margin:10px 0;display: flex;font-size: 14px; color: #777777;}
.contact-content>ul>li .contact-icon{width: 18px;height: 18px;display: flex;align-items: center;justify-content: center; margin: 6px 10px 6px 0;}
.contact-content>ul>li .contact-icon img{filter: brightness(1);}
.contact-content>ul>li .contact-info{flex: 1;padding: 0;}
.contact-content>ul>li .contact-info span{font-family: "Noto Serif TC", serif; color: #222222;}
.contact-content>ul>li .contact-info a{display: inline-block;color: #777777;}
.contact-content>ul>li .contact-info a:hover{color: #eca22e;}
.contact-qrcode{}
.contact-qrcode>ul{list-style: none;padding: 0;margin: 0;display: flex;flex-wrap: wrap;}
.contact-qrcode>ul>li{padding: 0;margin: 10px;width: calc(100%/4 - 20px);text-align: center;}
.contact-qrcode>ul>li .qrcode{border: 1px #dddddd solid;overflow: hidden;}
.contact-qrcode>ul>li .qrcode img{btransform:scale(1);transition: all 0.5s ease 0s;}
.contact-qrcode>ul>li .qrcode-note{font-size: 14px; color: #222222;text-align: center;padding: 0;margin: 10px 0 0 0;letter-spacing: 0;line-height: 1.6;}
.contact-qrcode>ul>li .qrcode-title{font-size: 14px; color: #777777;text-align: center;padding: 0;margin: 5px 0 0 0;letter-spacing: 0;line-height: 1.6;}
.contact-qrcode>ul>li a{display: block;}
.contact-qrcode>ul>li a:hover{}
.contact-qrcode>ul>li:hover .qrcode img{transform:scale(1.05);transition: all 0.5s ease 0s;}
.reservation-photo{margin: 30px 0 0 0;}
.reservation-photo>ul{list-style: none;padding: 0;margin: 0;display: flex;flex-wrap: wrap;}
.reservation-photo>ul>li{padding: 0;margin: 10px 10px 10px 0;width: calc(100%/2 - 10px);text-align: center;}
.reservation-photo>ul>li:nth-child(2n){margin: 10px 0 10px 10px;}
@media screen and (max-width:1350px){
	.contact-qrcode>ul>li{width: calc(100%/3 - 10px);margin: 5px;}
    .reservation-photo>ul>li{margin: 5px 5px 5px 0;width: calc(100%/2 - 5px);}
    .reservation-photo>ul>li:nth-child(2n){margin: 5px 0 5px 5px;}
}
@media screen and (max-width:1024px){
    .contact-main{display: block;}
    .contact-form{flex: initial;width: 100%; padding: 0;}
    .contact{flex: initial;width: 100%; padding: 0;margin: 40px 0 0 0;}
    .contact-qrcode>ul{justify-content: center;}
    .contact-qrcode>ul>li{width: calc(100%/5 - 10px);margin: 5px;}
}
@media screen and (max-width:767px){
    .contact-qrcode>ul>li{width: calc(100%/4 - 10px);margin: 5px;}
}
@media screen and (max-width:575px){
    .contact-qrcode>ul>li{width: calc(100%/3 - 10px);margin: 5px;}
}

/** 表單欄位 **/
.star{color: #ff0000;font-size: 14px;padding: 0 5px;}
label{min-width: 100px;}
.form-box input, .form-box img{vertical-align:middle;}
.opinion-main{display:flex; flex-wrap:wrap;width: 100%;}
.opinion{flex: 1; display:flex; flex-wrap:wrap; margin:0;padding: 10px 0; overflow:hidden;}
.opinion-left01{width: 100%; padding:0 0 10px 0; font-size:16px;font-family: "Noto Serif TC", serif; color:#222222; display:flex; align-items:center;font-weight: 500;}
.input-main-style01{background: #f9f9f9; flex:1; width:100%; border:0;border-bottom: 1px #dddddd solid;margin:0; padding:10px 15px;font-size:16px; color:#222222;  min-height:53px;}
.input-main-style02{background: #f9f9f9; flex:1; width:100%; border:0;border-bottom: 1px #dddddd solid; margin:0; padding:10px 15px; font-size:16px; color:#222222;  min-height:53px;}
.input-main-style03{background: #f9f9f9; width:100%; border:0;border-bottom: 1px #dddddd solid; margin:5px 0 0 0; padding:10px 15px; font-size:16px;  color:#222222;  min-height:53px;}
.input-main-style04{background: #f9f9f9; flex:1; width:100%; border:0;margin:0; padding:10px 0;font-size:16px;  color:#222222;  min-height:53px;}
.input-main-style05{background: #f1f1f1; flex:1; width:100%; border:0;margin:5px 0; padding:10px 15px;font-size:15px; color:#444444;  min-height:53px;}
.input-main-select{background:none; flex:1; width:100%; border:0; margin:0; padding:0; font-size:16px;color:#222222; display:flex; flex-wrap:wrap;}
.input-main-select select{flex: 1; margin:0; font-size:16px; color:#222222;  min-height:53px;appearance:none;-moz-appearance:none;-webkit-appearance:none;background:#f9f9f9 url("../images/select-icon.svg")no-repeat right 10px center;background-size: 10px;padding: 10px 35px 10px 15px;border: 0; border-bottom: 1px #dddddd solid;}
.select-style{background:#8a6e0c; font-size:16px; color:#f9f9f9; line-height:20px; padding:5px 10px; border:0;}
.input-style01{background:#f4f8fb; flex:1; width:100%; border:0; margin:0; padding:5px 15px; font-size:16px; color:#222222;  min-height:53px;}
input:disabled{background-color:#fff; color:#2d7fb9; cursor:no-drop;}
.btn.openlink{margin:3px 0; padding:0 10px; text-align:center; font-size:16px; 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:53px; margin:0; vertical-align:middle; display:inline-block;}
.pay-main{padding:0;font-size: 16px; 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-style05:focus, .input-main-select select:focus{border-bottom: 1px #eda12f solid;background: #ffffff;}
input[type="checkbox"] {display:none;}
input[type="checkbox"] + label {width:100%;display: block;padding: 0;}
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;background-size: 76px;cursor:pointer;}
input[type="checkbox"]:checked + label span {background: url(../images/input-button.png) -19px top no-repeat;background-size: 76px;}
input[type="radio"] {display:none;}
input[type="radio"] + label {width:100%;display:block;padding: 0 ;}
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;background-size: 76px;cursor:pointer;}
input[type="radio"]:checked + label span {background:url(../images/input-button.png) -57px top no-repeat;background-size: 76px;}
.input-main-style05 input[type="radio"] + label {width:auto;display:inline-block;}
@media screen and (max-width:767px){
    .opinion-main{display:block;}
	.opinion{display:block;}
	.opinion-left01{width:100%;}
	.input-main-style02{width:calc(100% - 107px); display:inline-block;}
}

/** 按鈕 **/
.cart-btn{padding:0; text-align:center; margin-top:20px; display:flex; flex-wrap:wrap; justify-content:center; align-items:center;}
.btn-send{font-size:13px;}
a.btn-send{background: #eda12f; padding:8px 25px; text-align:center; font-size:16px;color:#ffffff; min-width:100px; margin:5px;}
a.btn-send:hover{background:#a8ab4f;}
a.btn-reset{background:#666666; padding:8px 25px; text-align:center; font-size:16px; color:#ffffff; min-width:100px; margin:5px;}
a.btn-reset:hover{background:#222222;}
a.btn-send-over{background:#7ea2c5; padding:8px 25px; text-align:center; font-size:16px; color:#fff; min-width:100px; margin:5px;}
a.btn-send-over:hover{background:#96b9dc; border:2px solid #96b9dc;}
@media screen and (max-width:575px){
	a.btn-send{padding:8px 15px; width:calc(50% - 10px);}
	a.btn-reset{padding:8px 15px; width:calc(50% - 10px);}
	a.btn-send-over{padding:8px 15px; width:calc(50% - 10px);}
}

/** 送出訊息 **/
.jump-window-box{max-width:500px; margin:0 auto; border:1px #ccc solid; padding:20px; border-radius:5px;}

/** 頁次 **/
.pagination-main {width: 100%;display: flex;flex-wrap: wrap; justify-content:center;align-items: center;margin:40px 0 0 0;letter-spacing: 0;}
.pagination {width: auto;display:table;font-size: 14px; color: #777777;line-height: 1;text-align: center;}
.pagination a {color:#777777;display: inline-flex;align-items: center;justify-content: center; padding: 5px;width: 33px;height: 33px;}
.pagination span {color:#777777;display: inline-block;padding: 5px;}
.pagination a.active {background:#eca22e;color: #ffffff;}
.pagination a:hover:not(.active) {color:#eca22e;}
.page{font-size:14px;color:#777777; text-align:center; clear:both; margin:40px 0 0 0;width: 100%;display:flex;justify-content: center;letter-spacing: 0;}
.page a{color:#eca22e;display: inline-block;padding:4px 20px;border: 1px #eca22e solid;}
.page a:hover{background:#eca22e;color: #ffffff;}
@media screen and (max-width:767px){
	.page br{display:block;}
}
@media screen and (max-width:575px){
	.pagination {width: 100%;display: flex;flex-wrap: wrap; justify-content: center;}
    .pagination a {width: 28px;height: 28px;padding: 4px;}
    .pagination span {padding: 4px;}
}

/** 下版 **/
footer{background:#2b2c14 url("../images/i-bg.png")center;padding: 6% 15px 6% 155px;letter-spacing: 0;line-height: 1.6;}
footer .footer{max-width:1350px; margin:0 auto;display: flex;align-items: center;}
footer .footer .f-logo-icon{width: 100px;}
footer .footer .f-logo-icon .f-logo-main{text-align: center;width: 100%;}
footer .footer .f-logo-icon .f-logo-main a{display: block;}
footer .footer .f-logo-icon .f-logo-main img{width:100%; height:auto;filter: brightness(100);}
footer .footer .f-logo-icon .f-logo-main .f-logo{height:auto;width: 68px;margin: 0 auto;}
footer .footer .f-logo-icon .f-logo-main .f-logo-font{font-size: 17px;color: #dddddd;margin: 5px 0 0 0;}
footer .footer .f-logo-icon .f-icon{width: 100%;margin: 15px 0 0 0;}
footer .footer .f-logo-icon .f-icon>ul{list-style: none;padding: 0;margin: 0;display: flex;flex-wrap: wrap;justify-content: center;}
footer .footer .f-logo-icon .f-icon>ul>li{padding: 0;margin: 5px;width: 40px}
footer .footer .f-logo-icon .f-icon>ul>li a{display: flex; align-items: center;justify-content: center; width: 40px; height: 40px; background: #ffffff;padding: 8px; border-radius: 100px;}
footer .footer .f-logo-icon .f-icon>ul>li a img{filter: brightness(0) opacity(.87);transition: all 0.5s ease 0s;}
footer .footer .f-logo-icon .f-icon>ul>li a:hover{}
footer .footer .f-logo-icon .f-icon>ul>li a:hover img{filter: brightness(1);transition: all 0.5s ease 0s;}
footer .footer .f-google-map{flex: 1;margin: 0 3vw;position: relative;padding-bottom: 12%;padding-top: 30px;height: 0;overflow: hidden;}
footer .footer .f-google-map iframe {position: absolute;top:0;left: 0;width: 100%;height: 100%;}
footer .footer .f-contact{width: 310px;}
footer .footer .f-contact>ul{list-style: none;padding: 0;margin: 0;}
footer .footer .f-contact>ul>li{padding: 0;margin:10px 0;display: flex;font-size: 14px; color: #ffffff;}
footer .footer .f-contact>ul>li .f-contact-icon{width: 14px;height: 14px;display: flex;align-items: center;justify-content: center; margin: 4px 10px 4px 0;}
footer .footer .f-contact>ul>li .f-contact-icon img{filter: brightness(100);}
footer .footer .f-contact>ul>li .f-contact-info{flex: 1;padding: 0;}
footer .footer .f-contact>ul>li .f-contact-info a{display: inline-block;color: #ffffff;}
footer .footer .f-contact>ul>li .f-contact-info a:hover{color: #eca22e;}
.copyright{background: #3c3d21;text-align: center; font-size: 12px;color: #ffffff;padding: 10px 15px;letter-spacing: 0;text-transform: uppercase;}
.copyright span{display: inline-block;padding: 0 0 0 15px; }
.copyright span a{display: inline-block;color: #ffffff;}
.copyright span a:hover{color: #eca22e;}
@media screen and (max-width:1024px){
    footer{padding: 30px 15px;}
    footer .footer .f-logo-icon .f-logo-main .f-logo{width: 47px;}
    footer .footer .f-logo-icon .f-logo-main .f-logo-font{font-size: 16px;}
    footer .footer .f-logo-icon .f-icon{margin: 10px 0 0 0;}
    footer .footer .f-google-map{margin: 0 20px;}
}
@media screen and (max-width:767px){
    footer .footer{display: block;}
    footer .footer .f-logo-icon{width: 100%;display: flex;align-items: center;}
    footer .footer .f-logo-icon .f-logo-main{width: auto;text-align: left;}
    footer .footer .f-logo-icon .f-logo-main a{display: flex;align-items: center;}
    footer .footer .f-logo-icon .f-logo-main .f-logo-font{flex: 1;margin: 0 0 0 5px;}
    footer .footer .f-logo-icon .f-icon{flex: 1;margin: 0 0 0 15px;}
    footer .footer .f-logo-icon .f-icon>ul{justify-content: flex-end;}
    footer .footer .f-google-map{flex: initial;width: 100%;margin: 15px 0;padding-bottom: 20%;}
    footer .footer .f-contact{width:100%;}
    footer .footer .f-contact>ul{display: flex;flex-wrap: wrap;}
    footer .footer .f-contact>ul>li{width: calc(100%/2 - 10px);margin: 5px;}
}
@media screen and (max-width:575px){
    footer .footer .f-contact>ul>li{width:100%;margin: 5px 0;}
    footer .footer .f-google-map{padding-bottom: 30%;}
    .copyright span{display:block;padding: 0; }
    .copyright span a{display:block;}
}