@charset "utf-8";

/***************************************************************************
*
* INDEX STYLE
*
***************************************************************************/
/*#main*/
#main .swiper-slide .swiper-photo img {
	width: 100%;
}
#main .swiper-slide .inner {
	position: absolute;
	top: 49%;
	left: 50%;
	transform: translate(-50%, -50%);
}
#main .swiper-slide:nth-child(2) .inner {
	top: 56%;
}
#main .swiper-slide .swiper-txt {
	width: 700px;
	margin-left: -20px;
}
#main .swiper-slide:nth-child(2) .swiper-txt {
	width: 580px;
	margin: 0 auto;
}
#main .swiper-slide .swiper-txt .swiper-title {
	font-size: 50px;
	color: #0F218B;
	letter-spacing: 8.3px;
	line-height: 86px;
	text-align: center;
}
#main .swiper-slide:nth-child(2) .swiper-txt .swiper-title {
	font-size: 27px;
	letter-spacing: 2.5px;
	line-height: 49px;
}
#main .swiper-slide .swiper-txt .swiper-title-2 {
	position: relative;
	font-size: 25px;
	line-height: 37px;
	letter-spacing: 1px;
	text-align: center; 
	font-weight: bold;
	margin-top: 13px;
}
#main .swiper-slide:nth-child(2) .swiper-txt .swiper-title-2 {
	margin-top: 60px;
}
#main .swiper-slide .swiper-txt .swiper-title-2:after {
	content: '';
	display: inline-block;
	vertical-align: top;
	width: 580px;
	border-bottom: 1px solid #000000;
}
#main .swiper-slide:nth-child(2) .swiper-txt .swiper-title-2:after {
	content: none;
} 
#main .swiper-slide .swiper-txt .swiper-sub {
	line-height: 26px;
	letter-spacing: 1px;
	text-align: center;
	margin-top: -25px;
}
#main .swiper-slide:nth-child(2) .swiper-txt .swiper-sub {
	width: 480px;
	margin: 50px auto 0;
	text-align: justify;
	line-height: 30px;
}
#main .swiper-slide .computer_parent {
	position: absolute;
	width: 336px;
	right: 0;
	top: 52%;
	transform: translateY(-50%);
}

/*#main*/

/*.areaNews*/
.areaNews{
	background: #F7F7F7;
	padding: 62px 0;
}

.areaNews .newsareaTitle{
	text-align: center;
	font-size: 30px;
}

.areaNews .listNews{
	width: 645px;
	margin: 25px auto 0;
}

.areaNews .listNews li{
	margin-bottom: 10px;
}

.areaNews .listNews li a{
	font-size: 13px;
}

.areaNews .listNews li a .newsDate{
	display: inline-block;
	margin-right: 15px;
}

.areaNews .listNews li a .newsTitle{
	display: inline-block;
}

.areaCommon{
	color: #fff;
}

.areaCommon h3{
	font-size: 50px;
	letter-spacing: 3px;
}

.areaCommon h4{
	font-size: 28px;
	letter-spacing: 3px;
	line-height: 1.7;
	margin-top: 16px;
	font-weight: normal;
}

.areaCommon h5{
	font-size: 36px;
	letter-spacing: 4px;
	line-height: 45px;
	margin-top: 16px;
	font-weight: normal;
	margin-bottom: -5px;
}

.areaCommon p{
	font-size: 18px;
	letter-spacing: 2px;
	margin-top: 30px;
	line-height: 33px;
}

.areaCommon p.mt0{
	margin-top: 0;
}

.areaCommon .btn{
	text-align: left;
}

.areaCommon .btn a{
	font-size: 12px;
	width: 200px;
	padding: 6px;
	border: 2px solid #fff;
}

.areaWhoWeAre{	
	padding: 72px 0;
	background: url('../img/index/bg_areaWhoWeAre.jpg') no-repeat center center;
}

