@charset "utf-8";

/******* basic start *******/
.gotop {
	right: 1vw;
	bottom: 1vw;
}
article section {
	width: 100vw;
	padding: 5vw 5vw 0 5vw;
	margin: 0;
}
/******* basic end *******/
/******* header start *******/
header {
	width: 100vw;
	height: auto;
	padding: 0;
	margin: 0 auto;
}
header .container {
	display: block;
	width: 100%;
	height: auto;
	padding: 0;
	margin: 0;
}
/* logo */
.logo {
	display: inline-block;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 11;
	width: 70px;
	height: 70px;
	margin: 0;
	padding: 5px;

	background-color: #fff;

	/*-webkit-box-shadow: -6px 2px 10px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: -6px 2px 10px 0px rgba(0,0,0,0.75);
	box-shadow: -6px 2px 10px 0px rgba(0,0,0,0.75);*/
}
.logo .img_box {
	width: 100%;
	height: 100%;
}

/* 跑馬燈 */
.shoplol {
	display: inline-block;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 10;
	width: 100vw;
	height: 70px;
	padding-left: 70px;

	background-color: #fff;

	-webkit-box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.75);
	box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.75);
}
.shoplol>h4 {
	display: none;
}
.shoplol>.marquee {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 13px 10px;
}
.marquee>div {
	width: 100%;
	height: 44px;
	overflow: hidden;
}
.marquee ul li {
	width: 100%;
	padding: 0;
	line-height: 44px;
	border-bottom: none;
	overflow : hidden;
  	text-overflow : ellipsis;
  	white-space : nowrap;
}
.marquee ul li a {
    font-size: 1em;
}

.header_banner {
	width: 100vw;
	margin-top: 70px;
}
.header_banner:before {
	border: none;
}
.header_banner .img_box {
	width: 100%;
	height: auto;
	min-height: 132px;
}

/* 選單 */
.rwduse {
	display: none;
}
header nav, 
header nav ul {
	display: block;
	width: 100vw;
	height: auto;
}
header nav ul li {
	display: inline-block;
	vertical-align: middle;
	width: 49vw;
	background-color: #bc853e;
	margin: 0 auto;
}
header nav ul li:nth-child(5)>a {
	position: relative;
}
header nav ul li:nth-child(5)>a:after {
	content: "";
	display: block;
	position: absolute;
	width: 0%;
	height: 1px;
	background-color: #fdd;/*#c58c41;*/
	right: 0;
	left: 14px;
	bottom: 6px;
	margin: auto;

	animation-duration: 0.5s;
  	animation-name: head_ani;
  	animation-iteration-count: infinite;
  	animation-direction: alternate;
}
@keyframes head_ani {
  from {
    width: 0%;
  }

  to {
    width: 40%;
  }
}
nav ul li a {
	width: 100%;
	font-weight: bolder;
	text-align: center;
}
nav ul li a:before {
	content: "";
	display: inline-block;
	width: 21px;
	height: 21px;
	background-image: url(../images/icon.png);
	background-repeat: no-repeat;
	vertical-align: sub;
	margin: 0 5px 0 0;
}
nav ul li a.active:before{
	content: "";
	display: inline-block;
	width: 21px;
	height: 21px;
	background-image: url(../images/icon.png);
	background-repeat: no-repeat;
	background-position: -21px 0;
	vertical-align: sub;
	margin: 0 5px 0 0;
}
/******* header end *******/

/******* footer start *******/
footer {
	width: 100vw;
	height: auto;
	padding: 0;
	margin: 0 auto;
}
footer .container {
	width: 100vw;
	padding: 0 5vw;
}
footer h6,
footer .copy, 
footer .photonic {
	display: block;
	width: 100%;
}
/******* footer end *******/

/******* index start *******/
.index .container {
	width: 100%;
	padding: 5vw 0 0 0;
	margin: 0;
}
.index .br {
	display: none;
}

/* youtube */
.index .outset .youtube .img_box iframe {
	clear: none;
	object-fit: unset;
}

/* 列表 */
.index .outset .inset {
	/* flex-direction: column; */
	flex-wrap: wrap;
}
.index .outset .inset li {
	float: left;
    display: inline-block;
    order: 2;
    width: 48%;
    height: auto;
    padding: 2vw;
    margin: 0 5px 5vw 0;
    text-align: center;
}
.index .inset li a, 
.index .tel {
    display: block;
}
.index .inset li a .img_box {
    height: 240px;
}

/* youtube */
.index .outset .inset .youtube {
	order: 1;
	width: 100%;
}

/* 廣告 */
.index .index_banner {
	width: 100vw;
	height: auto;
	margin: 0 0 5vw -5vw;
}
.index .index_banner img {
	object-fit: cover;
}
/******* index end *******/

/******* about start *******/
.about .container {
	padding: 0;
}
.about .left {
	top: 0;
	width: 100%;
	height: auto;
	margin: 0 auto;
}
.about .left .icon_logo {
	width: 180px;
	height: 180px;
	background-image: url(../images/about_logo.png) no-repeat;
	background-size: contain;
	margin: 5vw auto 0 auto;
}
.about .left h5 {
	margin: 20px 0;
}
.about .right {
	padding: 0 10px;
}
.about .right .loan {
	text-align: left;
	font-size: 1.2em;
}
.about .right .loan .introduction:first-child p {
	text-indent: 1.2em;
}
.about .right .loan div:not(.step) p {
	margin-bottom: 32px;
}
.about .right .loan > div:nth-of-type(2) p {
	font-size: 1em;
	text-align: center;
    margin: 1% 0;
}
.about .right .loan > div:last-child {
	margin: 5vw auto;
}
.about .right .slogan p {
    font-size: 1.3em;
    margin-bottom: 10px;
    letter-spacing: 0;
    text-align: center;
}
/******* about end *******/

