﻿@charset "utf-8";

@import url('layout.css');
@import url('customize.css');

/* visual */
#cu-mainVisual {
	display:flex; position:relative; width:100%; height:240px; align-items:center; text-align:center; justify-content:center; background:url("../images/main-visual.png") 50% 100% no-repeat; background-size:cover;
}
#cu-mainVisual .cu-headline {
	position:relative; font-size:42px; line-height:1.5em; color:#fff; font-weight:700;
}

/* content */
.cu-section-apiService {
	position:relative;
}
.cu-section-apiService .cu-title {
	position:relative; text-align:center; padding:35px 0px 60px 0px;
}
.cu-section-apiService .cu-title .cu-tit {
	font-size:26px; line-height:1.5em; color:#333; font-weight:400;
}
.cu-section-apiService .cu-title .cu-context {
	font-size:14px; line-height:1.5em; color:#333; font-weight:300;
}
.cu-section-apiService .cu-apiService {
	position:relative; height:260px; background-color:#f6f6f6;
}
.cu-section-apiService .cu-apiService .cu-tab-navi {
	display:flex; position:absolute; list-style:none; top:-28px; left:50%; margin:auto; z-index:100; transform:translateX(-50%);
}
.cu-section-apiService .cu-apiService .cu-tab-navi .cu-item {
	float:left; position:relative; padding:0px 5px;
}
.cu-section-apiService .cu-apiService .cu-tab-navi .cu-tab {
	display:flex; position:relative; width:150px; height:56px; align-items:center; justify-content:center; font-size:15px; line-height:1.5em; color:#555; font-weight:400; border:1px solid #ddd; border-radius:4px; background-color:#fff; transition:all 0.3s ease-in-out; cursor:pointer; 
}
.cu-section-apiService .cu-apiService .cu-tab-navi .cu-tab:hover {
	color:#222; border-color:#aaa; box-shadow:0px 3px 3px 0px rgba(0,0,0,0.08);
}
.cu-section-apiService .cu-apiService .cu-tab-navi .cu-item:nth-child(1) .cu-tab.cu-current {
	color:#fff; border:none; background:url("../images/main-api-tab-bg-01.png") 50% 50% no-repeat; background-size:cover;
}
.cu-section-apiService .cu-apiService .cu-tab-navi .cu-item:nth-child(2) .cu-tab.cu-current {
	color:#fff; border:none; background:url("../images/main-api-tab-bg-02.png") 50% 50% no-repeat; background-size:cover;
}
.cu-section-apiService .cu-apiService .cu-tab-navi .cu-item:nth-child(3) .cu-tab.cu-current {
	color:#fff; border:none; background:url("../images/main-api-tab-bg-03.png") 50% 50% no-repeat; background-size:cover;
}
.cu-section-apiService .cu-apiService .cu-tab-navi .cu-item:nth-child(4) .cu-tab.cu-current {
	color:#fff; border:none; background:url("../images/main-api-tab-bg-04.png") 50% 50% no-repeat; background-size:cover;
}
.cu-section-apiService .cu-apiService .cu-tab-navi .cu-item:nth-child(5) .cu-tab.cu-current {
	color:#fff; border:none; background:url("../images/main-api-tab-bg-05.png") 50% 50% no-repeat; background-size:cover;
}
.cu-section-apiService .cu-apiService .cu-tab-content {
	display:flex; position:relative; width:1000px; height:100%; align-items:center; justify-content:center; padding-top:28px; margin:auto;
}
.cu-section-apiService .cu-apiService .cu-tab-content .cu-con {
	display:none; position:relative; list-style:none; justify-content:center; flex-wrap:wrap;
}
.cu-section-apiService .cu-apiService .cu-tab-content .cu-con::after {
	content:""; display:table; clear:both;
}
.cu-section-apiService .cu-apiService .cu-tab-content .cu-con.cu-display {
	display:flex;
}
.cu-section-apiService .cu-apiService .cu-tab-content .cu-con .cu-item {
	float:left; padding:4px;
}
.cu-section-apiService .cu-apiService .cu-tab-content .cu-con .cu-item .cu-link-detail {
	display:block; font-size:13px; line-height:1.2em; color:#fff; font-weight:300; padding:8px 12px 10px 12px; background-color:#6f8ead; border-radius:3px; transition:all 0.3s ease-in-out;
}
.cu-section-apiService .cu-apiService .cu-tab-content .cu-con .cu-item .cu-link-detail::after {
	content:""; display:inline-block; width:5px; height:5px; border-top:1px solid rgba(255,255,255,0.6); border-right:1px solid rgba(255,255,255,0.6); margin:3px 0px 0px 3px; transform:rotate(45deg); vertical-align:middle;
}
.cu-section-apiService .cu-apiService .cu-tab-content .cu-con.cu-content-tab-1 .cu-item .cu-link-detail {
	background-color:#8188d4;
}
.cu-section-apiService .cu-apiService .cu-tab-content .cu-con.cu-content-tab-1 .cu-item .cu-link-detail:hover {
	background-color:#6b73c6;
}
.cu-section-apiService .cu-apiService .cu-tab-content .cu-con.cu-content-tab-2 .cu-item .cu-link-detail {
	background-color:#c28b83;
}
.cu-section-apiService .cu-apiService .cu-tab-content .cu-con.cu-content-tab-2 .cu-item .cu-link-detail:hover {
	background-color:#b1736a;
}
.cu-section-apiService .cu-apiService .cu-tab-content .cu-con.cu-content-tab-3 .cu-item .cu-link-detail {
	background-color:#4ba8be;
}
.cu-section-apiService .cu-apiService .cu-tab-content .cu-con.cu-content-tab-3 .cu-item .cu-link-detail:hover {
	background-color:#3796ac;
}
.cu-section-apiService .cu-apiService .cu-tab-content .cu-con.cu-content-tab-4 .cu-item .cu-link-detail {
	background-color:#c07d9e;
}
.cu-section-apiService .cu-apiService .cu-tab-content .cu-con.cu-content-tab-4 .cu-item .cu-link-detail:hover {
	background-color:#b3688d;
}
.cu-section-apiService .cu-apiService .cu-tab-content .cu-con.cu-content-tab-5 .cu-item .cu-link-detail {
	background-color:#6594d9;
}
.cu-section-apiService .cu-apiService .cu-tab-content .cu-con.cu-content-tab-5 .cu-item .cu-link-detail:hover {
	background-color:#4e80ca;
}
.cu-section-apiService .cu-link-apiIntro {
	position:relative; text-align:center; padding:25px 0px;
}
.cu-section-apiService .cu-link-apiIntro .cu-link {
	display:inline-block;
}
.cu-section-apiService .cu-link-apiIntro .cu-link .cu-tit {
	font-size:16px; line-height:1.5em; color:#0082dd; font-weight:400; padding-bottom:5px;
}
.cu-section-apiService .cu-link-apiIntro .cu-link .cu-tit::after {
	content:""; display:inline-block; width:7px; height:7px; margin:-2px 0px 0px 7px; border-top:2px solid #0082dd; border-right:2px solid #0082dd; transform:rotate(45deg); vertical-align:middle; 
}
.cu-section-apiService .cu-link-apiIntro .cu-link:hover .cu-tit {
	text-decoration:underline;
}
.cu-section-apiService .cu-link-apiIntro .cu-link .cu-context {
	font-size:14px; line-height:1.5em; color:#333; font-weight:300;
}