.areaProduct{	
	margin-top: -2px;
	padding: 67px 0 65px;
	background: url('../img/index/bg_areaProduct.jpg') no-repeat center center;
	text-align: right;
}

.areaProduct .btn{
	text-align: right;
}

/*.areaRecruit*/
.areaRecruit{
	padding: 95px 0;
}

.areaRecruit .areaWrap{
	text-align: center;
	color: #fff;
	background: url('../img/index/bg_recruit.jpg') no-repeat center center;
	padding: 152px 0 42px;
}

.areaRecruit .areaWrap h3{
	font-size: 47px;
	letter-spacing: 5px;
}

.areaRecruit .areaWrap p{
	font-size: 18px;
	letter-spacing: 4px;
	margin-top: 25px;
}

.areaRecruit .areaWrap .btn{
	margin-top: 20px;
}

.areaRecruit .areaWrap .btn a{
	font-size: 12px;
	width: 200px;
	padding: 6px;
	border: 2px solid #fff;
}

/*HOVER EFFECT*/
@media(min-width: 769px) {
	.areaNews .listNews li a:hover{
		border-bottom: 1px solid #000;
	}
}

@media(max-width: 768px){
	.swiper-container img{
		width: 100%;
	}
	#main {
		overflow: visible;
	}
	#main .swiper-container {
		overflow: visible;
	}
	#main .swiper-slide .inner {
		transform: none;
		top: auto;
		left: auto;
		bottom: -13%;
	}
	#main .swiper-slide:nth-child(2) .inner {
		top: 66%;
	}
	#main .swiper-slide .swiper-txt,
	#main .swiper-slide:nth-child(2) .swiper-txt {
		width: 99%;
		margin: 0 auto;
		background: #fff;
		border-radius: 9.76px;
		padding: 18px 25px;
	}
	#main .swiper-slide	> .swiper-title {
		position: absolute;
		top: 53.5%;
		width: 100%;
		transform: translateY(-50%);
		font-size: 33px;
		color: #004098;
		line-height: 53px;
		letter-spacing: 1.6px;
		text-align: center;
		text-shadow: 2px -2px 2px #fff, 0px 2px 2px #fff, 0px -2px 2px #fff, 2px 2px 2px #fff;
	}
	#main .swiper-slide .swiper-txt .swiper-title-2 {
		font-size: 17px;
		color: #003288;	
		line-height: 29px;
		letter-spacing: 2px;
	}
	#main .swiper-slide .swiper-txt .swiper-title-2:after {
		content: none;
	}
	#main .swiper-slide .swiper-txt .swiper-sub {
		font-size: 13px;
		color: #1A1311;
		margin-top: 5px;
		text-align: justify;
	}
	#main .swiper-slide:nth-child(2) .swiper-txt .swiper-sub {
		width: 100%;
		margin: 20px auto 0;
	}
	#main .swiper-txt-2 {
		position: absolute;
		top: 44%;
		transform: translateY(-50%);
		width: 100%;
		text-align: center;
	}
	#main .swiper-slide:nth-child(2) .swiper-title {
		font-size: 16px;
		color: #00378B;
		line-height: 23px;
		letter-spacing: 2px;
	}
	#main .swiper-slide:nth-child(2) .swiper-title-2 .parent_title {
		display: block;
		width: 88%;
		margin: 15px auto 0;
	}
	#main .swiper-slide:nth-child(2) .parent_title_2 {
		width: 65%;
		margin: -75px auto 0;
	}
	#content {
		margin-top: 105px;
	}
	.areaNews{
		background: #fff;
		padding: 15px 0 45px;
	}

	.areaNews .inner{
		padding: 0 8%;
	}

	.areaNews .newsareaTitle{
		font-size: 20px;
	}

	.areaNews .listNews{
		width: 100%;
		margin-top: 10px;
	}

	.areaNews .listNews li a .newsDate{
		margin-right: 0;
		display: block;
		color: #00378B;
		font-size: 10px;
	}

	.areaNews .listNews li a .newsTitle{
		display: block;
		font-size: 12px;
	}

	.areaCommon .inner{
		padding: 0;
	}

	.areaCommon .spBlock{
		background-image: linear-gradient(to right, #0090D8 , #00ACD9);
		width: 84%;
		padding: 38% 7% 7%;
	}

	.areaCommon h4{
		font-size: 19px;
		text-align: justify;
		letter-spacing: 2.8px;
	}

	.areaCommon p{
		font-size: 13px;
		margin-top: 10px;
	}

	.areaCommon .btn{
		margin-top: 15px;
	}

	.areaCommon .btn a{
		color: #fff;
		background: none;
		width: 100%;
		font-size: 13px;
	}

	.areaWhoWeAre{
		background: url('../img/index/bg_areaWhoWeAre_sp.jpg') no-repeat top center/100% auto;
		padding: 205px 0 60px;
	}

	.areaWhoWeAre h3{
		font-size: 80px;
		line-height: 1.1;
	}

	.areaWhoWeAre .spBlock{
		margin-top: -150px;
	}

	.areaProduct .spBlock{
		padding: 17% 7% 7%;
		background-image: linear-gradient(to right, #003288 , #4E0F74);
		margin-left: auto;
		margin-top: -55px;
	}

	.areaProduct{
		background: url('../img/index/bg_areaProduct_sp.jpg') no-repeat top center/100% auto;
		padding: 208px 0 0;
	}

	.areaProduct h5{
		font-size: 25px;
		letter-spacing: 3.7px;
	}

	.areaProduct h3{
		font-size: 75px;
		line-height: 1.1;
	}

	.areaRecruit {
		padding: 60px 0 22px;
	}

	.areaRecruit .inner{
		padding: 0 6%;
	}

	.areaRecruit .areaWrap{
		background: url('../img/index/bg_recruit_sp.jpg') no-repeat center center/100% auto;
		padding: 140px 0 15px;
	}

	.areaRecruit .areaWrap h3 {
		font-size: 38px;
		letter-spacing: 3px;
	}

	.areaRecruit .areaWrap p{
		font-size: 13px;
		line-height: 1.8;
		margin-top: 10px;
		letter-spacing: 3px;
	}

	.areaRecruit .areaWrap .btn{
		margin-top: 8px;
	}

	.areaRecruit .areaWrap .btn a{
		font-size: 13px;
		background: none;
		color: #fff;
		width: 75%;
		padding: 5px;
	}
}

@media (max-width: 750px) and (max-height: 450px) {
	#main .swiper-slide .inner {
		bottom: 0;
	}
	#main .swiper-slide .swiper-txt, #main .swiper-slide:nth-child(2) .swiper-txt {
		width: 100%;
	}
	.areaCommon h4 {
		margin-top: -70px;
	}
	.areaProduct h5 {
		margin-top: -40px;
	}
	.areaRecruit .areaWrap {
		padding: 200px 0 15px;
	}
}

/*5S STYLE*/
@media (max-width: 320px) {
	#main .swiper-txt-2 {
		top: 35%;
	}
	#main .swiper-slide .swiper-txt, #main .swiper-slide:nth-child(2) .swiper-txt {
		padding: 10px 8%;
	}
	#main .swiper-slide .swiper-txt .swiper-title-2 {
		font-size: 15px;
		line-height: 25px;
		letter-spacing: 1.5px;
	}
	.areaCommon h4 {
		font-size: 18px;
		letter-spacing: 0;
	}
	.areaCommon p {
		font-size: 12px;
		margin-top: 10px;
	}
	.areaProduct h5 {
		letter-spacing: 0;
	}
	.areaRecruit {
		padding: 0;
	}
	.areaRecruit .areaWrap {
		padding: 140px 0 70px;
	}
	.areaRecruit .areaWrap p {
		margin-top: 38px;
	}
	.areaRecruit .areaWrap .btn {
		margin-top: 0px;
	}

}