/******* process start *******/
.process .container {
	padding: 0;
}
.process .left {
	top: 0;
	width: 100%;
	height: auto;
	margin: 0 auto;
}
.process .left .icon_logo {
	width: 180px;
	height: 180px;
	background-image: url(../images/process_logo.png) no-repeat;
	background-size: contain;
	margin: 5vw auto 0 auto;
}
.process .left h5 {
	margin: 20px 0;
}
.process .right {
	padding: 0 10px;
}
.process .left .left_menu ul li {
    letter-spacing: 0;
    margin-bottom: 10px;
}
/******* process end *******/

/******* qa start *******/
.qa .container {
	padding: 0;
}
.qa .left {
	top: 0;
	width: 100%;
	height: auto;
	margin: 0 auto;
}
.qa .left .icon_logo {
	width: 180px;
	height: 180px;
	background-image: url(../images/process_logo.png) no-repeat;
	background-size: contain;
	margin: 5vw auto 0 auto;
}
.qa .left h5 {
	margin: 20px 0;
}
.qa .right {
	padding: 0 10px;
}
.qa .right .loan>.br_2 {
	width: 100%;
}
.qa .right .question > div:nth-of-type(1) {
	margin-bottom: 20px;
}
.qa .right .question > div:nth-of-type(2) ul {
	width: 100%;
	margin: 0;
}
.qa .right .question > div:nth-of-type(2) ul:before {
	content: "";
	display: block;
}
.qa .right .question > div:nth-of-type(2) ul > li {
	font-weight: normal;
	margin: 0;
}
.qa .right .question > div:nth-of-type(2) ul > li > span {
	font-weight: normal;
	margin-left: 0;
}
.qa .right .loan b {
	text-decoration: underline;
}
.qa .right .question li {
	letter-spacing: 0;
}
/******* qa end *******/

/******* information start *******/
.information .container {
	padding: 0;
}
.information .left {
	top: 0;
	width: 100%;
	height: auto;
	margin: 0 auto;
}
.information .left .icon_logo {
	width: 180px;
	height: 180px;
	background-image: url(../images/process_logo.png) no-repeat;
	background-size: contain;
	margin: 5vw auto 0 auto;
}
.information .left h5 {
	margin: 20px 0;
}
.information .right {
	width: 100%;
	padding: 0 10px;
}
.information .right .search {
	width: 100%;
}
.information .right .search form fieldest input[name="search"] {
	width: calc(100% - 44px);
	font-size: 1em;
	text-indent: 12px;
}
.information .right .search form fieldest a {
	margin: 0;
}
/* .information .left .left_menu ul li a:not(.active), 
.information .left .left_menu ul:active li a:not(.active) {
	display: none;
}
.information .left .left_menu ul:hover li a:not(.active) {
	display: block;
} */
.information .left .left_menu ul li a.active:before {
	position: static;
	margin-right: 0;
}
.information .left .left_menu ul li a.active:after {
	/* content: "\00009B"; */
	content: "〉";
	display: inline-block;
	vertical-align: middle;
    transform: rotate(90deg);
    font-size: 20px;
    margin-left: 20px;
}
/*--- ROCKY start ---*/
.rwd_infor_control{display: block;}
.information .left .left_menu .rwd_infor_menu_nav{display: none;}
/*--- ROCKY end ---*/
.information .right .slogan p {
    font-size: 1.3em;
    margin-bottom: 10px;
    letter-spacing: 0;
    text-align: center;
}
.information .right .slogan {
	margin-bottom: 50px;
}
.information .right .shop_add img {
	width: auto;
	max-width: 100%;
	height: auto;
}
.information .right .shop_add iframe {
	max-width: 100%;
	height: auto;
}

/* information_search */
.information .right .search_content .search_shop ul > li {
	margin-bottom: 10px;
}
.information .right .search_content .search_shop ul > li > a, 
.information .right .search_content .search_shop ul > li > a .sea_left {
	display: block;
	width: 100%;
}
.information .right .search_content .search_shop ul > li > a .sea_left > div > span{
	display: block;
    margin-bottom: 20px;
}
.information .right {
	margin-bottom: 5vw;
}
/******* information end *******/

/*--- ROCKY start ---*/
.information .right .shop_info ul li.liB a, .information .right .shop_info ul li.liC a{
	width: 100%;
	white-space: inherit;
}
.information .right .shop_info ul li a span{
	display: block;
    text-align: right;
    margin-left: 0;
}
.information .right .shop_info ul li.liC a span{margin-left: 0;}

.information .right .shop_info ul li.liD{width: 100%;}
.information .right .shop_info ul li.liD:before{width: 99%;}
.information .right .shop_info ul li.liE:before{width: 100%;}
.information .right .shop_info ul li.liD a,
.information .right .shop_info ul li.liE a{
	padding-left: 0;
    margin-left: 0;
    display: block;
    text-align: center;
}
.information .right .shop_info ul li.liD a span{
	white-space: inherit;
    padding-top: 55px;
    display: block;
}
.information .right .shop_info ul li.liE a span{
	margin-left: 0;
	padding-top: 40px;
}

.information .right .shop_info ul .texthtml{max-width:100%;}
/*--- ROCKY end ---*/