.cu-section-quickLink {
	position:relative; padding:40px 0px; background-color:#f6f6f6;
}
.cu-section-quickLink .cu-inner {
	position:relative; list-style:none; width:1000px; margin:auto;
}
.cu-section-quickLink .cu-inner::after {
	content:""; display:table; clear:both;
}
.cu-section-quickLink .cu-inner .cu-item {
	float:left; position:relative; width:33.333%; padding:0px 10px;
}
.cu-section-quickLink .cu-inner .cu-item .cu-content {
	display:block; width:100%; height:200px; text-align:center; border:1px solid #e8e8e8; padding-top:35px; background-color:#fff; border-radius:4px; transition:all 0.3s ease-in-out;
}
.cu-section-quickLink .cu-inner .cu-item .cu-content:hover {
	border-color:#aaa; box-shadow:0px 3px 3px 0px rgba(0,0,0,0.08);
}
.cu-section-quickLink .cu-inner .cu-item .cu-content .cu-element {
	display:inline-block;
}
.cu-section-quickLink .cu-inner .cu-item .cu-content .cu-element .cu-icon {
	position:relative; height:42px; 
}
.cu-section-quickLink .cu-inner .cu-item .cu-content .cu-element .cu-icon.cu-intro {
	background:url("../images/main-quicklink-icon-intro.png") 50% 50% no-repeat;
}
.cu-section-quickLink .cu-inner .cu-item .cu-content .cu-element .cu-icon.cu-guide {
	background:url("../images/main-quicklink-icon-guide.png") 50% 50% no-repeat;
}
.cu-section-quickLink .cu-inner .cu-item .cu-content .cu-element .cu-icon.cu-faq {
	background:url("../images/main-quicklink-icon-faq.png") 50% 50% no-repeat;
}
.cu-section-quickLink .cu-inner .cu-item .cu-content .cu-element .cu-tit {
	font-size:18px; line-height:1.5em; color:#0082dd; font-weight:400; padding:13px 0px 7px 0px; 
}
.cu-section-quickLink .cu-inner .cu-item .cu-content:hover .cu-element .cu-tit {
	text-decoration:underline; 
}
.cu-section-quickLink .cu-inner .cu-item .cu-content .cu-element .cu-tit::after {
	content:""; display:inline-block; width:7px; height:7px; margin:-2px 0px 0px 7px; border-top:1px solid #0082dd; border-right:1px solid #0082dd; transform:rotate(45deg); vertical-align:middle; 
}
.cu-section-quickLink .cu-inner .cu-item .cu-content .cu-element .cu-context {
	font-size:13px; line-height:1.5em; color:#777; font-weight:300;
}

.cu-section-notice {
	position:relative; padding:30px 0px;
}
.cu-section-notice .cu-inner {
	position:relative; list-style:none; width:1000px; margin:auto;
}
.cu-section-notice .cu-inner::after {
	content:""; display:table; clear:both;
}
.cu-section-notice .cu-inner .cu-item {
	float:left; position:relative; width:33.333%; padding:0px 20px;
}
.cu-section-notice .cu-inner .cu-item .cu-title {
	position:relative; padding-bottom:10px;
}
.cu-section-notice .cu-inner .cu-item .cu-title::after {
	content:""; display:table; clear:both;
}
.cu-section-notice .cu-inner .cu-item .cu-title .cu-tit {
	float:left; font-size:12px; line-height:1.5em; color:#777; font-weight:300;
}
.cu-section-notice .cu-inner .cu-item .cu-title .cu-date {
	float:right; font-size:12px; line-height:1.5em; color:#777; font-weight:300;
}
.cu-section-notice .cu-inner .cu-item a {
	display:block; font-size:16px; line-height:1.5em; color:#505050; font-weight:300; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; transition:all 0.3s ease-in-out;
}
.cu-section-notice .cu-inner .cu-item a:hover {
	color:#121212; text-decoration:underline;
}
