body{font:17px/28px wf_segoe-ui_normal, 'Segoe UI', Verdana, Arial, sans-serif; }
*{margin:0; padding:0;}
img{max-width: 100%; vertical-align:middle;}
h1, h2, h3, h4, h5, p, h6, ul, li, ol, dd, dl, dt, input { list-style:none; font-weight:400;}
a{color:#538ffe; text-decoration:none;}
a:hover{text-decoration:underline;}
.clear{clear:both;}
.detail{width: 1000px;margin:0 auto;}
 /* ------------*/

.main01{background:#1e1d2d url(../seoimg/bg1.jpg) no-repeat  top center; height:534px;}
.main01 h1{font-size: 38px; font-weight: bold; color: #14bcfb; padding-top:85px; margin-bottom:40px;}
.main01 h1 span{color:#f25623;}
.main01 .detail > p{color:#fff; margin:25px 0;}
.main01 img.pic{float:right;margin: -12px -190px 0 0;}
.main01 .btn a{display: inline-block;width: 244px; height: 49px; margin:35px 20px 0 0;}
.main01 .btn a.left{background: url(../seoimg/win-jp.png);}
.main01 .btn a.right{background: url(../seoimg/mac-jp.png);}
.main01 .btn a:hover{background: url(../seoimg/win-jph.png);}
.main01 .btn a.right:hover{background: url(../seoimg/mac-jph.png);}
 /* ------------*/

.main02{color:#666; padding:70px 0;}
.main02 .list_box{border:3px solid #5fb3f5; border-radius:8px; box-sizing:border-box; padding:6px; margin-bottom:60px;}
.main02 .list_box .ti{margin:-23px 0 0 12px; color:#5fb3f5;  position:relative; font-size:19px; z-index:1;}
.main02 .list_box .ti i{border:3px solid #fff; position:absolute; top:13px; left:-6px; width:143px; z-index:-1;}
.main02 .list_box .ti b{text-shadow:#fff 3px 0px 0px, #fff 2.83487px 0.981584px 0px, #fff 2.35766px 1.85511px 0px, #fff 1.62091px 2.52441px 0px, #fff 0.705713px 2.91581px 0px, #fff -0.287171px 2.98622px 0px, #fff -1.24844px 2.72789px 0px, #fff -2.07227px 2.16926px 0px, #fff -2.66798px 1.37182px 0px, #fff -2.96998px 0.42336px 0px, #fff -2.94502px -0.571704px 0px, #fff -2.59586px -1.50383px 0px, #fff -1.96093px -2.27041px 0px, #fff -1.11013px -2.78704px 0px, #fff -0.137119px -2.99686px 0px, #fff 0.850987px -2.87677px 0px, #fff 1.74541px -2.43999px 0px, #fff 2.44769px -1.73459px 0px, #fff 2.88051px -0.838246px 0px;}
.main02 .list_box ol li{line-height:35px; list-style:decimal inside; padding-left:12px;}
.main02 .list_box ol li a{color:#666; text-decoration:none;}
.main02 .list_box ol li a:hover{color:#008CE5;}
.main02 .list_box ol li:last-child{list-style:none;}
.main02 .list_box ol li:last-child a{color:#f25623;}
.main02 .list_box ol li:last-child a:hover{text-decoration:underline;}

.main02 .step_box ul li{position:relative; padding:0 0 25px 35px;}
.main02 .step_box ul li:before{content:''; width:3px; background-color:#ccd5db; position:absolute; top:35px; bottom:0; left:6px;}
.main02 .step_box ul li .step{font-size:25px; font-weight:700; color:#90969a; position:relative;}
.main02 .step_box ul li .step:before{content:''; position:absolute; left:-34px; top:50%; margin-top:-4px; width:8px; height:8px; border-radius:50%; border:3px solid #6bb6ff;}
.main02 .step_box ul li:first-child .step:before{background-color:#6bb6ff;}
.main02 .step_box ul li .con{border-bottom:1px dashed #ccd5db; padding-bottom:10px;}
.main02 .step_box ul li:last-child .con{border-bottom:0; padding-bottom:0;}
.main02 .step_box ul li h2{font-size:20px; font-weight:700; color:#333; margin:6px 0 10px;}
.main02 .step_box ul li .img{text-align:center;}
.main02 .step_box ul li p{margin:30px 0;}
.main02 .step_box .b_txt{margin-top:40px;}
 /* ------------*/

.main03{background:#2a2d34 url(../mediatrans-jp/images/mtpro/bg1.jpg) no-repeat center; height:508px; text-align:center; overflow:hidden;}
.main03 .t_btn > span{display:block; color:#fff; font-size:25px; margin:45px 0 40px;}
.main03 .t_btn a{display:inline-block; font-size:25px; color:#fff; text-decoration:none; position:relative; z-index:1; font-weight:700;}
.main03 .t_btn a:before{content:''; position:absolute; bottom:-4px; left:0; height:20px; border-radius:5px; background-color:#1e910b; width:100%; z-index:-1;}
.main03 .t_btn a span{display:block; padding:20px 160px; background-color:#26e703; border-radius:5px; transition:All 0.2s ease-in-out; position:relative; overflow:hidden;}
.main03 .t_btn a span:before{content:''; position:absolute; left:-30%; top:50%; margin-top:-50px; width:30px; height:100px; transform:rotate(30deg); background-image:-webkit-gradient(linear,left bottom,right bottom,color-stop(0%,rgba(255,255,255,0)),color-stop(50%,rgba(255,255,255,1)),color-stop(100%,rgba(255,255,255,0))); animation:shiny 2s infinite linear;}
@keyframes shiny{
	0%{left:-30%}
	30%{left:120%;}
	100%{left:120%}
}
.main03 .t_btn a span:hover{transform:translateY(4px); background-color:#2cbe15;}
.main03 .title{font-size:30px; color:#fff; text-align:left; font-weight:700; margin:70px 0 15px;}
.main03 .btns_box .left{float:left; width:430px;}
.main03 .btns_box .right{float:right; width:430px;}
.main03 .btns_box a{display:block; border:2px solid #fff; padding:7px 60px; text-decoration:none; border-radius:3px; margin:35px 0; color:#fff;}
.main03 .btns_box a:hover{background-color:#67c5ff;}
  /* ------------*/

.MainOther02 { background:url(../img/footline-fift.png) top repeat-x #2c303c; padding:20px 0; text-align:center;}
.MainOther02 span.t{ color:#cbcbcb; font-size:18px; display:inline-block; line-height:36px; }
.MainOther02 .Fot { height:36px; padding-bottom:15px; display:inline-block; padding:0 30px 0 10px;}
.MainOther02 .Fot a img { display:inline; }
.MainOther02 .sup{ display:inline-block;line-height:36px; padding-left:10px;}
.MainOther02 .sup a.right{ display:inline-block; margin-left:15px;}
  /* ------------*/

.MainFoot { background:#1f222a; color:#6a7480; text-align:center; line-height:23px;font-size: 13px;}
.MainFoot img{vertical-align:middle;}
.MainFoot .details { padding:15px 0; }
.MainFoot p { padding:3px 0;  }
.MainFoot p a { color:#6a7480; text-decoration:none;}
.MainFoot p a:hover { text-decoration:underline; color:#6a7480;}
.MainFoot p i { display:block; height:40px; line-height:38px; font-style:normal;}
.MainFoot h6 { font-size:13px; padding:8px 100px 0; font-weight:400;}
  /* ------------*/

.DivNav {  width: 100%; height: 80px; background: #2b2d33; display:none;}
.DivNav .Logo {   float: left; padding: 17px 0 0; }

.DivNav ul {  float: right;  padding: 23px 0 0; }
.DivNav ul li { width: 160px; float: left;  font-size: 19px; color: #babcbd;  }
.DivNav ul li a { color: #babcbd;  text-decoration: none; }
.DivNav .Download { width: 160px; float: right; height: 40px; z-index: 0; position: relative; overflow: hidden; margin: 18px 0 0;
	  }
.DivNav span {  display: block; width: 160px;  height: 40px; display: block; text-align: center; background: #02acfa;
	color: #fff; float: right;  border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; -o-border-radius: 3px; line-height: 40px;
	font-size:17px; cursor: pointer; transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; -o-transition: 0.5s all; }
.DivNav span a {  text-decoration: none; color: #fff; }
.DivNav .shadow:before {  content:""; width:100px; height:50px; display:block; background-color:rgba(255,255,255,.2);
transform:rotate(-70deg); position:absolute; top:0; right:-20%;transition:all .5s ease-in-out;-webkit-transition:all .5s ease-in-out;
-moz-transition:all .5s ease-in-out;-o-transition:all .5s ease-in-out; z-index:10; }
.DivNav .shadow:hover:before { width:200px; height:200px; top: -60px; }

.NavFixed{position: fixed; top: 0; left:0; z-index: 100; display:block;}
/*----------------*/

.left-share{position:fixed; left:0; top:50%; margin-top:-108px;}
.left-share a{width:48px; height:48px; display:block; margin:2px 0;}
.left-share a:hover{margin-left:10px;}

@media (max-width: 979px) {

	.detail{width:95%;}
	.mobileNo{display:none;}
	/* ------------*/

	.main01{height:auto; padding-bottom:50px; background-size:cover;}
	.main01 h1{padding-top:50px;}
	.main01 img.pic{width:500px; margin-right:0;}
	/* ------------*/

	.main03{height:auto; background-size:cover; overflow:hidden;}
	.main03 .btns_box .left, .main03 .btns_box .right{float:none;}
	/* ------------*/

	.MainOther02 .details{width:95%;}
	/* ------------*/

}

@media (max-width: 767px) {
	.DivNav .Download { display: none; }
	.DivNav ul li { width: 140px;   font-size: 17px; }
}

@media (max-width: 479px) {

	.main01 h1{font-size:23px;}
	.main01 .detail > p{font-size:15px;}
	.main01 img.pic{display:none;}
	/* ------------*/

	.main03 .t_btn a{font-size:20px;}
	.main03 .t_btn a span{padding:15px 80px;}
	.main03 .title{font-size:27px;}
	.main03 .btns_box .left, .main03 .btns_box .right{width:100%;}
	.main03 .btns_box a{padding:7px 35px;}
	/* ------------*/

	.MainFoot h6{padding:8px;}
	/* ------------*/

	.DivNav { height: auto; }
	.DivNav ul {  float: right; display: block; padding: 23px 0 ; }

	.left-share{bottom:0; top:auto; width:100%; text-align:center;}
	.left-share a, .left-share a:hover{width:48px; height:40px; display:inline-block; margin:1px 0;}
	
}