@charset "utf-8";

/* nav 3 common */
.diagram {position:relative; width:100%:}
.diagram ul {width:100%; margin-bottom:10px;}
.diagram ul:after {clear:both;content:"";display:block;}
.diagram ul li {position:relative; float:left; width:21.25%; text-align:center; border:1px solid #bbbbbb; background-color:#fff; margin-right:5%; padding-top:28px; padding-bottom:18px; margin-bottom:40px;}
.diagram ul li span {display:block;}
.diagram ul li.step1:before {content:"01";}
.diagram ul li.step2:before {content:"02";}
.diagram ul li.step3:before {content:"03";}
.diagram ul li.step4:before {content:"04";}
.diagram ul li.step5:before {content:"05";}
.diagram ul li.step6:before {content:"06";}
.diagram ul li:before {position:absolute; top:5px; left:10px; font-size:1.6rem; color:#d31045; font-weight:400; line-height:30px; opacity:.8;}
.diagram ul li.cancel:before {}
.diagram ul li.step1:after, .diagram ul li.step2:after, .diagram ul li.step3:after, .diagram ul li.step4:after,
.diagram ul li.step5:after, .diagram ul li.step6:after {content:""; position:absolute; top:50%; right:-17%; margin-top:-23px; background:url('../img/img-right-arrow.png') 0px 0px no-repeat; width:20px; height:45px; background-size:20px 45px;}

.btn-download {position:relative; float:right; padding:14px 24px 14px 50px; color:#fff; background-color:#464e5b; border:1px solid #3d434e; display:inline-block; text-align:left;}
.btn-download span {position:absolute; top:10px; left:20px; color:#fff; font-size:20px;}

@media only screen and (min-width:1201px) {
	.diagram ul li.step4,
	.diagram ul li.step6 {margin-right:0;}
	.diagram ul li.step4:after,
	.diagram ul li.step6:after {display:none;}
	.diagram ul li.step5, .diagram ul li.step6 {margin-bottom:10px;}
}

@media only screen and (max-width:1200px) {
	.diagram ul li.step3,
	.diagram ul li.step6 {margin-right:0;}
	.diagram ul li.step3:after,
	.diagram ul li.step6:after {display:none;}
	.diagram ul li.step4,
	.diagram ul li.step5,
	.diagram ul li.step6 {margin-bottom:10px;}

	.diagram ul li {width:30%; }
	.diagram ul li.step1:after, .diagram ul li.step2:after, .diagram ul li.step3:after, .diagram ul li.step4:after,
	.diagram ul li.step5:after, .diagram ul li.step6:after {right:-12%;}
}

@media only screen and (max-width:1000px) {
	.diagram ul li.step1:after, .diagram ul li.step2:after, .diagram ul li.step3:after, .diagram ul li.step4:after,
	.diagram ul li.step5:after, .diagram ul li.step6:after {right:-14%;}
}

@media only screen and (max-width:900px) {
	.diagram ul li.step3 {margin-right:10%;}
	.diagram ul li.step3:after {display:block;}
	.diagram ul li.step2,
	.diagram ul li.step4,
	.diagram ul li.step6 {margin-right:0;}
	.diagram ul li.step2:after,
	.diagram ul li.step4:after {display:none;}
	.diagram ul li.step4 {margin-bottom:40px;}

	.diagram ul li {width:45%;  margin-right:10%;}
	.diagram ul li.step1:after, .diagram ul li.step2:after, .diagram ul li.step3:after, .diagram ul li.step4:after,
	.diagram ul li.step5:after, .diagram ul li.step6:after {right:-16%;}
}

@media only screen and (max-width:600px) {
	.diagram ul li {width:100%; margin-right:0px; padding-top:10px; padding-bottom:10px; margin-bottom:40px; }
	.diagram ul li.step2,
	.diagram ul li.step3,
	.diagram ul li.step4,
	.diagram ul li.step6 {margin-right:0;}
	.diagram ul li.step4,
	.diagram ul li.step5 {margin-bottom:40px;}

	.diagram ul li.step2:after,
	.diagram ul li.step4:after {display:block;}

	.diagram ul li.step1:after, .diagram ul li.step2:after, .diagram ul li.step3:after, .diagram ul li.step4:after,
	.diagram ul li.step5:after, .diagram ul li.step6:after {content:""; position:absolute; top:unset; bottom:-36px; left:50%; margin-left:-75px; background:url('../img/img-bottom-arrow.png') 0px 0px no-repeat; width:150px; height:27.5px; background-size:150px 27.5px;}
	.diagram ul li.step8:nth-child(8n):after {display:none;}
}

@media print {
	.diagram ul li.step4,
	.diagram ul li.step6 {margin-right:0;}
	.diagram ul li.step4:after,
	.diagram ul li.step6:after {display:none;}
	.diagram ul li.step5, .diagram ul li.step6 {margin-bottom:10px;}
}

.table {width:100%; height:auto;}
.table table {width:100%; table-layout: fixed;}
.table table tr th {background-color:#f2f7f5; padding:8px 0; font-weight:300; color:#222; border-top:2px solid #282828;}
.table table tr td {padding:10px 5px; color:#565656;}

.table table tr td.tal {padding-left:10px;}
.table table tr th, .table table tr td {border-left:1px solid #dddddd; border-bottom:1px solid #dddddd;}
.table table tr th:last-child, .table table tr td:last-child {border-right:1px solid #dddddd;}
.table table tr th .small, .table table tr td .small {font-size:80%; color:#528acf;}
.table table tr td span {display:block; color:#222; font-weight:400;}

.table table .m-txt-break {display:block; margin-bottom:5px;}
.table table .m-txt-break:last-child {margin-bottom:0px;}
.table table tr .pc-view {display:table-cell;}
.table table tr td.pc-view, .table table tr th.pc-view {display:table-cell;}
.table table tr .m-view {display:none;}

@media only screen and (max-width:768px) {
	.table table tr .pc-view {display:none;}
	.table table tr td.pc-view, .table table tr th.pc-view {display:none;}
	.table table tr .m-view {display:block;}
	.table table tr th.mline, .table table tr td.mline {border-right:1px solid #dddddd;}
	.table table tr td {text-align:center; padding:10px 4px;}
}

ol.family-list {display:block; text-align:left; padding:20px;}
ol.family-list li {padding:0 0 0 60px; text-align:left;}
ol.family-list li span.num {margin-left:-60px; font-weight:400;}

.table-dl dl {display:flex; position:relative; width:100%;}
.table-dl dl dt, .table-dl dl dd {float:left; display:inline-block; padding:16px 0; text-align:center; text-align:left; border-left:1px solid #cdcdcd; border-bottom:1px solid #cdcdcd;}
.table-dl dl:before,
.table-dl dl:after {content:""; display:block; clear:both;}
.table-dl dl:first-child dt, .table-dl dl:first-child dd {border-top:1px solid #cdcdcd;}

.table-dl dl dt {width:24%; background-color:#f2f7f5;}
.table-dl dl dd {width:76%; border-right:1px solid #cdcdcd;}
.table-dl dl.over-dt dt {width:30%;}
.table-dl dl.over-dt dd {width:70%;}
.table-dl dl dt label, .table-dl dl dd label {position:relative; display:block; width:100%; line-height:1.3; padding:0 20px 6px 20px;}
.table-dl dl dt label b, .table-dl dl dd label b {font-weight:400;}
.table-dl dl dt label:last-child, .table-dl dl dd label:last-child {padding:0 20px 0 20px;}
.table-dl dl dd label span {display:block;}

@media screen and (max-width:450px) {
	.table-dl dl dt {width:32%; max-width:100px;}
	.table-dl dl dd {width:68%;}
	.table-dl dl.over-dt dt {width:46%; max-width:100%;}
	.table-dl dl.over-dt dd {width:54%;}

	.table-dl dl dt label, .table-dl dl dd label {padding:0 8px 6px 8px;}
	.table-dl dl dt label:last-child, .table-dl dl dd label:last-child {padding:0 8px 0 8px;}
}

.edu-step {display:block; width:100%; height:auto;}
.edu-step  div {padding:60px 20px 30px 10px; position:relative;}
.edu-step .edu-step1,
.edu-step .edu-step2,
.edu-step .edu-step3 {float:left; width:33.3%;}
.edu-step .edu-step1, .edu-step .edu-step3 {background-color:#f2f7f5;}
.edu-step .edu-step2 {background-color:#fff;}
.edu-step {border:1px solid #bbbbbb;}
.edu-step .edu-step2 {border-left:1px dotted #7b7d7f; border-right:1px dotted #7b7b7b;}

.edu-step div h2 {position:absolute; top:20px; left:20px; color:#8fb1ac; }
.edu-step div ol li {padding-left:16px; color:#444; }
.edu-step div ol.l-num li span.num {margin:0 0 0 -16px;}


@media only screen and (max-width:768px) {
	.edu-step .edu-step1,
	.edu-step .edu-step2,
	.edu-step .edu-step3 {width:100%; float:unset;  }
	.edu-step {border:1px solid #bbbbbb;}
	.edu-step .edu-step2 {border-left:0; border-right:0; border-top:1px dotted #7b7d7f; border-bottom:1px dotted #7b7d7f;}
}

.circle-5-div {position:relative; width:100%; margin-top:20px;}
.circle-5-div .circle-item {float:left; position:relative; width:20%; text-align:center;}
.circle-5-div .circle-item .circle-container {position:relative; width:200px; height:200px; border-radius:100px 100px; margin:0 auto; display:table;}
.circle-5-div .circle-item .circle-container:after {content:""; position:absolute; top:100px; right:-25px; margin-top:-2.5px; width:20px; height:5px; background:url('../img/img_arrow.png') 0 0 no-repeat; }
.circle-5-div .circle-item:last-child .circle-container:after {content:none;}

.circle-5-div .circle-item .circle-container .circle-wrap {color:#fff; display:table-cell; vertical-align:middle; font-weight:400; font-size:1.8rem;}
.circle-5-div .circle-item .circle-container .circle-wrap label span {display:block;}

.circle-item .info-wrap {width:80%; margin:0 auto; text-align:center; border:1px solid #cdcdcd; margin-top:30px;}
.circle-item .info-wrap p.subject {background-color:#f2f7f5; color:#222; font-weight:300; padding:10px 16px; border-bottom:1px solid #cdcdcd; line-height:1.3;}
.circle-item .info-wrap p.content {padding:30px 16px; color:#222; font-weight:400;}

.circle-item .info-wrap.two-info-rowspan {position:absolute; margin-left:-90%; width:180%;}

@media only screen and (max-width:1200px) {
	.circle-5-div .circle-item .circle-container:after {right:-20px;}
}

@media only screen and (max-width:1000px) {
	.circle-5-div .circle-item .circle-container {width:160px; height:160px; border-radius:80px 80px;}
	.circle-5-div .circle-item .circle-container:after {top:80px; right:-20px;}
	.circle-5-div .circle-item .circle-container .circle-wrap {font-size:1.7rem;}
}

@media only screen and (max-width:768px) {
	.circle-5-div {margin-top:0;}
	.circle-5-div .circle-item .circle-container:after {content:none;}
	.circle-5-div .circle-item {width:100%; text-align:center;}
	.circle-5-div .circle-item .circle-container {margin:20px 0 20px 0;}
	.circle-5-div.m-center .circle-item .circle-container {margin:20px auto;}

	.circle-item .info-wrap.two-info-rowspan {margin-left:0; position:relative; width:70%; margin:20px 0; float:right;}
	.circle-item .info-wrap {margin:20px 0; float:right; width:70%;}
	.circle-item .info-wrap p.content {padding:16px;}
	.circle-item .info-wrap.part2 {margin-top:0px;}
	.circle-5-div:before {content:""; position:absolute; top:30px; left:79px; width:1px; height:80%; background-color:#a8cfd2;}
	.circle-5-div.m-center:before {content:""; position:absolute; top:30px; left:50%; margin-left:-0.5px; width:1px; height:80%; background-color:#a8cfd2;}
}

@media only screen and (max-width:450px) {
	.circle-5-div .circle-item .circle-container .circle-wrap {font-size:1.6rem;}
	.circle-item .info-wrap.two-info-rowspan {width:50%;}
	.circle-item .info-wrap {width:60%;}
}

.vision-header {position:relative; width:100%; text-align:center; margin-bottom:50px;}
.vision-header .icon-quote {display:block; margin-bottom:30px; text-align:center;}
.vision-header .icon-quote img {width:40px;}
.vision-header:after {content:""; position:absolute; bottom:-80px; left:50%; margin-left:-1px; width:2px; height:50px; background-color:#333;}

.vision-header h2 {font-weight:300;}
.vision-header h1 {font-weight:500; color:#d31045;}

.round-container {position:relative; width:100%; height:400px;}
.round-box {position:absolute; display:table; top:50px; left:50%; margin-left:-120px;  width:240px; height:240px; z-index:10; background-color:#fff; border-radius:120px 120px; border:25px solid #f3f3f3;}
.round-wrap {position:relative; display:table-cell; vertical-align:middle; text-align:center; font-weight:600; color:#222; font-size:2.4rem; }

.sub-round-3-div {position:relative; width:100%; padding:0 0 50px 0;}
.sub-round-3-div .round-item {float:left; position:relative; display:table; width:33.3333%; text-align:center;}
.sub-round-3-div .round-item .sub-round-wrap {position:relative; width:200px; height:200px; border-radius:100px 100px; margin:0 auto; background-color:#8b9193; display:table;}
.sub-round-3-div .round-item .sub-round-wrap:after {content:""; position:absolute; top:-50px; left:50%; width:2px; height:50px; background-color:#e9e9e9; }
.sub-round-3-div .round-item:nth-child(1):before {content:""; position:absolute; top:-50px; left:50%; width:200%; height:2px; background-color:#e9e9e9;}
.sub-round-3-div .round-item:nth-child(2):before {content:""; position:absolute; top:-120px; left:50%; width:2px; height:120px; background-color:#e9e9e9;}

.sub-round-wrap .sub-round-info {color:#fff; display:table-cell; vertical-align:middle; font-weight:400;}
.sub-round-wrap .sub-round-info span {display:block;}

.sub-round-3-div .round-item .info-wrap {width:80%; margin:0 auto; text-align:center;}
.sub-round-3-div .info-wrap p.title {font-weight:600; color:#222; margin-top:30px;}
.sub-round-3-div .info-wrap p.subject {margin-top:20px; background-color:#f6f6f6; color:#222; font-weight:600; padding:14px 30px;}
.sub-round-3-div .info-wrap ol {margin-top:20px; text-align:left;}

.hidden-wrap .info-wrap p.title {font-weight:600; color:#222; margin-top:30px;}
.hidden-wrap .info-wrap p.subject {margin-top:20px; background-color:#f6f6f6; color:#222; font-weight:600; padding:14px 30px;}
.hidden-wrap .info-wrap ol {margin-top:20px; text-align:left;}
.hidden-wrap {display:none;}

@media only screen and (max-width:1100px) {
	.round-item .info-wrap {display:none;}
	.hidden-wrap {display:block;}
}

@media only screen and (max-width:768px) {
	.round-container {height:340px;}
	.round-box {margin-left:-100px; width:200px; height:200px; border-radius:100px 100px; border:20px solid #f3f3f3;}
	.round-wrap:before {top:40px; font-size:18px;}
	.round-wrap {font-size:2.2rem; }

	.sub-round-3-div .round-item .sub-round-wrap {width:160px; height:160px; border-radius:80px 80px;}
	.sub-round-wrap .sub-round-info span {display:none;}

	.sub-round-3-div .round-item .sub-round-wrap:after {top:-40px; height:40px; }
	.sub-round-3-div .round-item:nth-child(1):before {top:-40px; left:50%; width:200%; height:2px; }
	.sub-round-3-div .round-item:nth-child(2):before {top:-120px; left:50%; width:2px; height:120px;}
}

@media only screen and (max-width:600px) {
	.round-container {height:300px;}

	.sub-round-3-div .round-item .sub-round-wrap:after {top:-25px; height:25px; }
	.sub-round-3-div .round-item:nth-child(1):before {top:-25px; left:50%; width:200%; height:2px; }
	.sub-round-3-div .round-item:nth-child(2):before {top:-60px; left:50%; width:2px; height:120px;}
	.sub-round-3-div .round-item .sub-round-wrap {width:90%; height:60px; border-radius:10px 10px;}
}

.tab .tab-head-list li {width:50%; float:left; margin-bottom:0;}
.tab .tab-head-list li:nth-child(1), .tab .tab-head-list li:nth-child(2), .tab .tab-head-list li:nth-child(3) {border-bottom:0;}