@charset "utf-8";
@import url('include/css/all.css');/* icon */
*{margin:0;padding:0;}
*, *:before, *:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}

html { overflow-x: hidden; }
body {min-width:320px;height:100%; margin:0 auto; line-height: 14px; font-size: 14px; ;line-height:100%;color:#111;width:100%;min-width:320px;-webkit-font-smoothing: antialiased;/* Fix for webkit rendering */-webkit-text-size-adjust:none;}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, blockquote, th, td, p { margin: 0px; padding:0px; -webkit-text-size-adjust:none; }
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, del, dfn, em, img, ins, kbd, q, samp, small, strong, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, table, tbody, tfoot, thead, tr, th, td, article, aside, footer, header, nav, section {margin:0;padding:0;border:0;border-radius:0;/* for iOS */outline:0;font-size:100%;}
h1, h2, h3, h4, h5, h6{margin:0;font-size:1em;}
table { border-collapse: collapse; border-spacing: 0px; }
fieldset, img, abbr, acronym { border: 0px; }
legend { position: absolute; *margin-left: -7px; height: 0; line-height: 0; font-size: 0; overflow: hidden; }
address, caption, cite, code, dfn, em, var { font-style: normal; font-weight: normal; }
ol,ul { list-style: none; margin-block-start:0;margin-block-end:0;margin-inline-start: 0;margin-inline-end: 0;padding-inline-start: 0;}
caption { height: 0; line-height: 0; font-size: 0; overflow: hidden; text-indent: -10000px; }
q:before, q:after { content:''; }
a { color: inherit; text-decoration: none; outline: none;}
hr { display: none; }
button { padding: 0; border: 0 none; background: none; outline: none;}
label { cursor: pointer; }
img {width:100%; height:auto}

body{background:#f6f7fa;}
body.wh {background: #fff; min-width: 1200px;}
header, footer, article, section, aside, details, figure, figcaption, nav, hgroup { display: block; margin: 0; padding: 0; }
audio[controls], canvas, video { display: inline-block; *display: inline; *zoom: 1; }
button, input, select, textarea { margin: 0; font-size: 100%; vertical-align: baseline; *vertical-align: middle; }
button, input { line-height: normal; *overflow: visible; }
table button, table input { *overflow: auto; }
button, html input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; }

#skip_nav { width: 100%; height: 0; text-align: center; overflow: hidden; }
#skip_nav a { color: #005aab; line-height: 20px; font-size: 14px; font-weight: bold; float: left; }
#skip_nav a:focus, 
#skip_nav a:hover, 
#skip_nav a:active { position: absolute; top: 0; left: 0; width: 100%; height: 20px; text-decoration: underline; background: #fff; overflow: visible; z-index: 100; }

li {list-style: none;}

a,
a:focus,
a:hover,
a:active,
input,
textarea {outline:none; text-decoration: none!important}

.hdn {
 overflow: hidden;
 display: inline-block;
 position: absolute;
 width: 1px;
 height: 1px;
 border: 0;
 clip: rect(1px, 1px, 1px, 1px);
 clip-path: inset(50%);
}

button:disabled {
	background: #eeeeee!important;
	box-shadow: none!important;
	color: #d0d0d0!important
}
.text-left { text-align: left!important; }
.text-center { text-align: center!important; }
.text-right { text-align: right!important; }
.pr{position: relative;}
.dpn { display: none; }
.hidden { position: absolute; width: 0; height: 0; font-size: 0; line-height: 0; text-indent: -10000px; overflow: hidden; }
.vam { vertical-align: middle; }
.ofh { overflow: hidden; }
.ofh_w100{ overflow: hidden; width: 100%; } 
.clear { clear: both; }
.bold { font-weight: 700 !important; }
.eBold { font-weight: 800 !important; }
.fwn { font-weight: normal; }
.floatleft { float: left; }
.floatright { float: right; }
.noneborder { border: none !important; }
.nonebg { background-image: none !important; }
.b1 {border: 1px solid #eee; }
.bt1 {border-top: 1px solid #eee;}
.bb1 {border-bottom:1px solid #eee;}
.btN {border-top:none !important;}
.imgfix { font-size: 0; line-height: 0; }
.after:after {content:"";display:block; clear:both;}
.dB {display:block;}
.dN {display:none;}

/* header */
.Header {
	text-align:right; 
	height:68px;
	width:100%; 
	background:#fff;
	box-shadow:  0 0 35px 0 rgb(154 161 171 / 15%);
	position: relative;
	padding: 0 60px
}
.Header h1 {
	position: absolute;
	left: 60px;
	top: 20px;
}
.Header h1 img{
	width: 250px;
}
.Header .top-menu {
	display:inline-block; 
	line-height:68px; 
	font-size: 14px; 
	cursor: pointer;
	margin-right: 20px;
}
.Header .top-menu a {
	color: #666666 
}
.Header .top-menu a:hover {
	text-decoration: underline!important;
}
.Header .top-menu a.login {
	padding-right: 15px;
	margin-right: 15px;
	position: relative;
}
.Header .top-menu a.login::after {
	position: absolute;
	content: '';
	width: 1px;
	height: 11px;
	background: #d4d4d4;
	display: inline-block;
	right: -1px;
	top:1px;
}
.Header .language {

	width: 80px;
	display: inline-block;
	font-size: 14px;
	text-align: left;
	vertical-align: top;
	margin-top: 15px;
	position: relative;
}
.Header .language a.sel {
	color: #666666;
	font-weight: 500;
	height: 36px;
	display: block;
	line-height: 38px;
	position: relative;
	padding-left: 10px;
	font-size: 12px;
	background: #edf1f7;
}

.Header .language .country {
	width: 20px;
	height: 20px;
	display: inline-block;
	vertical-align: top;
	margin-top: 5px;
	margin-right: 5px
}
.Header .language img {
	width: 20px;
	border-radius: 3px
}
.Header .language ul {
	display:none;
	position: absolute;
	left: 0;
	right: 0;
	background: #e6e9f5;
	z-index: 10;
	box-shadow: 0 0 35px 0 rgb(154 161 171 / 15%);
}
.Header .language li .country {
	margin-top: 0;
	vertical-align: middle;
	
}
.Header .language li {
	padding: 8px 10px;
	border-top: 1px solid #cacfe5;
	color: #5b627c;
	font-size: 12px;
	padding-left: 10px;
}
.Header .language a.sel.on::after {
	content: '';
	background: url("../Content/images/ico_up1.png")no-repeat;
}
.Header .language a.sel::after {
	position: absolute;
	content: '';
	background: url("../Content/images/ico_down1.png")no-repeat;
	width: 11px;
	height: 6px;
	right: 12px;
	top: 15px
}
.Header .language .lang-scroll {
	height: 200px;
	overflow-y: auto
}
.Header .fee {
	background: #0052e9;
	color: #fff;
	display: inline-block;
	line-height: 38px;
	height: 36px;
	padding: 0 20px;
	vertical-align: top;
	margin-top: 15px;
	margin-left: 3px;
	font-size: 14px;
}
.Header .fee:hover {
	background: #253153;
}
.site .Header .user_name {
	padding-right:8px; 
	display:inline-block; 
	line-height:68px; 
	font-size: 14px; 
	cursor: pointer
}

.site .Header .user_name span {
	color: #435ebe 
}
.site .Header .user_name:hover .profile-dropdown {
	display: block;
}
.site .profile-dropdown {
	box-shadow: 0 0 35px 0 rgb(154 161 171 / 15%);
	background: #fff;
	width: 200px;
	border: 1px solid #d9e3e9;
	padding: 10px 0;
	display: none;
	position: absolute;
	right: 260px;
	z-index: 10;
	top: 58px;
	box-shadow: 8px 0 10px rgb(82 88 95 / 7%)
}

.site .profile-dropdown li {
	text-align: left;
	display: block;
}
.site .profile-dropdown li a {
	text-align: left;
	font-size: 13px;
	color: #666;
	padding: 0 20px;
	display: block;;
	height: 34px;
	line-height: 34px;
}
.site .profile-dropdown li a:hover {
	color: #435ebe
}
.site .profile-dropdown li a i {
	color: #999;
	margin-right: 10px;
	vertical-align: middle;
	width: 15px;
	text-align: center
}
footer {
}
footer .footer {
	background: #e6e7ec;
}

footer .footer .cmm-area {
	display: flex;
	padding: 30px 0;
	position: relative

}
footer .footer .cmm-area>div {
	margin-right: 80px;
}
footer .footer .cmm-area>div:nth-child(2) ul:nth-child(3) {
	border-top: 1px solid #d3d5dc;
	padding-top: 10px;
	margin-top: 10px;
}
footer .footer-menu {
	color: #7c8793;
	position: relative
}
footer .footer-menu strong {
	display: flex;
	margin-bottom: 15px;
}
footer .footer-menu li {
	font-size: 13px;
	line-height: 26px;
	display: block
}
footer .footer-menu li a {
	display: block;
}
footer .footer-menu li a:hover {
	text-decoration: underline!important;
}
footer .copyright {
	font-size: 13px;
	text-align: right;
	position: absolute;
	right: 0;
	bottom: 30px;
	color: #666;
	margin-right: 0!important
}
footer .copyright p {
	margin-bottom: 5px;
}
footer .copyright p a {
	color: #244e9c
}
footer .copyright copyright {
	font-size: 12px;
}
footer .footer .footer-logo img {
	width: 121px;
}
footer .copyright img {
	width: 100px;
	margin-bottom: 10px;
}
/*------scroll bar---------------------*/

.lang-scroll::-webkit-scrollbar {
	width: 5px;
	height: 7px;
}
.lang-scroll::-webkit-scrollbar-button {
	width: 0px;
	height: 0px;
}
.lang-scroll::-webkit-scrollbar-thumb {
	background: #c9d1ee;
	border: 0px none #ffffff;
	border-radius: 0px;
}
.lang-scroll::-webkit-scrollbar-thumb:hover {
    background: #c9d1ee;
}
.lang-scroll::-webkit-scrollbar-thumb:active {
    background: #c9d1ee;
}
.lang-scroll::-webkit-scrollbar-track {
	background: transparent;
	border: 0px none #ffffff;
	border-radius: 50px;
}
.lang-scroll::-webkit-scrollbar-track:hover {
	background: transparent;
}
.lang-scroll::-webkit-scrollbar-track:active {
 	background: transparent;
}
.lang-scroll::-webkit-scrollbar-corner {
 	background: transparent;
}

/* main */
#myVideo {
  position: absolute;
  right: 0;
  bottom: -100px;
  top: -100px;
  min-width: 100%; 
  min-height: 100%;
}
.visual {
	position: relative;
	height: 880px;
	overflow: hidden
}
.visual img {
	height: 507px;
}
.visual .slogan {
	position: absolute;
	text-align: center;
	top: 235px;
	left: 0;
	right: 0;
	font-size: 50px;
	line-height: 64px;
	color: #fff;
	z-index: 1;
	
}
.visual .slogan strong {
	display: block;
	font-weight: bold;
}
.visual .fee {
	position: absolute;
	text-align: center;
	top: 550px;
	left: 0;
	right: 0;
	z-index: 1;
}
.visual .fee a {
	font-size: 20px;
	line-height: 62px;
	color: #fff;
	width: 245px;
	height: 60px;
	border-radius: 5px;
	background: rgb(36,78,156);
    background: linear-gradient(270deg, rgba(36,78,156,1) 0%, rgba(0,82,233,1) 10%, rgba(64,186,213,1) 53%, rgba(252,191,30,1) 94%);
	display: inline-block;
	box-shadow: 3px 0 25px rgba(43,43,43,0.6);
	font-weight: normal
}
.boxMenu {
	display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox; /* TWEENER - IE 10 */
	display: -webkit-flex; /* NEW - Chrome */
	display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
	word-break: keep-all; /*다국어*/
}
.boxCont {
	width: 25%;
	height: 400px;
	padding: 3em;
	position: relative
}
.boxCont dl {
	color: #fff;
}
.boxCont dl dt {
	font-size: 40px;
	font-weight: bold;
	margin-bottom: 30px;
	line-height: 44px;
}
.boxCont dl dd {
	font-size: 18px;
	line-height: 22px;
	font-weight: 300;
	font-size: 15px;
	/*overflow: hidden;*/	/*다국어*/
	position: relative;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	opacity: 0.9
}

.boxCont dl dd .more {
	background: linear-gradient(180deg, rgba(255,182,0,0) 9%, rgba(1,15,55,0) 33%);
  color: blue;
  cursor: pointer;
  position: absolute;
  bottom: -20px;
  padding: 15px 0;
  text-align: center;
  width: 100%;
}
.boxCont a {
	background-color: rgba(255,255,255,0.3);
	padding: 10px 15px;
	display: inline-block;
	border-radius: 100px 100px;
	font-weight: 500;
}
.boxCont.menu01 a {
	color: #060559
}
.boxCont.menu02 a {
	color: #3851ff;
}
.boxCont.menu03 a {
	color: #025466;
}
.boxCont.menu04 a {
	color: #b17212;
}

.boxCont a:hover {
	background-color: rgba(255,255,255,0.3);
	text-decoration: none!important;
}
.boxCont>div {
	position: absolute;
	right: 3em;
	/*top: 13em;*/
	top: 19em;	/*다국어*/
}
.boxCont.menu01 {
	background:url("images/bg_boxcont1.jpg")no-repeat center center;
	background-size: 100% 100%;

}
.boxCont.menu01:hover,
.boxCont.menu02:hover,
.boxCont.menu03:hover,
.boxCont.menu04:hover{
	background-size: 110% 110%;
	transition: all 0.6s ease 0s !important
}
.boxCont.menu02 {
	background:url("images/bg_boxcont2.jpg")no-repeat center center;
	background-size: 100% 100%;
}
.boxCont.menu03 {
	background:url("images/bg_boxcont3.jpg")no-repeat center center;
	background-size: 100% 100%;
}
.boxCont.menu04 {
	background:url("images/bg_boxcont4.jpg")no-repeat center center;
	background-size: 100% 100%;
}
.logoSlider {
	padding: 100px 0;
	background: #fff
}
.logoSlider .titWrap {
	text-align: center;
}
.logoSlider .titWrap h2 {
	font-size: 38px;
	color: #244e9c;
	font-weight: 500;
	line-height: 50px;
	margin-bottom: 30px;
}
.logoSlider .titWrap p {
	font-size: 16px;
	color: #666;
	line-height: 24px;
	margin-bottom: 40px;
}
.customer-logos-row1,
.customer-logos-row2{
	margin: 0 auto;
	max-width: 1200px;
	position: relative;
}
.customer-logos-row1 img,
.customer-logos-row2 img{
	height: 116px;
}
.customer-logos-row1::before, 
.customer-logos-row1::after {
	position: absolute;
	z-index: 1;
	width: 100px;
	content: '';
	height: 100%;
	top: 0;
}
.customer-logos-row2::before, 
.customer-logos-row2::after {
	position: absolute;
	z-index: 1;
	width: 100px;
	content: '';
	height: 100%;
	top: 0;
}
.customer-logos-row1::after {
	right: 0;
	background: linear-gradient(to left,#fff 10px,rgba(255,255,255,0))
}
.customer-logos-row1::before {
	left: 0;
	background: linear-gradient(to right,#fff 10px,rgba(255,255,255,0))
}

.customer-logos-row2::after {
	right: 0;
	background: linear-gradient(to left,#fff 10px,rgba(255,255,255,0))
}
.customer-logos-row2::before {
	left: 0;
	background: linear-gradient(to right,#fff 10px,rgba(255,255,255,0))
}

/* login */
.top-visual {
	width: 100%;
	height: 245px;
	position: relative;
}
.top-visual.bg-login {
	background: url("images/sub_visual1.jpg") no-repeat center center;
	background-size: cover;
	position: relative;
}
.top-visual.bg-signup {
	background: url("images/sub_visual2.jpg") no-repeat center center;
	background-size: cover;
	position: relative;
}
.top-visual.bg-login::after,
.top-visual.bg-signup::after{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
	content: '';
	opacity: 85%;
}
.top-visual.bg-login::after {
	background: #315ba9;
}
.top-visual.bg-signup::after {
	background: #253153;
}
.top-visual h2 {
	position: absolute;
	left: 50%;
	margin-left: -100px;
	z-index: 1
}
.top-visual h2 img {
	width: 200px;
	margin-top: 100px;
}
.memberWrap {
	background: #f2f6ff;
}
.memberBox {
	max-width: 850px;
	margin: 60px auto;
}
.memberBox .s-Title {
	text-align: center;
}
.memberBox .s-Title h3 {
	font-size: 50px;
	line-height: 65px;
	color: #244e9c;
}
.memberBox .s-Title h3 strong {
	font-weight: 500
}
.memberBox .s-Title h3 span {
	font-weight: 300;
}
.memberBox .s-Title p {
	font-size: 22px;
	color: #666;
	margin-top: 15px;
	line-height: 1.5;
}
.memberInput {max-width: 640px; margin:  0 auto}

.inputForm {
	margin-top: 50px;
}
.inputForm dl.selection {
	border-top: 1px solid #e6e9ef;
	padding-top: 20px;
	margin-top: 30px;
}
.inputForm .two,
.inputForm .dd-two dd{
	overflow: hidden;
}
.inputForm .dd-two select {
	float: left;
	width: calc(40% - 5px);
}
.inputForm .dd-two input[type="text"] {
	float: right;
	width: calc(60% - 5px);
}
.inputForm .two dl{
	width: calc(50% - 5px);
}
.inputForm .two dl:first-child{
	float: left
}
.inputForm .two dl:last-child{
	float: right;
}
.inputForm dt {
	font-size: 16px;
	font-weight: normal;
	color: #111;
	margin-bottom: 10px;
}
.inputForm dt span.ess {
	font-weight: bold;
	color: #fb5a0b;
}
.inputForm dd {
	margin-bottom: 20px;
}
.inputForm dd input[type="text"],
.inputForm dd input[type="number"],
.inputForm dd input[type="password"],
.inputForm dd select{
	border-radius: 5px;
	border: 1px solid #cecece;
	height: 52px;
	padding: 0 15px;
	width: 100%;
	outline: 0
}
.inputForm dd input[type="text"]::placeholder,
.inputForm dd input[type="number"]::placeholder,
.inputForm dd input[type="password"]::placeholder,
.inputForm dd select::placeholder{
	color: #d9d9d9
}
.inputForm dd input[type="text"]:hover,
.inputForm dd input[type="number"]:hover,
.inputForm dd input[type="password"]:hover,
.inputForm dd select:hover{
	border: 1px solid #244e9c;
}
.inputForm dd select {
	background: #fff url("images/select.png") no-repeat right 12px top 50%;
	appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
}
.inputForm dd p {
	font-size: 12px;
	color:#fb5a0b;
	margin-top: -5px;
}
.memberBox .forget {
	text-align: right;
	margin-bottom: 20px;
}
.memberBox .forget a {
	color: #0f73ee;
	margin-left: 10px;
	font-size: 14px;
}
.memberBox .forget a:hover {
	text-decoration: underline!important
}
.memberBox .btm-btn {
	font-size: 18px;
	line-height: 52px;
	color: #fff;
	width: 100%;
	height: 52px;
	border-radius: 5px;
	background: rgb(36,78,156);
    background: linear-gradient(90deg, rgba(36,78,156,1) 0%, rgba(0,82,233,1) 10%, rgba(64,186,213,1) 53%, rgba(252,191,30,1) 94%);
	display: inline-block;
	font-weight: bold;
	text-align: center;
	
}
.memberBox .signup {
	padding: 30px 7px;
	text-align: center;
}
.memberBox .signup a {
	margin-left: 5px;
	color: #0667e9;
	font-weight: bold;
}
.typeSelect {margin-top: 60px}
.typeSelect h3 {text-align: center; font-size: 36px; font-weight: bold; display: block; margin-bottom: 60px}
.typeSelect h3 span {color: #fb5a0b; display: inline-block; vertical-align: top}
.memberType {display: flex; justify-content: space-between; height: 300px}
.memberType a{width: 300px; height: 300px; border: 2px solid #244e9c; border-radius: 10px 10px; position: relative; transform:scale(0.7); opacity: 0.2; box-sizing: content-box}
.memberType a:hover,
.memberType a.active{border: 8px solid #244e9c; transform:scale(1); opacity: 1; box-shadow: 0 0 45px rgba(36,78,156,0.58); position: relative}
.memberType a.active.click::after{
	content: '';
	position: absolute;
	background: url("images/type-sel.png") no-repeat;
	width: 78px;
	height: 78px;
	left: 50%;
	margin-left: -39px;
	top: -39px;
}
.memberType a.type1 {background: url("images/member_type1.png")no-repeat center bottom 65px; background-size:contain}
.memberType a.type2 {background: url("images/member_type2.png")no-repeat center bottom 65px; background-size: contain}
.memberType a span {display: block; text-align: center; color: #fff; background: #244e9c; position: absolute; left: 0; right: 0; bottom: 0; height: 65px; line-height: 65px; font-weight: 500; font-size: 32px}
.agreeArea {
	font-size: 14px;
}
.agreeArea {
	margin: 30px 0
}
.agreeArea li {
	margin: 10px 0;
}
.agreeArea a {
	font-weight: bold;
	color: #0f73ee;
	text-decoration: underline!important;
}
.agreeArea span {
	display: inline-block;
	vertical-align: middle
}
/* checkbox */
.agreeArea .check,
.inputForm .radio{height: 26px;}
.agreeArea input[type=checkbox],
.inputForm input[type=radio]{display: none;}
.agreeArea input[type=checkbox] + label{width: 26px; padding-left: 25px;}
.inputForm input[type=radio] + label{padding-left: 35px;}
.agreeArea input[type=checkbox] + label,
.inputForm input[type=radio] + label{ display: inline-block;cursor: pointer;position: relative;font-size:14px;line-height:26px;margin-right: 5px;color: #111;height: 26px;}
.agreeArea input[type=checkbox]+ label:before,
.inputForm input[type=radio]+ label:before{content: "";display: inline-block;width: 26px;height: 26px;margin-right: 7px;position: absolute;top:-2px;left: 0;bottom: 0;}
.agreeArea input[type=checkbox]+ label:before {background: url(images/ico_checkbox2.png);}
.inputForm input[type=radio]+ label:before {background: url(images/ico_checkbox2.png);}
.agreeArea input[type=checkbox]:checked + label:before {content: "";background: url("images/ico_checkbox_ck2.png") no-repeat;} 
.inputForm input[type=radio]:checked + label:before {content: "";background: url("images/ico_checkbox_ck2.png") no-repeat;} 
.agreeArea input[type=checkbox]:checked+label,
.inputForm input[type=radio]:checked+label{color:#111!important;}

.layer-btn {
	text-align: center;
	margin-top: 40px;
}
.layer-btn a {
	padding: 15px 25px;
	display: inline-block;
	background: #0052e9;
	font-size: 16px;
	color: #fff;
	border-radius: 5px
	
}
.search-idpw {
	background: #fff;
}
.search-idpw .result {
	text-align: center;
	margin: 30px 0;
	background: #f5f6fa;
	padding: 20px;
	border-radius: 5px;
}
.search-idpw .result strong {
	color: #0052e9;
	
}
@media (min-width: 768px) and (max-width: 1200px) {
	.Header {
		padding: 0 30px;
	}
	.Header h1 {
		left: 30px;
	}
	.boxCont {
		padding: 2.5em;
		height: 250px;
	}
	.boxCont dl dt {
		font-size: 20px;
		line-height: 22px;
	}
	.boxCont dl dd {
		font-size: 16px;
	}
	footer .footer {
		padding: 0 30px;
	}
	.boxCont>div {
		right: 1.5em;
		bottom: 1.5em;
		top: inherit
	}
}
@media only screen and (max-width:991px) {
	.memberWrap {
		padding: 0 5%
	}
}
@media only screen and (max-width: 767px) {
	.Header {
		padding: 0 0 20px;
		text-align: center;
		height: auto;
	}
	.Header h1 {
		left: inherit;
		top: inherit;
		position: relative;
		padding-top: 20px;
	}
	.Header h1 img {
		width: 200px;
	}
	.Header .user_name {
		padding-left: 0
	}
	.Header .fee {
		padding: 0 15px;
		font-size: 12px;
	}
	.visual {
		height: 400px;
	}
	.visual .slogan {
		font-size: 28px;
		line-height: 36px;
	}
	.visual .fee {
		top: 200px;
	}
	.visual .slogan {
		top:100px;
		
	}
	.visual .fee a {
		font-size: 16px;
		height: 50px;
		line-height: 50px;
		width: 150px;
	}
	.boxMenu {
		display: block;
	}
	.boxCont {
		width: 100%;
		height: 250px;
		padding: 2em 2em
	}
	.boxCont dl dt {
		font-size: 24px;
		line-height: 24px;
	}
	.logoSlider {
		padding: 40px 0;
	}
	.logoSlider .titWrap {
		padding: 0 20px;
	}
	.logoSlider .titWrap h2 {
		font-size: 23px;
		line-height: 32px;
	}
	footer .footer {
		padding: 0 30px;
	}
	footer .footer .footer-logo img {
		width: 80px;
	}
	.memberType a span {
		font-size: 24px;
		height: 45px;
		line-height: 45px;
	}
}

.memberType a.type1 {
	background: url("images/member_type1.png")no-repeat center bottom 45px;
	background-size: contain
}

.memberType a.type2 {
	background: url("images/member_type2.png")no-repeat center bottom 45px;
	background-size: contain
}

}

@media only screen and (max-width: 660px) {
	.memberType {
		height: auto
	}

		.memberType a {
			height: 290px
		}
}

@media only screen and (max-width: 540px) {
	.memberType a {
		height: 260px
	}
}

@media only screen and (max-width: 480px) {
	.memberType a span {
		font-size: 18px;
		height: 30px;
		line-height: 30px;
	}

	.memberType a.type1 {
		background: url("images/member_type1.png")no-repeat center bottom 30px;
		background-size: contain
	}

	.memberType a.type2 {
		background: url("images/member_type2.png")no-repeat center bottom 30px;
		background-size: contain
	}

	.memberType {
		height: auto
	}

		.memberType a {
			height: 180px
		}

	.memberWrap {
		padding: 0 15px;
	}

	.memberBox {
		margin: 60px auto;
	}

		.memberBox .s-Title h3 {
			font-size: 40px
		}

		.memberBox .s-Title p {
			font-size: 18px;
			line-height: 1.2
		}

	.typeSelect h3 {
		font-size: 24px;
	}

	.inputForm dt {
		font-size: 14px;
	}

	.inputForm dd input[type="text"], .inputForm dd input[type="number"], .inputForm dd input[type="password"], .inputForm dd select {
		font-size: 14px;
		padding: 0 10px
	}

	footer .footer .cmm-area {
		display: block;
	}

	footer .copyright {
		position: relative;
		right: inherit;
		bottom: inherit;
		margin-top: 20px;
	}

	footer .footer-menu strong {
		margin-top: 15px;
	}

	footer .footer .cmm-area > div {
		margin-right: 0
	}

	.txtWrap .s-Title h3 {
		font-size: 40px !important;
		line-height: 46px !important;
	}

	.boxCont > div {
		position: relative;
		right: inherit;
		top: inherit;
		margin-top: 10px;
	}
}

@media only screen and (max-width: 360px) {

	.memberType a {
		height: 150px
	}
}

/* what is WATS */
.cmm-area {
	max-width: 1110px;
	margin: 0 auto;
	word-break: keep-all; /*다국어*/
}
.top-visual2 {
	height: 215px;
	background: url("images/content/bg_sub_visual01.jpg") no-repeat center center;
	background-size: cover;
	transition: background-size 15s ease-in-out;
	
}
.top-visual2.user {
	background: url("images/content/bg_sub_visual02.jpg") no-repeat center top;
	background-size: cover;
}
.top-visual2.how {
	background: url("images/content/bg_sub_visual03.jpg") no-repeat center center;
	background-size: cover;
}
.top-visual2.attorney {
	background: url("images/content/bg_sub_visual04.jpg") no-repeat center top;
	background-size: cover;
}
@-webkit-keyframes zoom-a {
	0% { background-size: 120% auto; }
	100% { background-size: 140% auto; }
}
@-moz-keyframes zoom-a {
	0% { background-size: 120% auto; }
	100% { background-size: 140% auto; }
}
@-o-keyframes zoom-a {
	0% { background-size: 120% auto; }
	100% { background-size: 140% auto; }
}
@keyframes zoom-a {
	0% { background-size: 120% auto; }
	100% { background-size: 140% auto; }
}
.top-visual2.zoom-a{  -webkit-animation: zoom-a 10s linear infinite alternate; /* Safari 4+ */
	-moz-animation:    zoom-a 15s linear infinite alternate; /* Fx 5+ */
	-o-animation:      zoom-a 15s linear infinite alternate; /* Opera 12+ */
	animation:         zoom-a 15s linear infinite alternate; /* IE 10+, Fx 29+ */
}
.top-visual2.how .tit {
	display: block;
	text-align: center;
	line-height: 215px;
}
.top-visual2 .tit {
	display: flex;
	align-items: center;
	justify-content: space-between;
	color: #fff;
	height: 215px;
}

.top-visual2 .tit h2 {
	margin: 0 50px;
	font-size: 36px;
	word-break: keep-all
}
.top-visual2 .tit p {
	flex: 1;
	font-size: 14px;
	line-height: 18px;
}
.visual-bg.v1 {background: #253153; opacity: 0.3}
.content .titWrap {
	text-align: center;
}
.content .titWrap h3 {
	font-size: 34px;
	font-weight: normal;
	line-height: 44px;
}
.content .titWrap p {
	font-size: 18px;
	color: #acadae;
	line-height: 24px;
	margin-top: 30px;
}
.adtWrap {
	background: url("images/content/bg_advt.jpg");
	padding: 90px 0;
	position: relative;
}
.triangle {
	text-align: center;
	position: relative;
	min-height: 470px;
	margin-top: 50px;
}
.triangle div>div {
	width: 0;
	height: 0;
}
.triangle>div {
	width: 272px;
	height: 235px;
	display: inline-block;
	position: absolute;
}
.triangle div.t1 {
	top:0;
	left: 50%;
	margin-left: -136px;
}
.triangle div.t2 {
	top:235px;
	left: 50%;
	margin-left: -136px;
}
.triangle div.t3 {
	top:235px;
	left: 50%;
	margin-left: -272px;
}
.triangle div.t4 {
	top:235px;
	left: 50%;
	margin-right: -272px;
}
.triangle div.t1>div {
	border-left: 136px solid transparent;
	border-right: 136px solid transparent;
	border-bottom: 235px solid #010f37;
}
.triangle div.t2>div {
	border-left: 136px solid transparent;
	border-right: 136px solid transparent;
	border-top: 235px solid #334c93;
}
.triangle div.t3>div {
	border-left: 136px solid transparent;
	border-right: 136px solid transparent;
	border-bottom: 235px solid #fcbf1e;
}
.triangle div.t4>div {
	border-left: 136px solid transparent;
	border-right: 136px solid transparent;
	border-bottom: 235px solid #40bad5;
}
.triangle div span {
	display: block;
	left: 0;
	position: absolute;
	width: 272px;
	color: #fff;
	font-size: 19px;
	font-weight: 500
}
.triangle div.t1 span{
	top:170px;
}
.triangle div.t2 span{
	top:50px;
}
.triangle div.t3 span{
	top:135px;
	color: #5b450b
}
.triangle div.t4 span{
	top:135px;
}
.comparison {
	padding: 90px 0;
}
.comparison .under {
	text-decoration: underline
}
.com-list .com-th {
	display: flex;
	margin-top: 50px;
}
.com-list .com-th span {
	display: block;
	flex: 1;
	text-align: center;
	font-weight: bold;
	padding: 15px 0;
}
.com-list .com-th span:first-child {
	background: #c9cdda;
	color: #7e8089;
}
.com-list .com-th span:last-child {
	background: #334c93;
	color: #fff;
}
.com-list .com-td dl {
	margin-top: 50px;
}
.com-list .com-td dt {
	text-align: center;
	font-weight: bold;
	margin-bottom: 20px;
}
.com-list .com-td dd {
	display: flex;
	align-items: center;
}
.com-list .com-td dd span:first-child,
.com-list .com-td dd span:last-child{
	line-height: 22px;
	width: 466px;
	min-height: 30px;
}
.com-list .com-td dd span:first-child {
	padding: 0 25px;
	color: #666666;
	text-align: right
}
.com-list .com-td dd span:last-child {
	color: #334c93;
	background: url("images/content/ico_check.png") no-repeat 25px center;
	padding: 0 25px 0 75px;
}
.com-list .com-td dd span.vs {
	font-size: 20px;
	color: #334c93;
	font-weight: 500;
	background: #eff1f7;
	width: 128px;
	height: 58px;
	border-radius: 100px 100px;
	text-align: center;
	line-height: 58px;
	display: inline-block;
	margin: 0 25px;
	position: relative;
}
.com-list .com-td dd span.vs::before {
	content: '';
	height: 1px;
	position: absolute;
	background: #dde1ed;
	top: 50%;
	left: -25px;
	z-index: -1;
	width: 25px;
}
.com-list .com-td dd span.vs::after {
	content: '';
	height: 1px;
	position: absolute;
	background: #dde1ed;
	top: 50%;
	right: -25px;
	z-index: -1;
	width: 25px;
}
.w-solution {
	padding: 90px 0;
	position: relative;
}
.w-solution::after {
	content: '';
	background: #f9fafb;
	width: 100%;
	height: 360px;
	top:0;
	left: 0;
	right: 0;
	position: absolute;
	z-index: -1;
}
.w-solution .titWrap p {
	color: #333
}
.w-solution .titWrap p strong {
	font-size: 20px;
	color: #0052e9
}
.sol-slider .step-list {
	margin: 80px 0;
}
.sol-slider .stepCont{
	overflow: hidden
}
.step-list .swiper-slide .step-circle {
	width: 170px;
	height: 170px;
	border-radius: 170px 170px;
	text-align: center;
	color: #fff;
	transition: all .3s ease;
	padding-top: 50px;
	cursor: pointer;
}
.step-list .swiper-slide .step-circle p {
	font-size: 14px;
	font-weight: 500
}
.step-list .swiper-slide .step-circle strong {
	font-size: 22px;
	display: block;
	margin-top: 5px;
}
.step-list .swiper-slide .step-circle span {
	font-size: 20px;
	display: block;
	margin-top: 15px;
	font-weight: 300;
	font-style: italic
}
.step-list .swiper-slide-thumb-active .step-circle{
	transform: scale(1.4);
	position: absolute;
	z-index: 2;
	background: rgb(255,182,0);
    background: linear-gradient(180deg, rgba(255,182,0,1) 9%, rgba(1,15,55,1) 33%, rgba(64,186,213,1) 93%, rgba(70,156,242,1) 100%)!important;
}
.step-list .swiper-slide:nth-child(1) .step-circle {
	background: #e6e8f1;
}
.step-list .swiper-slide:nth-child(2) .step-circle {
	background: #dadeeb;
}
.step-list .swiper-slide:nth-child(3) .step-circle {
	background: #ced2e1;
}
.step-list .swiper-slide:nth-child(4) .step-circle {
	background: #cacede;
}
.step-list .swiper-slide:nth-child(5) .step-circle {
	background: #c0c5d8;
}
.step-list .swiper-slide:nth-child(6) .step-circle {
	background: #cacede;
}
.step-list .swiper-slide:nth-child(7) .step-circle {
	background: #ced2e1;
}
.step-list .swiper-slide:nth-child(8) .step-circle {
	background: #dadeeb;
}
.stepCont-list .tit span {
	color: #6e82bd;
	font-weight: 500;
	font-size: 20px;
	position: relative;
}
.stepCont {
	padding-top: 60px;
}
.stepCont-list {
	text-align: center
}
.stepCont-list .tit {margin-bottom: 80px;}
.stepCont-list .tit span::after {
	content: '';
	position: absolute;
	background: #334c93;
	width: 32px;
	height: 2px;
	left: 50%;
	margin-left: -16px;
	top:-16px;
}
.stepCont-list .tit div {
	font-size: 24px;
	font-weight: 500;
	color: #334c93;
	margin: 15px 0 20px;
}
.stepCont-list .tit p {
	color: #777777;
	line-height: 24px;
	padding: 0 70px;
	font-size: 15px;
}
.stepCont-list img {
	width: auto;
}
.sol-step01 .step-cont {
	display: flex;
	justify-content: space-between;
	padding: 0 165px;
	position: relative
}
/*.sol-step01 .vs {
    animation: ani1 1.5s linear;
	position: absolute;
	left: 50%;
	margin-left: -82px;
	top: 55px;
}
.sol-step01 .s-other .person,
.sol-step01 .s-wats .person{
	animation: ani2 1.5s linear;
	position: absolute;
	transition:all 1s ease-in-out;
	top: 0
}
.sol-step01 .s-other .person{
	animation-delay: 0.5s;
	left: 165px;
}
.sol-step01 .s-wats .person{
	right: 165px;
	animation-delay: 0.8s;
}*/
.sol-step01 .vs {
	margin-top: 55px;
}
.sol-step01 .wlogo {
	position: absolute;
	bottom: 82px;
	left: 50%;
	margin-left: -100px;
}
.sol-step01 .s-other .arrow,
.sol-step01 .s-wats .arrow{
	position: absolute;
	display: flex;
	justify-content: center;
	left: 50%;
	z-index: -1;
}
.sol-step01 .s-other .arrow {
	top:126px;
	margin-left: -118px;
}
.sol-step01 .s-wats .arrow {
	margin-left: -10px;
	z-index: 1
}
.sol-step01 .s-other .arrow span {
	animation : up-down 1.2s infinite linear;
	height: 0;
}
.sol-step01 .s-wats .arrow span {
	animation : up-down2 1.2s infinite linear;
	height: 0;
}
.sol-step01 .s-other .arrow span:nth-child(2) {
	animation-delay: 2s;
}
.sol-step01 .s-other .arrow span:nth-child(3) {
	animation-delay: 3s;
}
.sol-step01 .s-other .arrow span:nth-child(4) {
	animation-delay: 1s;
}
.sol-step01 .s-other .arrow span:nth-child(5) {
	animation-delay: 2s;
}
@keyframes up-down{
	from{transform: translatey(-50px); opacity: 0}
	to{transform: translatey(16px); opacity: 1}
}
@keyframes up-down2{
	from{transform: translatey(-50px); opacity: 0}
	to{transform: translatey(-20px); opacity: 1}
}
.sol-step01 .s-other .arrow span {
	margin: 0 13px;
}
.sol-step01 .s-other,
.sol-step01 .s-wats {
	position: relative;
	width: 300px;
}
.sol-step01 .c-box {
	display: flex;
	margin-top: 145px;
}
.sol-step01 .c-box li {
	width: 90px;
	padding: 25px 0;
	font-weight: 300;
	font-size: 14px;
	color: #fff;
	margin: 0 5px;
}
.sol-step01 .c-box li:nth-child(1) {
	background: #4164c6;
}
.sol-step01 .c-box li:nth-child(2) {
	background: #4f67ad;
}
.sol-step01 .c-box li:nth-child(3) {
	background: #334c93;
}
/*@keyframes ani1 { 
	0% {top:-1000px; opacity: 0}
	100% {top:55px; opacity: 1}
}
@keyframes ani2 { 
	0% {top:-1000px; opacity: 0}
	100% {top: 0; opacity: 1}
}*/
.sol-step02 {position: relative}
.sol-step02 .step-cont {
	position: relative;
	padding-top: 23px;
}
.sol-step02 .person {
	position: absolute;
	top: 191px;
	left: 120px;
	z-index: 10;
}
.sol-step02 .move {
	position: absolute;
	left: 170px;
	top: 75px;
	z-index: 11;
	animation:  move 2s linear infinite alternate;
}

@keyframes move{
	from{transform: translatey(-10px)rotate(25deg);;}
	to{transform: translatey(0px)rotate(25deg);; }
}
.sol-step02 .step-cont div ul {
	display: flex;
	justify-content: center;
	align-items: center;
}
.sol-step02 .step-cont div ul li {
	padding: 20px 11px;
	line-height: 20px;
}
.sol-step02 .step-cont div ul li:nth-child(1) {
	width: 172px;
	text-align: left;
}
.sol-step02 .step-cont div:nth-child(3) ul li:nth-child(2),
.sol-step02 .step-cont div:nth-child(3) ul li:nth-child(3),
.sol-step02 .step-cont div:nth-child(3) ul li:nth-child(4){
	min-height: 81px;
	line-height: 81px;
	padding: 0;
}
.sol-step02 .step-cont div:nth-child(4) ul li:nth-child(2),
.sol-step02 .step-cont div:nth-child(4) ul li:nth-child(3),
.sol-step02 .step-cont div:nth-child(4) ul li:nth-child(4){
	min-height: 101px;
	line-height: 101px;
	padding: 0;
}
.sol-step02 .step-cont div:nth-child(5) ul li:nth-child(1),
.sol-step02 .step-cont div:nth-child(5) ul li:nth-child(4){
	min-height: 101px;
	line-height: 101px;
	padding: 0 11px;
}
.sol-step02 .step-cont div:nth-child(5) ul li:nth-child(3) {
	padding: 20px 30px;
	min-height: 101px;
	border-bottom: 0
}
.sol-step02 .step-cont div:nth-child(2) ul li:nth-child(1),
.sol-step02 .step-cont div:nth-child(2) ul li:nth-child(2),
.sol-step02 .step-cont div:nth-child(2) ul li:nth-child(4){
	border-top: 1px solid #d4d4d4
}
.sol-step02 .step-cont div:first-child ul li:nth-child(1),
.sol-step02 .step-cont div:first-child ul li:nth-child(2),
.sol-step02 .step-cont div:first-child ul li:nth-child(4),
.sol-step02 .step-cont div:nth-child(5) ul li:nth-child(1),
.sol-step02 .step-cont div:nth-child(5) ul li:nth-child(2),
.sol-step02 .step-cont div:nth-child(5) ul li:nth-child(4){
	border-bottom: 0
}
.sol-step02 .step-cont div:first-child ul li:nth-child(2),
.sol-step02 .step-cont div:first-child ul li:nth-child(4) {
	font-weight: bold;
	color: #000
}
.sol-step02 .step-cont div ul li:nth-child(1),
.sol-step02 .step-cont div ul li:nth-child(2),
.sol-step02 .step-cont div ul li:nth-child(4) {
	border-bottom: 1px solid #d4d4d4
}
.sol-step02 .step-cont div ul li:nth-child(3) {
	width: 254px;
	color: #fff;
	border-bottom: 1px solid #556aa5
}
.sol-step02 .step-cont div ul li:nth-child(2),
.sol-step02 .step-cont div ul li:nth-child(4){
	width: 226px;
	color: #a3a3a3
}
.sol-step02 .box1 {
	position: absolute;
	border: 1px solid #b5b5b5;
	border-radius: 10px 10px;
	width: 229px;
	height: 445px;
	top: 23px;
	left: 285px;
}
.sol-step02 .box3 {
	position: absolute;
	border: 1px solid #b5b5b5;
	border-radius: 10px 10px;
	width: 229px;
	height: 445px;
	top: 23px;
	right: 115px;
}
.sol-step02 .box2 {
	position: absolute;
	border: 1px solid #b5b5b5;
	border-radius: 10px 10px;
	width: 253px;
	height: 490px;
	top: 0;
	right: 343px;
	background: #334c93;
	z-index: -1;
	animation:         shadow 2s linear infinite alternate;
}
@keyframes shadow {
	0% { box-shadow: 0 0 40px #334c93; background: #334c93;}
	100% { box-shadow: 0 0 0 #334c93;; background: #4164c6}
}

.sol-step04 {
	position: relative;
}
.sol-step04 .step-cont{
	position: relative;
	height: 630px;
}
.sol-step04 .step-cont::after {
	content: '';
	width: 100%;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 315px;
	background: #f0f2f5;
	z-index: -1
}
.sol-step04 .receipt {
	background: url("images/content/img_solution04_01.png")no-repeat;
	width: 620px;
	height: 496px;
	position: absolute;
	top: 60px;
	left: 160px;
	padding: 83px 95px 0 120px;
}
@keyframes up-down3{
	from{transform: translatey(-20px);}
	to{transform: translatey(0px); }
}
.sol-step04 .receipt dl {
	border-bottom: 1px solid #cbcbcb;
	padding: 18px 15px;
}
.sol-step04 .receipt dt {
	text-align: left;
}
.sol-step04 .receipt dd {
	text-align: right;
	margin-top: 12px;
	font-size: 20px;
	color: #4b68c7
}
.sol-step04 .receipt dd strong {
	color: #334c93
}
.sol-step04 .receipt dl:nth-child(3) {
	border-bottom: 2px solid #000;
}
.sol-step04 .receipt dl:last-child {
	border-bottom: 0;
	border-top: 1px solid #000000;
	margin-top: 2px;
}
.sol-step04 .ex {
	width: 300px;
	top: 290px;
	position: absolute;
	right: 75px;
	text-align: left;
}
.sol-step04 .ex dt {
	font-weight: bold;
	margin-bottom: 15px
}
.sol-step04 .ex dd {
	line-height: 27px;
}
.sol-step04 button {
	background: #334c93;
	font-size: 18px;
	padding: 20px 70px;
	color: #fff;
}
.sol-step04 button:hover {
	box-shadow: 0 0 30px #334c93
}
.sol-step04 .coin1 {
	position: absolute;
	top: 354px;
	left: 140px;
	z-index: 1;
	animation : up-down3 1.2s infinite linear;
}
.sol-step04 .coin2 {
	position: absolute;
	top: 444px;
	left: 210px;
	z-index: 2;
	animation : up-down3 1.2s infinite linear;
	animation-delay: 0.1s;
}
.sol-step04 .receipt dl:last-child dd {
	color: #de580f;
	font-size: 24px;
}
.sol-step05 .step-cont{
	position: relative;
}
.sol-step05 .top {
	display: flex;
	justify-content: center;
	position: relative;
}
.sol-step05 .top .arrow {
	position: absolute;
	left: 430px;
	top:165px;
}
.sol-step05 .top .report {
	position: absolute;
	right: 0;
	top: 0;
}
.sol-step05 .top>div:nth-child(1) {
	margin-right: 65px;
	margin-top: 10px;
}
.sol-step05 .top>div:nth-child(3) {
	width: 516px;
}
.sol-step05 .bottom {
	background: #f0f2f5;
	padding: 65px 50px 95px;
	position: absolute;
	top:360px;
	z-index: -1;
	width: 100%;
	text-align: left;
}
.sol-step05 .g-logo {
	position: absolute;
	left: 50%;
	margin-left: -97px;
	top:80px;
}
.sol-step05 .bottom span {
	width: 480px;
	display: inline-block;
	line-height: 24px;
}
.graph-m {
	width: 516px;
	padding: 125px 30px 30px 40px;
}
.graph-m .g-tit {
	margin-bottom: 15px
}
.graph-m .g-tit,
.graph-m .g-graph{
	display: flex;
	font-size: 11px;
	align-items: center
}
.graph-m .g-graph div {
	height: 232px;
	flex: 1
}
.graph-m .g-graph div span::before {
	background: #e1e4ee;
	content: '';
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: -1;
	left: 0;
}
.graph-m .g-graph div.g1 span::after,
.graph-m .g-graph div.g2 span::after,
.graph-m .g-graph div.g3 span::after,
.graph-m .g-graph div.g4 span::after,
.graph-m .g-graph div.g5 span::after{
	content: '';
	width: 100%;
	position: absolute;
	z-index: -1;
	left: 0;
	bottom: 0;
}
.graph-m .g-graph div.g1 span::after {
	background: #f47458;
	height: 30%;
	animation : g1 1.2s infinite linear;
}
.graph-m .g-graph div.g2 span::after {
	background: #1ca887;
	height: 70%;
	animation : g2 1.2s infinite linear;
}
.graph-m .g-graph div.g3 span::after {
	background: #516cd2;
	height: 80%;
	animation : g3 1.2s infinite linear;
}
.graph-m .g-graph div.g4 span::after {
	background: #c44068;
	height: 50%;
	animation : g4 1.2s infinite linear;
}
.graph-m .g-graph div.g5 span::after {
	background: #7b40c4;
	height: 90%;
	animation : g5 1.2s infinite linear;
}
@keyframes g1{
	from{ height: 0}
	to{ height: 30%}
}
@keyframes g2{
	from{ height: 0}
	to{ height: 70%}
}
@keyframes g3{
	from{ height: 0}
	to{ height: 80%}
}
@keyframes g4{
	from{ height: 0}
	to{ height: 50%}
}
@keyframes g5{
	from{ height: 0}
	to{ height: 90%}
}
.graph-m .g-graph div span {
	background: url("images/content/img_solution05_04.png")no-repeat;
	width: 35px;
	margin: 0 auto;
	height: 100%;
	display: inline-block;
	position: relative;
}
.graph-m .g-tit div,
.graph-m .g-rate div{
	flex: 1;
}
.graph-m .g-rate {
	display: flex;
	font-size: 18px;
	align-items: center;
	font-weight: bold;
	margin-top: 15px
}
.graph-m .g-rate .g1 {
	color: #f47458
}
.graph-m .g-rate .g2 {
	color: #1ca887;
}
.graph-m .g-rate .g3 {
	color: #516cd2;
}
.graph-m .g-rate .g4 {
	color: #c44068;
}
.graph-m .g-rate .g5 {
	color: #7b40c4;
}
.sol-step06 .step-cont {
	position: relative;
	padding: 0 110px;
	display: flex;
	align-items: center;
	height: 460px;
}
.sol-step06 .step-cont::after {
	background: #eff1f7;
	content: '';
	position: absolute;
	left: 50%;
	margin-left: -230px;
	width: 460px;
	height: 460px;
	border-radius: 460px 460px;
	z-index: -1;
}
.sol-step06 .step-cont .person1,
.sol-step06 .step-cont .person3{
	width: 258px;
}
.sol-step06 .step-cont .person1 span,
.sol-step06 .step-cont .person3 span{
	color: #fff;
	font-size: 18px;
	position: absolute;
	top:257px;
	display: block;
	padding: 0 35px;
	line-height: 24px;
}
.sol-step06 .step-cont .person2 {
	flex: 1
}
.sol-step06 .step-cont .arrow {
	width: 85px;
}
.sol-step06 .step-cont .person1,
.sol-step06 .step-cont .person2,
.sol-step06 .step-cont .person3{
	position: relative;
	height: 460px;
}
.sol-step06 .step-cont .person1 .img1,
.sol-step06 .step-cont .person3 .img1{
	position: absolute;
	top: 88px;
	left: 0;
}
.sol-step06 .step-cont .person1 .img2 {
	top: 57px;
	right: 28px;
	position: absolute;
}
.sol-step06 .step-cont .person3 .img2 {
	top: 57px;
	left: 28px;
	position: absolute;
}
.sol-step06 .step-cont .person2 .img1 {
	position: absolute;
	top:45px;
	left: 26px;
}
.sol-step06 .step-cont .person2 .img2 {
	position: absolute;
	top:25px;
	left: 0;
}
.sol-step06 .step-cont .person2 .img3 {
	position: absolute;
	top:195px;
	right: 0;;
}
.sol-step06 .step-cont .person2 .img4 {
	position: absolute;
	top:195px;
	left: 33px;
}
.sol-step06 .step-cont .person2 .img5 {
	position: absolute;
	top:350px;
	right: 15px;
}
.sol-step06 .step-cont .person2 .img6 {
	position: absolute;
	top:350px;
	left:13px;
}
.sol-step06 .speech1,
.sol-step06 .speech2{
	animation : up-down3 1.2s infinite linear;
	animation-delay: 0.1s;
}
.sol-step07 .step-cont {
	padding: 0 45px 440px;
	position: relative;
}
.sol-step07 .step-cont::after {
	background: url("images/content/img_solution07_04.jpg")no-repeat;
	content: '';
	width: 1100px;
	height: 403px;
	position: absolute;
	left: 0;
	bottom: 0
}
.sol-step07 .step-cont.p1::after {
	background: url("images/content/img_solution07_05.jpg")no-repeat;
	content: '';
	width: 1100px;
	height: 403px;
	position: absolute;
	left: 0;
	margin-top: 35px;
}
.sol-step07 .step-cont.p2::after {
	background: url("images/content/img_solution07_06.gif")no-repeat;
	content: '';
	width: 1100px;
	height: 403px;
	position: absolute;
	left: 0;
	margin-top: 35px;
}
.sol-step07 .step-cont.p3::after {
	background: url("images/content/img_solution07_07.jpg")no-repeat;
	content: '';
	width: 1100px;
	height: 403px;
	position: absolute;
	left: 0;
	margin-top: 35px;
}
.sol-step07 .step-cont ul {
	display: flex;
}
.sol-step07 .step-cont li {
	flex: 1;
	margin: 0 30px;
	padding: 125px 20px 35px;
	color: #334c93;
	cursor: pointer
}
.sol-step07 .step-cont li:nth-child(1) {
	background: #ebf3fa url("images/content/img_solution07_01.png")center 35px no-repeat;
}
.sol-step07 .step-cont li:nth-child(2) {
	background: #ebf3fa url("images/content/img_solution07_03.png")center 35px no-repeat;
}
.sol-step07 .step-cont li:nth-child(3) {
	background: #ebf3fa url("images/content/img_solution07_02.png")center 35px no-repeat;
}
.sol-step07 .step-cont li p {
	line-height: 24px;
	margin-top: 30px;
}
.sol-step07 .step-cont li strong {
	display: block;
	font-size: 22px;
}
.sol-step08 .step-cont {
	position: relative
}
.sol-step08 .circle01,
.sol-step08 .circle02,
.sol-step08 .circle03 {
	position: absolute;
	z-index: -1;
	-webkit-animation:spin 4s linear infinite;
    -moz-animation:spin 4s linear infinite;
    animation:spin 4s linear infinite;
}
.sol-step08 .circle01 {
	right: 190px;
	z-index: -1;
	-webkit-animation:spin1 10s linear infinite;
    -moz-animation:spin1 10s linear infinite;
    animation:spin1 10s linear infinite;
}
.sol-step08 .circle02 {
	left: 230px;
	top: 50px;
	-webkit-animation:spin1 10s linear infinite;
    -moz-animation:spin1 10s linear infinite;
    animation:spin1 10s linear infinite;
}
.sol-step08 .circle03 {
	-webkit-animation:spin3 10s linear infinite;
    -moz-animation:spin3 10s linear infinite;
    animation:spin3 10s linear infinite;
}
@-moz-keyframes spin1 { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin1 { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin1 { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }
@-moz-keyframes spin3 { 100% { -moz-transform: rotate(-360deg); } }
@-webkit-keyframes spin3 { 100% { -webkit-transform: rotate(-360deg); } }
@keyframes spin3 { 100% { -webkit-transform: rotate(-360deg); transform:rotate(-360deg); } }


/* user */
.userWrap,
.tip-user{
	margin: 30px 0 0;
}

.userWrap img {
	width: 70%;
}
.userWrap .img {
	margin-top: 70px;
}
.userWrap p {
	text-align: center;
	padding: 20px 40px 50px;
	line-height: 24px;
}
.userWrap p strong {font-weight: bold; color: #334c93}
.card-list {
	margin: 70px -30px ;

}
.card-list>div {
	display: flex;
}
.card-list>div:last-child {
	margin-top: 30px;
}
.flip-card {
    background-color: transparent;
	min-height: 500px;
	flex: 1;
	margin: 0 30px;
	cursor: pointer
}

.flip-card-inner {
	position: relative;
	width: 100%;
	height: 100%;
	text-align: center;
	transition: transform 0.6s;
	transform-style: preserve-3d;
}

.flip-card:hover .flip-card-inner {
	transform: rotateY(180deg);
}

.flip-card-front, .flip-card-back {
	position: absolute;
	width: 100%;
	height: 100%;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.flip-card-front {
	background: #ebf3fa url("images/content/user_img02.png") no-repeat center top 80px;
	color: #334c93;
	font-size: 22px;
	font-weight: bold;
	line-height: 30px;
	padding: 220px 60px 0;
}

.flip-card-back {
	background: #334c93 url("images/content/user_img03.png") no-repeat center top 50px;
	color: white;
	transform: rotateY(180deg);
	font-size: 16px;
	line-height: 20px;
	padding: 160px 30px 0;
}

.faqWrap {
	background: #f0f2f5;
	padding: 90px 0;
}
.faqWrap h3 {
	color: #334c93
}
.faqWrap p {
	margin-top: 30px;
	text-align: right;
	color: #888
}
.faqWrap p a {
	font-weight: bold;
	color: #334c93
}
/* tab */
.tabWrap {margin-top: 50px;}
.tabWrap .tab-type li {
	background: #e0e4eb;
	color: #253153;
	display: inline-block;
	padding: 0 15px;
	height: 42px;
	line-height: 42px;
	cursor: pointer;
	margin-right: 5px;
	margin-top: 5px;
}
.tabWrap .tab-type {
	display: flex;
	flex-wrap: wrap;
}
.tabWrap .tab-type li.current{color: #fff;background: #253153}
.tabWrap .tabcontent {display: none;background-color:none;color:#111;}
.tabWrap .tabcontent.current {display: block;}
.faqList {margin-top: 25px;}
.faqList li {margin-bottom: 12px; cursor: pointer;}
.faqList li .faqCont {display:none; background: #f6f8f9;padding: 25px 35px; line-height: 20px}
.faqList li .subject {
	background: #fff;
	padding: 25px 35px;
	font-weight: bold;
}
.faqList li.on .subject {
	color: #0052e9
}
.faqList li .subject>div:before,
.faqList li .subject>div:after,
.faqList li.on .subject>div:before{
	content: "";
	position:absolute;
	background:#414141;
}
.faqList li .subject>div,
.faqList li.on .subject>div{position: relative}
.faqList li.on .subject>div:before,
.faqList li .subject>div:before{
	right: 0;
	top:50%;; 
	height:2px;
	width: 18px;
	transform:translateX(-50%);
}
.faqList li.on .subject>div:before,
.faqList li.on .subject>div:after{background: #0052e9}

.faqList li.on .subject>div:after{
	top:9px;
	right: 17px;
	height:18px;
	width: 2px;
	transform:translateY(-50%);
}
/* attorney */

.attorneyWrap02,
.attorneyWrap03,
.attorneyWrap04{
	margin: 90px 0 0;
}
.attorneyWrap01 {
	background: url("images/content/bg_advt.jpg"); 
	padding: 90px 0; 
	position: relative;
}
.attorneyWrap01 .tit {
	font-size: 30px;
	color: #334c93;
}
.attorneyWrap01 .tit strong {
	display: block;
	font-size: 48px;
	color: #2756db;
	line-height: 70px;
}
.attorneyWrap01 ul {
	padding: 100px 0 0 300px;
	background: url("images/content/attr_img04.png") no-repeat 15px bottom;
}
.attorneyWrap01 ul li {
	font-size: 18px;
	line-height: 30px;
	margin-top: 50px;
}
.attorneyWrap01 ul li:first-child {
	margin-top: 0;
}

.beneCont {
	display: flex;
	justify-content: space-between;
	margin: 50px -10px;
	flex-wrap: wrap;
	align-items: center;
	position: relative
		
}
.beneCont::after {
	content: '';
	position: absolute;
	left: 50%;
	width: 1px;
	height: 100%;
	top: 0;
	background: #c8cfe2;
}
.beneCont div {
	font-size: 20px;
	line-height: 28px;
	position: relative;
	width: 50%;
	min-height: 38px;
}
.beneCont div:nth-child(1),
.beneCont div:nth-child(3) {
	padding-right: 70px;
	padding-left: 65px;
	background: url("images/content/attr_img06.png") no-repeat left 50%;
	padding-top: 40px;
	padding-bottom: 40px;
}
.beneCont div:nth-child(2),
.beneCont div:nth-child(4) {
	padding-left: 155px;
	background: url("images/content/attr_img06.png") no-repeat 85px 50%;
	padding-top: 40px;
	padding-bottom: 40px;
}
.OblCont {
	padding: 60px 0;
}
.OblCont>div {
	text-align: center;
	padding: 40px 60px;
	margin-top: 20px;
	display: flex;
	align-items: center;
	line-height: 24px;
	justify-content: center;
}
.OblCont>div:first-child {
	background: #ccd3e1;
}
.OblCont>div:nth-child(2) {
	background: #dfe4ec;
}
.OblCont>div:nth-child(3) {
	background: #e8ebf1;
}
.OblCont>div:nth-child(4) {
	background: #d4dae6;
}
.regCont {
	display: flex;
	align-items: center;
	justify-content: space-around;
	padding: 90px 0;
}
.regCont>div {
	width: 245px;
	text-align: center;
	padding: 25px 0;
	line-height: 24px;
}
.regCont>div:first-child {
	background: #efefef;
}
.regCont>div:nth-child(3) {
	background: #dfe3eb;
}
.regCont>div:nth-child(5) {
	background: #ccd3e1;
}
.regCont>div:nth-child(7) {
	background: #a6b1c9;
}

.attorneyWrap03 dl{
	background: #ebf3fa;
	display: flex;
}
.attorneyWrap03 dt {
	font-size: 34px;
	color: #334c93;
	font-weight: bold;
	text-align: center;
	padding: 70px 50px;
	background: url("images/content/attr_img05.png") no-repeat center bottom 70px;

}
.attorneyWrap03 dd {
	padding: 80px 50px 80px 0;
}
.attorneyWrap03 dd>div {
	font-size: 18px;
	line-height: 30px;
	margin-top: 50px;
	background: url("images/content/attr_img03.png") no-repeat left top;
	padding-left: 80px;
}
.attorneyWrap03 dd>div:first-child {
	margin-top: 0;
}
.attorneyWrap03 dt,
.attorneyWrap03 dd {
	flex: 1;
}
.attorneyWrap04 {
	padding-bottom: 150px;
}
.attorneyWrap04 button {
	background: #334c93;
	font-size: 18px;
	padding: 25px 70px;
	color: #fff;
	box-shadow: 0 0 30px #334c93
}
.attorneyWrap04 .finger {
	position: absolute;
	left: 50%;
	width: auto;
	margin-left: 90px;
	margin-top: 25px;
}

/* how */
.howWrap01,
.howWrap03{
	margin: 90px 0
}

.howWrap02 {
	margin: 90px -10px 0;
}
.howWrap04 {
	margin: 90px 0 0
}
.howWrap02 dl {
	width: 350px;
	height: 390px;
	margin-top: 20px;
	padding: 0 25px;
	text-align: center;
	margin: 10px 10px;
	position: relative;
	background: #eaf3fa
}
.howWrap02 dl.org {
	background: #faf3eb
}
.howWrap02 dl.org dt {
	color: #e75021;
}
.howWrap02 dl.org dd {
	color: #b34723;
}
.howWrap02 dl.arrow01::after {
	content: '';
	background: url("images/content/how_img01.png") no-repeat right bottom;
	position: absolute;
	right: 0;
	bottom: 0;
	width: 85px;
	height: 63px;
}
.howWrap02 dl.arrow02::after {
	content: '';
	background: #eaf3fa url("images/content/how_img01.png") no-repeat right bottom;
	transform: rotate(90deg);
	position: absolute;
	right: -10px;
	bottom: 10px;
	width: 85px;
	height: 63px;
}
.howWrap02 dl.arrow03::after {
	content: '';
	background: #eaf3fa url("images/content/how_img01.png") no-repeat right bottom;
	transform: rotate(180deg);
	position: absolute;
	right: 0px;
	bottom: 0px;
	width: 85px;
	height: 63px;
}
.howWrap02 dl.arrow04::after {
	content: '';
	background: #faf3eb url("images/content/how_img02.png") no-repeat right bottom;
	transform: rotate(90deg);
	position: absolute;
	right: -10px;
	bottom: 10px;
	width: 85px;
	height: 63px;
}
.howWrap02 dl.complete::after {
	content: '';
	background: #faf3eb url("images/content/how_img03.png") no-repeat right bottom;
	position: absolute;
	right: 10px;
	bottom: 10px;
	width: 80px;
	height: 80px;
}
.howWrap02 dl dt {
	font-size: 22px;
	font-weight: bold;
	padding: 50px 0;
	color: #324c96;
	line-height: 26px;
}
.howWrap02 dd {
	color: #324c96;
	line-height: 22px;
}
.howWrap02 .detailCont {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	padding: 60px 0 90px;
}


.overview {
	position: relative;
	height: 1000px;
	padding: 90px 0
}
.overview .o-right .arrow6 {
	position: absolute;
	top: 60px;
	left: -306px;
	z-index: 10
}
.overview .o-right .arrow7 {
	position: absolute;
	top: 212px;
	left: -306px;
	z-index: 10
}
.overview .o-right .arrow8 {
	position: absolute;
	top: 138px;
	right: -27px;
	z-index: 20
}
.overview .o-left {
	position: absolute;
	left: 75px;
	width: 500px;
}
.overview .o-right {
	position: absolute;
	right: 120px;
	width: 240px;
	top: 575px;
}
.overview .o-left>div,
.overview .o-right>div{
	position: relative;
	text-align: center;
}

.overview .o-left>div strong,
.overview .o-right>div strong{
	text-align: center;
	color: #334c93;
	font-size: 24px;
	display: block;
	margin-bottom: 20px;
}
.overview .o-right>div strong {
	color: #d8721e!important
}
.overview .o-left ul {
	width:290px;
	text-align: center;
	padding: 20px 25px;
	margin: 20px auto;
	position: relative;
}
.overview .o-left ul::after {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	background: #f5f6fa;
	content: '';
	border: 1px solid #334c93;
	z-index: -1;
}
.overview .o-left li,
.overview .o-right li{
	margin:0 auto 20px!important;
	width: 240px;
}
.overview .o-left li:last-child {
	margin:0 auto !important;
}
.overview .o-left>div .box1,
.overview .o-left>div .box2,
.overview .o-left>div .box3,
.overview .o-left>div .box4,
.overview .o-left>div .box5 span,
.overview .o-right>div .box1,
.overview .o-right>div .box2,
.overview .o-right>div .box3{
	width: 240px;
	margin: 0 auto;
	padding: 20px 0;
	font-size: 14px;
}
.overview .o-left>div .box4 {
	padding: 40px 0!important;
	margin: 44px auto 0!important;
}
.overview  img {
	width: auto
}
.overview .o-left>div,
.overview .o-right>div{
	position: relative
}
.overview .o-left .arrow1 {
	position: absolute;
	left: 50%;
	margin-left: -5px;
}
.overview .o-left .arrow2 {
	position: absolute;
	left: 50%;
	margin-left: -5px;
	top: 192px;
}
.overview .o-left .arrow3 {
	position: absolute;
	left: 50%;
	margin-left: -5px;
	top: 270px;
}
.overview .o-left .arrow4 {
	position: absolute;
	left: 50%;
	margin-left: -5px;
	top:348px
}
.overview .o-left .arrow5 {
	position: absolute;
	left: 50%;
	margin-left: -5px;
	top:426px
}
.overview .o-left .arrow6 {
	position: absolute;
	left: 50%;
	margin-left: -5px;
	top:503px
}
.overview .o-left>div .box1 {
	background:#577ade;
	border: 1px solid #577ade;
	color: #fff;
}
.overview .o-left>div .box2 {
	background:#687caf;
	border: 1px solid #687caf;
	color: #fff;
}
.overview .o-left>div .box3 {
	background:#fff;
	border: 1px dashed #334c93;
	color: #334c93;
}
.overview .o-left>div .box4 {
	background:#334c93;
	border: 1px solid #334c93;
	color: #fff;
}
.overview .o-left>div .box5 {
	display: flex;
}
.overview .o-left>div .box5 span:first-child {
	background: #41bad5;
	border: 1px solid #41bad5;
	color: #fff;
}
.overview .o-left>div .box5 span:last-child {
	background: #6a47c5;
	border: 1px solid #6a47c5;
	color: #fff;
}

.overview .o-right>div .box1 {
	background:#d94f20;
	border: 1px solid #d94f20;
	color: #fff;
}
.overview .o-right>div .box2 {
	background:#d8721e;
	border: 1px solid #d8721e;
	color: #fff;
}
.overview .o-right>div .box3 {
	background:#d99e20;
	border: 1px solid #d99e20;
	color: #fff;
}
.overview .o-right .arrow1 {
	position: absolute;
	left: 50%;
	margin-left: -5px;
	top: 94px;
}
.overview .o-right .arrow2 {
	position: absolute;
	left: 50%;
	margin-left: -5px;
	top: 172px;
}
.overview .o-right .txt {
	position: absolute;
	left: -270px;
	margin-left: -5px;
	top: 192px;
	color: #d94f20
}
.howWrap04 {background: #f0f2f5; padding:90px 0;}
.howWrap04 .video {
	width: 100%;
	height: 100%;
}
.howWrap04 .s-tit {
	padding: 60px 0 30px;
	text-align: center
}
.howWrap04 .s-tit strong {
	display: block;
	margin-bottom: 15px;
	color: #324c96;
		font-size: 22px;
	text-decoration: underline

}
.howWrap04 .s-tit p {
	display: block;
}
.circleBg {
    background-color: #c6e2f1!important;
}

.circle_move{
    position:absolute;
    top:50%;
    left:50%;
    text-align:center;
    border-radius:100px;
    z-index:1
}
.circle_move {width: 25px; height: 25px;}
.circle_move .ripple {width:120px;height:120px; margin:-60px 0 0 -60px;}
.circle_move .ripple{
    position:absolute;
    width:120px;
    height:120px;
    z-index:-1;
    top:50%;
    left:50%;
    opacity:0;
    margin:-60px 0 0 -60px;
    border-radius:100px;
    -webkit-animation:ripple 1.8s infinite;
    animation:ripple 1.8s infinite
}
.circle_move:hover .ripple{
    -webkit-animation:ripple 0s infinite;
    animation:ripple 0s infinite;
}
@-webkit-keyframes ripple{
    0%{
        opacity:1;
        -webkit-transform:scale(0);
        transform:scale(0)
    }
    100%{
        opacity:0;
        -webkit-transform:scale(0);
        transform:scale(0)
    }
}
@keyframes ripple{
    0%{
        opacity:1;
        -webkit-transform:scale(0);
        transform:scale(0)
    }
    100%{
        opacity:0;
        -webkit-transform:scale(1);
        transform:scale(1)
    }
}
.circle_move .ripple:nth-child(2){
    animation-delay:.3s;
    -webkit-animation-delay:.3s
}
.circle_move .ripple:nth-child(3){
    animation-delay:.6s;
    -webkit-animation-delay:.6s
}

/* term */
.txtWrap {
	max-width: 1200px;
	margin: 0 auto;
	padding: 80px 20px;
}
.txtWrap .s-Title h3 {
	font-size: 40px;
	line-height: 65px;
	color: #244e9c;
	font-weight: 500;
	margin-bottom: 20px;
}
.txtWrap .txtArea {
	line-height: 24px;
	font-size: 14px;
}