@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800');

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}

ol, ul {list-style: none;}
a {text-decoration:none;}
*{
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

body {
	min-width: 992px;
	overflow: scroll;
}


.navbar-default{margin-bottom:0;}

.topsection{padding: 10px 0 30px;}
.topsocial{float:right;}
.topsocial li{display:inline-block; padding:5px;}
.topsocial li img{max-width:30px; width:100%;}
.toptext a{display:inline-block;}
.toptext a img{max-width:500px; width:100%; margin:10px auto;}
.mainav .navbar-collapse ul.nav {float: none; margin:20px 0 60px; display:inline-block}
.mainav .navbar-collapse ul.nav li {float: none; display: inline-block;}
.mainav .navbar-collapse ul.nav li a {color:#fff; padding:0 20px; font-size:18px; letter-spacing:1px;}
.mainav .navbar-collapse ul.nav li a span{display:block; font-size:12px; color:#B9C6DA;}
.mainav .navbar-collapse ul.nav li a:hover {background-color:transparent;}
.toplogo a{display:inline-block; color:#fff; position:relative; font-size:50px; margin:5px 0; padding:10px 0; letter-spacing:2px;}
.toplogo a:before{content:""; background-color:#fff; position:absolute; top:0; left:0; right:0; margin:0 auto; height:3px; width:50px;}
.toplogo a span{display:block; font-size:18px; margin-top:10px;}

.middmenu{background-color:#EDF1F6; padding:20px 0;}
.middmenu ul{display:inline-block; width:80%;}
.middmenu ul li{float:left; margin:5px 0; padding:-1px 15px; position:relative; width:11.11%; text-align:center; font-size:24px; font-weight:600; color:#000; line-height:1.3;}
.middmenu ul li + li:before 
{content: ""; background: 		url(../img/flow/angle-right.png) no-repeat;
	width: 13px;
	height: 24px;position: absolute; left: -5px; top: 29px; font-size: 36px; font-weight: 400; color: #333;
}
.middmenu ul li span{display:block; font-size:16px; font-weight:500; margin-top:5px;}

.middsec{padding:30px 0 0;margin: 0 auto;}
.maintit h2{margin:30px 0; letter-spacing:10px; font-size:22px; color:#fff; font-weight:500;}
.timeline{display:inline-block; width:100%; padding:40px 55px 0;}

.tilinetext{position:relative; width:50%; float:left; padding:30px 100px 20px 100px; min-height:260px;}
.tilinetext:before {content: ""; background-image: url('../img/flow/collum.png'); position: absolute; background-repeat: no-repeat; background-position: right top; background-size:100% 100%; width: 55px; height: 200px; right: -15px; top: 0;}
.tilinetext:after {content: ""; position: absolute; top: 0px; right: 0; width: 100%; background-image: url('../img/flow/collumline.png'); z-index: -1; height: 120px; background-repeat: no-repeat; background-position: right top; background-size:100% 100%;}
.tilinetext h1 {color: #fff; font-size: 120px; line-height: 1.3; display: inline-block; text-shadow: 9px 3px 2px #45608D; position: absolute; left: 0; top: 0;}
.tilinetext h3{color:#fff; font-size:19px; line-height:1.3; margin:5px 0;}
.tilinetext p {
	text-align: justify;
	color: #fff; font-size: 13px; line-height: 1.7; margin: 3px 0; display: inline-block; width: 100%; letter-spacing: 1px;}
.tilinetext a{width:100%; height:39px; display:inline-block; color:#5070A3; text-align:center; padding:10px; margin:10px 0; line-height:1.2; letter-spacing:1px; background-color:#fff;}
.tilinetext a:hover{background-color: #5070A3; color: white; border: solid 1px white;}
.tilinetext h5 {
	position: absolute; color: #fff; right: -10px; top: 40%; transform: rotateZ(90deg); font-size: 12px; 
	line-height:1.2;
}
.timeline .tilinesec:nth-child(2n) .tilinetext h5{left:-50px; right:auto;}
.tilineimg{float:left; width:50%; text-align:center; position:relative;}
.tilineimg img{display:block; margin:0 auto; max-width:100%; padding:50px 0;}
img.plane{
	display:block; 
	max-width:100%; 
	padding:50px 0;  
	margin-top: -80px;   
	margin-right: 20px;
	float: right;
}
.plane_right{background:url(../img/flow/plane_right.png) no-repeat;background-position: 0px 160px}
.timeline .tilinesec:nth-child(2n) .tilinetext{float:right; margin-top:12px; padding: 30px 50px 20px 9%;}
.timeline .tilinesec:nth-child(2n) .tilinetext:before{right:auto; left:-40px; background-image: url('../img/flow/collum1.png');}
.timeline .tilinesec:nth-child(2n) .tilinetext:after{background-image: url('../img/flow/collumline1.png'); background-position:-22px top;}
.timeline .tilinesec:nth-child(2n) .tilinetext h1{left:100px;}
/*.timeline .tilinesec:nth-child(2) .tilinetext:before{background-image: url('../img/flow/collum1.png'); height:220px;}
.timeline .tilinesec:nth-child(3) .tilinetext:before{background-image: url('../img/flow/collum1.png'); height:220px;}*/
.timeline .tilinesec:nth-child(4) .tilinetext {margin-top:-18px;}
/*.timeline .tilinesec:nth-child(4) .tilinetext:before{background-image: url('../img/flow/collum1.png'); height:220px;}*/
.timeline .tilinesec:nth-child(5) .tilinetext {margin-top:-8px;}
/*.timeline .tilinesec:nth-child(5) .tilinetext:before{background-image: url('../img/flow/collum1.png'); height:220px;}
.timeline .tilinesec:nth-child(6) .tilinetext:before{background-image: url('../img/flow/collum1.png'); height:220px;}*/
.timeline .tilinesec:nth-child(6) .tilinetext {margin-top:0px;}
.timeline .tilinesec:nth-child(6) .tilinetext h5 {left: -40px;}
.timeline .tilinesec:nth-child(7) .tilinetext {margin-top:-10px;}
/*.timeline .tilinesec:nth-child(7) .tilinetext:before{background-image: url('../img/flow/collum1.png'); height:220px;}
.timeline .tilinesec:nth-child(8) .tilinetext:before{background-image: url('../img/flow/collum1.png'); height:220px;}*/
.timeline .tilinesec:nth-child(8) .tilinetext {margin-top:10px;}
.timeline .tilinesec:nth-child(8) .tilinetext h5 {left: -40px;}
.timeline .tilinesec:nth-child(8) img.balloon {position: absolute; left: 30px; top: -30px;}
/*.timeline .tilinesec:nth-child(9) .tilinetext:before{background-image: url('../img/flow/collum1.png'); height:220px;}*/
.timeline .tilinesec:nth-child(9) .tilinetext {margin-top:-2px;}
.bottombg img{margin-bottom:-1px;width: 100%;}
/*.bottombg img{margin-bottom: 0px;
    width: 400px;}
*/
.aboutsec{padding:40px 0; background-color:#EDF1F6;}
.aboutsec h3{font-size:20px; font-weight:500; margin:10px 0 20px; display:inline-block; position:relative; padding:0 25px; background-color:#EDF1F6;}
.aboutsec h3:before{content:""; background-color:#444; width:20px; height:1px; position:absolute; left:0; top:16px;}
.aboutsec h3:after{content:""; background-color:#444; width:20px; height:1px; position:absolute; right:0; top:16px;}
.aboutsec p{line-height:2.2; margin:3px 0; font-weight:500; letter-spacing:2px; font-size:12px; /*display:inline-block;*/ width:100%;}

.copright{padding:70px 0 20px;}
.copright p{color:#fff; font-size:12px; text-align:right;}

#backtop{color: #fff; float: right; position: fixed; right: 40px; bottom: 40px; font-size:10px; text-align:center; text-transform:uppercase; z-index: 9999; cursor:pointer;}
#backtop i {display: block; font-size: 50px; font-weight: 300; line-height: 0.6;}

.timeline{
	padding-top: 0;
}
.tilinetext:before{
	background: none;
}
.tilinetext{
	width: calc(50% - 25px);
}
.timeline .tilinesec:nth-child(2n) .tilinetext:before{
	background-image: none;
}

@media screen and (max-width:1274px){
	.timeline .tilinesec:nth-child(2) .tilinetext:before{
		height: 242px;
	}
	.timeline .tilinesec:nth-child(3) .tilinetext:before{
		height: 194px;
	}
	.timeline .tilinesec:nth-child(4) .tilinetext:before{
		height: 242px;
	}
	.timeline .tilinesec:nth-child(5) .tilinetext:before{
		height: 194px;
	}
	.timeline .tilinesec:nth-child(6) .tilinetext:before{
		height: 242px;
	}
	.timeline .tilinesec:nth-child(7) .tilinetext:before{
		height: 194px;
	}
	.timeline .tilinesec:nth-child(8) .tilinetext:before{
		height: 242px;
	}
	img.plane{
		padding: 30px 0 70px 0;
	}
}
@media screen and (max-width:1199px){
	/*.tilinetext p {font-size: 12px;}*/
	/*.timeline .tilinesec:nth-child(2) .tilinetext:before {height: 260px;}*/
	/*.timeline .tilinesec:nth-child(3) .tilinetext:before {height: 170px;}*/
	.timeline .tilinesec:nth-child(4) .tilinetext:before{height: 240px;}
	.timeline .tilinesec:nth-child(5) .tilinetext {margin-top: 0;}
	.timeline .tilinesec:nth-child(6) .tilinetext:before{height: 257px;}
	.timeline .tilinesec:nth-child(7) .tilinetext:before{height: 177px;}
	.timeline .tilinesec:nth-child(8) .tilinetext:before{height: 260px;}
	.timeline .tilinesec:nth-child(7) .tilinetext {margin-top: 0;}
	.timeline .tilinesec:nth-child(7) .tilinetext h5{
		/*right: -5px;*/
	}
	img.plane {
		padding: 5% 0 13.5% 0;
	}
}
@media screen and (max-width:991px){
/*.mainav .navbar-collapse ul.nav li a {padding: 0 10px;}

.tilinetext {min-height: inherit;}
.tilinesec {
	display: inline-block; 
	width: 100%;
}
.timeline .tilinesec:nth-child(2) .tilinetext:before {height: 200px;}
.tilinetext h5 {top: 50%;}
*/
}
@media screen and (min-width:768px){
.navbar-default #navbar{display:none;}

}
@media screen and (max-width:767px){
.topsocial{text-align:center; width:100%;}
.middmenu ul li {width: 33.33%;}
.middmenu ul li + li:before{display:none;}
.tilinetext:before{display:none;}
.tilinetext h5{display:none;}

}

/*@media screen and (max-width:640px){
.tilinetext:after{display:none;}
.timeline {padding: 20px 10px 0;}
.tilinetext, .timeline .tilinesec:nth-child(2n) .tilinetext {padding: 30px 30px 20px 100px;}
.timeline .tilinesec:nth-child(2n) .tilinetext h1 {left: 0;}
.tilineimg img {padding: 30px 0;}
#backtop {right: 15px; bottom: 15px;}

}
@media screen and (max-width:480px){
.middmenu ul li {width: 50%;}
.maintit h2 {letter-spacing: 6px; font-size: 16px;}
.tilinetext h1 {font-size: 60px;}
.tilinetext, .timeline .tilinesec:nth-child(2n) .tilinetext {padding: 15px 10px 15px 50px;}
.copright {padding: 50px 0;}
.copright p{text-align:center;}

}*/

h1 {
	font-size: 160px !important;
	font-family: "Myriad PRo";
	font-weight: 100;
}
.tilinetext .final_content{
	display: flex;
}
.section_container .content_wrapper{
	width: 100%;
	position: relative;
}
.section_container .content_center_border{
	position: absolute;
	width: 50px;
	border: 1px solid #fff;
	border-bottom: none;
	left: calc(50% - 25px);
	height: 100%;
	background: #5070A3;
}
.section_container .content_center_border_end{
	position: absolute;
	background: url(../img/flow/center_border_seperater_end.png) no-repeat;
/*    background-repeat-y: no-repeat;*/
	width: 60px;
    height: 39px;
    background-size: contain;
    left: calc(50% - 25px);
    top: calc(100%);
}
.section_container .content_center_shadowborder{
	position: absolute;
	width: 60px;
	border: none;
	left: calc(50% - 25px);
	height: calc(100% - 7px);
	background: #45628E;
	z-index: -1;
	top: 7px;
}
.timeline .tilinesec:nth-child(2n) .tilinetext h5{
	left: -60px;
}
.tilinetext:before{
	background: url(../img/flow/center_border_seperater.png) no-repeat;
	width: 60px;
    height: 39px;
    background-size: contain;
    right: -60px;
    top: -10px;
}
.timeline .tilinesec:nth-child(1) .tilinetext:before{
	background-image: none;
}
.timeline .tilinesec:nth-child(2n) .tilinetext:before{
	background-image: url(../img/flow/center_border_seperater.png);
	width: 60px;
    height: 39px;
    background-size: contain;
    left: -50px;
    top: -10px;
}


.timeline .tilinesec:nth-child(4) .tilinetext h5{
	left: -61px;
}
.timeline .tilinesec:nth-child(5) .tilinetext h5{
	right: -50px;
}
.timeline .tilinesec:nth-child(6) .tilinetext h5{
	left: -51px;
}
.timeline .tilinesec:nth-child(7) .tilinetext h5{
	right: -46px;
}
.timeline .tilinesec:nth-child(8) .tilinetext h5{
	left: -50px;
}
.plane_right{
	background: none;
}
.plane_right .plane_panel_1 img.myplane{
	position: absolute;
	bottom: 113px;
	left: -281px;
}
.plane_right .plane_panel_2 img.plane_sep{
	position: absolute;
	bottom: 0px;
	left: 0px;
}
.tilinetext{
	padding-left: 0px;
	display: flex;
	padding-right: 60px;
}
.tilinetext .section_number{
	width: 16%;
}
.timeline .tilinesec:nth-child(2n) .tilinetext .section_number{
	width: 20%;
}
.tilinetext .section_number img{
	max-width: 100%;
}
.tilinetext .section_content{
	width: 75%;
	padding-left: 20px;
}
.section4_h5_img{
	background: url(../img/flow/l1.png) no-repeat;
	width: 48px;
	height: 94px;
	position: absolute;
	left: -49px;
    top: 24%;
}
.section5_h5_img{
	background: url(../img/flow/l2.png) no-repeat;
	width: 48px;
	height: 94px;
	position: absolute;
	right: -49px;
    top: 24%;
}
.section6_h5_img{
	background: url(../img/flow/l3.png) no-repeat;
	width: 48px;
	height: 94px;
	position: absolute;
	left: -49px;
    top: 24%;
}
.section7_h5_img{
	background: url(../img/flow/l4.png) no-repeat;
	width: 48px;
	height: 94px;
	position: absolute;
	right: -49px;
    top: 24%;
}
.section8_h5_img{
	background: url(../img/flow/l5.png) no-repeat;
	width: 48px;
	height: 94px;
	position: absolute;
	left: -49px;
    top: 24%;
}
@media screen and (max-width:768px){	
	.pc{
		display: none;
	}
	.sp{
		display: block;
	}
	.menu-open{
		position: fixed;
    	right: 257px;
	}
	.container{
		width: 100%;
	}
	.top-bar{
		display: none;
	}
	.pre_header{
		position: relative;
		height: 53px;
    	background: #324B73;
	}
	.content{
		margin-top: 22px;
	}
	.logo_wrapper{
		width: calc(100% - 60px - 41px);
		padding: 15.5px 16px 0px 25px;
		float: left;
	}
	.logo img{
		max-width:100%;
		max-height: 32.5px;
	    margin: 0;
	}
	.menu-trigger{
		display: block;
		top: 1px;
	}
	.menu-sep{
		width: 2px;
		height: 32px;
		border-left: 2px solid #fff;
		margin: 11px 55px 0px 0px;
	}
	.footer{
		text-align: center;
		margin-bottom: 34px;
	}
	.footer span.copyright{
		margin: 0 auto;
		float: inherit;
	}
	.photo-item{
		width: 45%;
		margin: 5px 5px auto;
	}
	.photo-item-title-bar{
		position: absolute;
		bottom: 7px;
		margin-top: 0px !important;
		width: 100%;
	}
	.photo-item .item-caption{
		max-width: 100%;
	}
	.triangle{
		display: block;
		width: 100%;
	    height: 93px;
	    border-bottom-right-radius: 20px;
	    z-index: 50;
	    background: #4B5379;
	    opacity: 0.8;
	    top: initial;
	    left: initial;
	    bottom: 0px;
	}
	.sp-nav-wrap ul.nav-bar li:last-child{
		border-bottom: none;
	}
	.sp-nav-wrap .sns_btn_wrapper{
		margin: 0 auto;
	}
	.sp-nav-wrap ul.nav-bar li:last-child i{
		display: block;
	    width: 31px;
	    height: 31px;
	    cursor: pointer;
	    display: inline-block;
	}
	.sp-nav-wrap ul.nav-bar li:last-child i.second-btn{
		margin-left: 25px;
	}
	.sp-nav-wrap i.first-btn{
		background: url(../img/sp/sp_facebook.png) no-repeat;
	}
	.sp-nav-wrap i.second-btn{
		background: url(../img/sp/sp_sns_otherbtn.png) no-repeat;
	}
	img.plane{
		display: none;
	}
	.sp_section2 .middsec{
		padding-top: 0;
	}
	.sp_section2 .tilinetext:before{
		display: none;
	}
	.sp_section2 .tilinetext:after{
		display: none;
	}
	.footer .scroll-to-top{
		display: none !important;
	}
	.aboutsec h3{
		margin: 0px 0 24px;
	}
	.aboutsec p{
		margin-top: 0px;
	}
	.top-content{
		margin-bottom: 40px;
	}
	.top-content dt{
		font-size: 26px;
	}
	.sp_container_content{
		padding: 0px 10vw;
	}
	.tilinetext, .tilineimg {
		width: 100%;
	}
	.tilineimg img{
		float: right;
    	padding: 0;
	}
	.tilinetext{
		padding: 0px 0px 20px 0px;
		display: block;
		min-height: auto;
	}
	.tilinetext h1{
		font-size: 55px !important;
		position: inherit;
		float: left;
	}
	.tilinetext h3{
		display: inline-block;
		float: left;
	    margin: 6% 0px 0px 5px;
	    font-size: 2em;
	}
	.tilinesec_content .final_content{
		display: flex;
	}
	.tilinesec_content .flow_content_next_step{
		background: url(../img/sp/flow_content_next_step_btn.png);
		width: 51px;
		height: 32px;
		margin: 0 auto;
		position: relative;
		margin-top: 28px;
	}
	.tilinetext a{
		/*margin-bottom: 28px;*/
	}
	.tilinesec_header{
		position: relative;
		display: flex;
	}
	.tilinetext .section_number{
		width: 13%;
	}
	.tilinesec_header .right_cloud_icon{
		/*width: 40%;*/
    	margin-top: 7px;
	}
	/*.tilinetext h5{
		position: inherit;
	    right: auto;
	    transform: inherit;
	    display: block;
	    width: 100px;
	    padding: 10px 10px 10px 14px;
	    border: 1px solid;
	    text-align: left;
	    margin-bottom: 10px;
	    font-weight: 100;
	    font-size: 14px;
	}*/
	.tilinetext .month_label{
		margin-bottom: 15px;
		margin-top: 10px;
	}
	.tilinetext .month_label span{
	    padding: 5px 7px;
	    border: 1px solid #fff;
	    color: #fff;
	    text-align: left;
	    margin-bottom: 10px;
	    font-weight: 100;
	    font-size: 13px;
	}
	.tilinetext p{
		text-align: justify;
	}
	.tilinesec_content .tilinetext_section_5, .tilinesec_content .tilinetext_section_9 {
		text-align: center;
    	position: relative;
	}
	.tilinesec_content .tilinetext_section_9 {
		margin-bottom: 20%;
	}
	.tilinesec_content .tilinetext_section_5 img{
		position: absolute;
	    top: 10%;
	    right: 10%;
	    width: 91px;
	}
	.tilinesec_content .tilinetext_section_9 img.left_cloud{
		position: absolute;
	    top: 0;
	    left: 0;
	    width: 25%;
	    margin-top: 20%;
	}
	.tilinesec_content .tilinetext_section_9 img.right_ballon{
		position: absolute;
	    top: 0;
	    right: 0;
	    width: 20%;
	}
	.sp_section8_headercloudimg{
		position: absolute;
	    bottom: 0;
	    margin-left: 40px;
		width: 25%;
    	/*margin-left: 38%;*/
    	bottom: 10%;
	}
	.tilinesec_header .sp_right_cloud_wrapper{
		float: right;
		width: 55%;
	}
	.tilinesec_header .right_cloud_icon{
		width: 55%;
	}
	#cloud3{
		width:60% ;
	}	
}
@media screen and (max-width:640px){
	.tilinesec_content .tilinetext_section_5 img{
		top: 10px;
		right: 20px;
    	width: 90px;
	}
	.tilinetext h3{
		font-size: 1.8em;
	}
}
@media screen and (max-width:480px){
	.logo_wrapper{
		padding-top: 20px;
		width: calc(100% - 60px);
	}
	.photo-item{
		width: 95%;
	}
	.sp-nav-wrap{
		width: 80%;
	}
	.menu-open{
		right: calc(80%);
	}
	
	.maintit h2{
		font-size: 15px;
		margin-bottom: 37px;
	}
	.tilineimg img{
		width: 38%;
	}
	.tilinetext h1{

	}
	.tilinesec_header .right_cloud_icon{
		margin-top: 15px; 
		margin-right: 0px; 
		/*width: 38%;*/
	}
	.tilinesec_content .tilinetext_section_5 img{
		top: 10px;
		right: 20px;
    	width: 90px;
	}
	.sp_section8_headercloudimg{
		width: 25%;
    	margin-left: 25%;
    	bottom: 10%;
	}
	.footer span.copyright{
		font-size: 12px;
	}
	.tilinetext h3{
		font-size: 1.2em;
	}
	.tilinesec_header .sp_right_cloud_wrapper{
		width: 50%;
	}
	
}
@media screen and (max-width:280px){
	.tilinetext h3{
		font-size: 14px;
		margin-top : 8px;
	}
	.tilinetext h1{
		font-size: 35px !important;
	}
	.aboutsec{
		padding: 40px 10px;
	}
	.aboutsec h3{
		font-size: 15px;
	}
	.aboutsec p{
		font-size: 10px;
	}
	.tilinesec_header .sp_right_cloud_wrapper{
		width: 60%;
	}
	.tilinesec_header .right_cloud_icon{
		width: 45%;
	}
	.tilinetext .section_number{
		width: 10%;
	}
	.tilinetext p{
		font-size: 10px;
	}
}


@media screen and (max-width:992px){ 
	body {
		min-width: 100%;
	}
}