@charset "UTF-8";

@media screen and (min-width:769px){
	
	#index .mainmoviebox{
		width:100%;
		position: relative;
		line-height: 0;
		padding:0 0 0 80px;
	}
	
	#index .mainmoviebox::after{
		content: "";
		width:calc(720px + ((100% - 1000px) / 2));
		height:56%;
		position: absolute;
		bottom:0;
		left:0;
		background:#5b7ebf;
		z-index:-1;
		transform:scaleX(0);
		transform-origin: left;
	}
	
	#index .mainmoviebox.active::after{
		animation-name: leftscale;
		animation-fill-mode:forwards;
		animation-duration:0.5s;
		animation-timing-function:ease-out;
		animation-delay: 0s;
	}
	
	#index .mainmoviebox::before{
		content: "";
		width:calc(100% - 80px);
		height:calc(100% + 1px);
		top:0;
		left:80px;
		background:#fff;
		position: absolute;
		z-index:2;
		transform: scaleX(1);
		transform-origin: right;
		animation-name: topscale;
		animation-fill-mode:forwards;
		animation-duration:0.5s;
		animation-timing-function:ease-in-out;
		animation-delay: 1s;
	}
	
	#index .mainmoviebox video{
		position: relative;
		z-index: 1;
	}
	
	#index .mainmoviebox .maintl{
		width:100%;
		height:100%;
		display: flex;
		justify-content: center;
		align-items: center;
		top:0;
		left:0;
		position: absolute;
		z-index:2;
		opacity: 0;
		animation-name: topopacity;
		animation-fill-mode:forwards;
		animation-duration:1s;
		animation-timing-function:ease-out;
		animation-delay: 1.75s;
	}
	
	#index .mainmoviebox .maintl img{
		width:61.69%;
	}
	
	#index .maininfobox{
		width:100%;
		padding:0 0 0 0;
		position: relative;
		margin:0 0 250px 0;
	}
	
	#index .maininfobox::after{
		content: "";
		width:calc(720px + ((100% - 1000px) / 2));
		height:calc(100%);
		position: absolute;
		top:0;
		left:0;
		background:#5b7ebf;
		z-index:-1;		
	}
	
	#index .maininfobox .innerbox{
		width:1000px;
		margin:0 auto;
		display: flex;
		justify-content: space-between;
		position: relative;
	}
	
	#index .maininfobox .txcont{
		padding:110px 0;
		font-size:1.8rem;
		line-height: 5rem;
		color:#fff;
		width:400px;
		letter-spacing: 0.1em;
	}
	
	#index .maininfobox .rightbox{
		width:600px;
		position: absolute;
		bottom:-170px;
		right:0;
		display: flex;
		justify-content: flex-end;
		flex-direction: column;
	}
	
	#index .maininfobox .rightbox .tl{
		font-size:12rem;
		line-height: 1;
		font-style: italic;
		color:#b8c5e0;
		font-weight: 500;
		margin:0 0 100px auto;
	}
	
	#index .maininfobox .rightbox .movie{
		margin:0 0 20px 0;
		line-height: 0;
		position: relative;
	}
	
	#index .maininfobox .rightbox a{
		color:#fff;
		position: absolute;
		top:0;
		left:0;
		width:100%;
		height:100%;
		font-size:1.5rem;
		display: flex;
		cursor: pointer;
		align-items: center;
		justify-content: center;
		box-sizing: border-box;
		margin:0 0 0 auto;
		transition: all 0.2s;
	}
	
	#index .maininfobox .rightbox a:hover{
		opacity: 0.7;
	}
	
	#index .maininfobox .rightbox a::after{
		content: "";
		width:50px;
		height:52px;
		background:url("../images/common/movie_arrow.svg") no-repeat;
		background-size:50px;
		margin:0 0 0 20px;
	}
	
	#index .maininfobox .rightbox a .intx{
		display: inline-block;
	}
	
	#index .mphbox{
		position: relative;
	}
	
	#index .mphbox::after{
		content: "";
		width:100%;
		height:100%;
		position: absolute;
		top:0;
		left:0;
		background:#fff;
		transform: scaleX(1);
		transform-origin: right;
	}
	
	#index .mphbox.active::after{
		animation-name: topscale;
		animation-fill-mode:forwards;
		animation-duration:0.5s;
		animation-timing-function:ease-out;
		animation-delay: 0s;
	}
	
	#index .pridecont{
		margin:-120px 0 250px 0;
		position: relative;
	}
	
	#index .pridecont::after{
		width:calc((100% - 1000px) / 2);
		content: "";
		height:100%;
		position: absolute;
		background:#fff;
		top:0;
		left:0;
	}
	
	#index .pridecont .innerbox{
		width:1000px;
		margin:0 auto;
		position: relative;
	}
	
	#index .pridecont .mtl{
		margin:0 0 0 0;
		font-weight: 500;
		font-style: italic;
		font-size:9rem;
		line-height: 1;
		padding:100px 100px 0 0;
		background:#fff;
		display: inline-block;
	}
	
	#index .pridecont .msub{
		font-size: 2.5rem;
		padding:25px 0;
		position: relative;
	}
	
	#index .pridecont .msub::after{
		content: "";
		width:50px;
		border-bottom:3px solid #5b7ebf;
		position:absolute;
		bottom:0;
		left:0;
	}
	
	#index .pridecont .slidecont{
		position: relative;
	}
	
	#index .pridecont .slidebox{
		position: relative;
		z-index:3;
		transition: all 1s;
		transition-delay: 0.5s;
		transition-timing-function: cubic-bezier(.09,.89,.44,1.01);
		opacity: 0;
		top:40px;
	}
	
	#index .pridecont .active .slidebox{
		top:0;
		opacity: 1;
	}
	
	#index .pridecont .slidebox .slick-list{
		position: relative;
		z-index: 2;
	}
	
	#index .pridecont .slidebox .box{ 
		position: relative;
		padding:0 0 100px 0;
		z-index:2;
	}
	
	#index .pridecont .slidecont::after{ 
		width:0;
		position: absolute;
		bottom:0;
		left:0;
		height:400px;
		content: "";
		background:url("../images/index/repeat_bg01.png");
		background-size:4px;
		z-index:1;
		transition: all 0.5s;
		transition-timing-function: cubic-bezier(.09,.89,.44,1.01);
		transition-delay:s;
	}
	
	#index .pridecont .slidecont.active::after{ 
		width:calc(100% - 100px);
	}
	
	#index .pridecont .slidebox .box .ph{ 
		width:calc(100% - 100px);
		z-index:2;
		transition: all 0.5s;
		transition-delay: 1s;
		overflow: hidden;
		transform: scaleX(1);
		transform-origin: right;
		background:#fff;
		position: relative;
		margin:0 0 0 100px;
		display: block;
	}
	
	/*#index .pridecont .slidebox.active .box .ph{ 
		transform: scaleX(1);
	}*/
	
	/*#index .pridecont .slidebox .box .ph img{ 
		opacity: 0;
		transition: all 0s;
		transition-delay: 1.5s;
	}
	
	#index .pridecont .slidebox.active .box .ph img{ 
		opacity: 1;
	}*/
	
	/*#index .pridecont .slidebox .box .ph::after{ 
		content: "";
		width:calc(100%);
		height:100%;
		position: absolute;
		top:0;
		right:0;
		background:#fff;
		transform: scaleX(1);
		transform-origin: left;
		transition: all 0.5s;
		transition-delay: 1.5s;
	}
	
	#index .pridecont .slidebox.active .box .ph::after{ 
		transform: scaleX(0);
	}*/
	
	#index .pridecont .slidebox .box .ph .inbox{ 
		width:900px !important;
		display: block;
		z-index:3;
		transition: all 0.2s;
		filter: brightness(1);
	}
	
	#index .pridecont .slidebox .box .ph:hover .inbox{ 
		filter: brightness(1.1);
	}
	
	#index .pridecont .slidebox .box .tx{ 
		width:300px;
		position: absolute;
		top:calc(50% - 95px);
		left:50px;
		z-index:5;
		transition: all 1s;
		transition-delay: 1.5s;
		opacity: 1;
	}
	
	#index .pridecont .slidebox .box .tx.box2{ 
		top:calc(50% - 104px);
	}
	
	/*#index .pridecont .slidebox.active .box .tx{ 
		left:50px;
		opacity: 1;
	}*/
	
	#index .slick-next{
		width:35px;
		height:35px;
		top:calc(50% - 100px + 17px);
		background:url("../images/index/next.svg") no-repeat !important;
		background-size:cover !important;
		right:-30px;
		border:none;
		transform: rotate(0);
	}
	
	#index .slick-prev{
		width:35px;
		height:35px;
		top:calc(50% - 100px + 17px);
		background:url("../images/index/prev.svg") no-repeat !important;
		background-size:cover !important;
		left:-30px;
		right:auto;
		border:none;
		transform: rotate(0);
	}
	
	#index .pridecont a.link{
		color:#000;
		position: absolute;
		bottom:25px;
		right:0;
		font-size:1.5rem;
		display: flex;
		align-items: center;
		justify-content: space-between;
		box-sizing: border-box;
		margin:0 0 0 auto;
		transition: all 0.2s;
		z-index:3;
	}
	
	#index .pridecont a.link:hover{
		opacity: 0.7;
	}
	
	#index .pridecont a.link::after{
		content: "";
		width:50px;
		height:52px;
		background:url("../images/common/movie_arrow2.svg") no-repeat;
		background-size:50px;
		margin:0 0 0 20px;
	}
	
	#index .contbox{
		margin:0 0 250px 0;
		position: relative;
	}
	
	#index .contbox .bg{
		width:calc((100% - 1000px) / 2 + 800px);
		content: "";
		height:400px;
		position: absolute;
		background:url("../images/index/repeat_bg02.png");
		background-size:4px;
		bottom:0;
		right:0;
	}
	
	#index .contbox.box2 .bg{
		width:calc((100% - 1000px) / 2 + 800px);
		content: "";
		height:400px;
		position: absolute;
		background:url("../images/index/repeat_bg01.png");
		background-size:4px;
		bottom:0;
		right:auto;
		left: 0;
	}
	
	#index .contbox .innerbox{
		width:1000px;
		margin:0 auto;
		position: relative;
	}
	
	#index .contbox .phbox{
		padding:0 0 0 100px;
		display: block;
	}
	
	#index .contbox .phbox img{
		filter: brightness(1);
		transition: all 0.2s;
	}
	
	#index .contbox.box2 .phbox{
		padding:0 100px 0 0;
	}
	
	#index .contbox .phbox:hover .inbox img{ 
		filter: brightness(1.1);
	}
	
	#index .contbox .innerbox .boxbottom{
		display: flex;
		justify-content: space-between;
		align-items: flex-end;
		padding:0 0 25px 0;
	}
	
	#index .contbox .txcont{
		margin:-9rem 0 0 0;
	}
	
	#index .contbox.box2 .txcont{
		margin:-9rem 0 0 0;
		order: 1;
		text-align: right;
	}
	
	#index .contbox .mtl{
		margin:0 0 0 0;
		font-weight: 500;
		font-style: italic;
		font-size:9rem;
		line-height: 1;
		display: inline-block;
	}
	
	#index .contbox .mtl span{
		letter-spacing: -0.1em;
	}
	
	#index .contbox .msub{
		font-size: 2.5rem;
		padding:25px 0;
		position: relative;
	}
	
	#index .contbox .msub::after{
		content: "";
		width:50px;
		border-bottom:3px solid #23aad1;
		position:absolute;
		bottom:0;
		left:0;
	}
	
	#index .contbox.box2 .msub::after{
		content: "";
		width:50px;
		border-bottom:3px solid #23aad1;
		position:absolute;
		bottom:0;
		right:0;
		left:auto !important;
	}
	
	#index .contbox.box2 .msub::after{
		content: "";
		width:50px;
		border-bottom:3px solid #5b7ebf;
		position:absolute;
		bottom:0;
		left:0;
	}
	
	#index .contbox .mtx{
		padding:25px 0 0 0;
		font-size:1.5rem;
		line-height: 3rem;
	}
	
	#index .contbox a.link{
		color:#000;
		font-size:1.5rem;
		display: flex;
		align-items: center;
		justify-content: space-between;
		box-sizing: border-box;
		transition: all 0.2s;
		z-index:3;
		margin:0 0 40px 0;
	}
	
	#index .contbox a.link:hover{
		opacity: 0.7;
	}
	
	#index .contbox a.link::after{
		content: "";
		width:50px;
		height:52px;
		background:url("../images/common/movie_arrow2.svg") no-repeat;
		background-size:50px;
		margin:0 0 0 20px;
	}
	
	#index .recruitcont{
		margin:-50px 0 250px 0;
		position: relative;
	}
	
	#index .recruitcont::after{
		width:calc((100% - 1000px) / 2);
		content: "";
		height:100%;
		position: absolute;
		background:#fff;
		top:0;
		left:0;
	}
	
	#index .recruitcont .innerbox{
		width:1000px;
		margin:0 auto;
		position: relative;
	}
	
	#index .recruitcont .mtl{
		margin:0 0 0 0;
		font-weight: 500;
		font-style: italic;
		font-size:9rem;
		line-height: 1;
		padding:50px 50px 0 0;
		background:#fff;
		display: inline-block;
	}
	
	#index .recruitcont .msub{
		font-size: 2.5rem;
		padding:25px 0;
		position: relative;
	}
	
	#index .recruitcont .msub::after{
		content: "";
		width:50px;
		border-bottom:3px solid #5b7ebf;
		position:absolute;
		bottom:0;
		left:0;
	}
	
	#index .recruitcont .iconbtnbox{
		display: flex;
		justify-content: space-between;
		padding:60px 0 0 0;
	}
	
	#index .recruitcont .iconbtnbox .box{
		display: flex;
		width:290px;
		height:290px;
		justify-content: center;
		align-items: center;
		position: relative;
		flex-direction: column;
	}
	
	#index .recruitcont .iconbtnbox .box::after{
		content: "";
		width:100%;
		height:100%;
		background:#34aad0;
		border-radius: 50%;
		position: absolute;
		top:0;
		left:0;
		z-index:1;
		transition: all 0.2s;
		transform: scale(1);
	}
	
	#index .recruitcont .iconbtnbox .box:hover::after{
		transform: scale(0.9);
	}
	
	#index .recruitcont .iconbtnbox .box:nth-child(2)::after{
		background:#0086cc;
	}
	
	#index .recruitcont .iconbtnbox .box:nth-child(3)::after{
		background:#1647a4;
	}
	
	#index .recruitcont .iconbtnbox .box .icon{
		position: relative;
		z-index: 2;
		width:75px;
		height:80px;

	}
	
	#index .recruitcont .iconbtnbox .box:nth-child(2) .icon{
		position: relative;
		z-index: 2;
		width:55px;

	}
	
	#index .recruitcont .iconbtnbox .box .tx{
		position: relative;
		z-index: 2;
		font-size:1.8rem;
		color:#fff;
		text-align: center;
		margin:0 0 0 0;
	}
}

@media screen and (max-width:768px){
	
	#index .mainmoviebox{
		width:100%;
		position: relative;
		line-height: 0;
		padding:0 0 0 0;
		height:calc(100vh - 50px);
	}
	
	
	#index .mainmoviebox::before{
		content: "";
		width:100%;
		height:100%;
		top:0;
		left:0;
		background:#fff;
		position: absolute;
		z-index:2;
		transform: scaleX(1);
		transform-origin: right;
		animation-name: topscale;
		animation-fill-mode:forwards;
		animation-duration:0.5s;
		animation-timing-function:ease-in-out;
		animation-delay: 1s;
	}
	
	#index .mainmoviebox video{
		object-position: 10%;
	}
	
	#index .mainmoviebox .maintl{
		width:100%;
		height:100%;
		display: flex;
		justify-content: center;
		align-items: center;
		top:0;
		left:0;
		position: absolute;
		opacity: 0;
		animation-name: topopacity;
		animation-fill-mode:forwards;
		animation-duration:1s;
		animation-timing-function:ease-out;
		animation-delay: 1.75s;
	}
	
	#index .mainmoviebox .maintl img{
		width:90%;
	}
	
	#index .maininfobox{
		width:100%;
		padding:90px 0 0 0;
		position: relative;
		margin:0 0 140px 0;
		background:#5b7ebf;
	}
	
	#index .maininfobox::after{
		content: "";
		width:100%;
		transform: scale(1) !important;
		height:30vw;
		background:#fff;
		position: absolute;
		bottom:0;
		left:0;
		z-index: 1;
	}
	
	#index .maininfobox .innerbox{
		width:90%;
		margin:0 auto;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		position: relative;
		z-index:2;
	}
	
	#index .maininfobox .txcont{
		padding:0 0 80px 0;
		font-size:1.4rem;
		line-height: 3rem;
		color:#fff;
		width:100%;
		letter-spacing: 0.1em;
	}
	
	#index .maininfobox .rightbox{
		width:100%;
		position: re;
		display: flex;
		justify-content: flex-end;
		flex-direction: column;
	}
	
	#index .maininfobox .tl{
		font-size:6rem;
		line-height: 1;
		font-style: italic;
		color:#b8c5e0;
		font-weight: 500;
		margin:0 0 70px 0;
	}
	
	#index .maininfobox .rightbox .movie{
		margin:0 0 0 0;
		line-height: 0;
		position: relative;
	}
	
	#index .maininfobox .rightbox a{
		color:#fff;
		font-size:1.5rem;
		display: flex;
		align-items: center;
		justify-content: center;
		box-sizing: border-box;
		margin:0 0 0 auto;
		transition: all 0.2s;
		position: absolute;
		top:0;
		left:0;
		width:100%;
		height:100%;
		
	}
	
	#index .maininfobox .rightbox a:hover{
		opacity: 0.7;
	}
	
	#index .maininfobox .rightbox a::after{
		content: "";
		width:40px;
		height:42px;
		background:url("../images/common/movie_arrow.svg") no-repeat;
		background-size:40px;
		margin:0 0 0 10px;
	}
	
	#index .mphbox{
		position: relative;
	}
	
	#index .mphbox::after{
		content: "";
		width:100%;
		height:100%;
		position: absolute;
		top:0;
		left:0;
		background:#fff;
		transform: scaleX(1);
		transform-origin: right;
	}
	
	#index .mphbox.active::after{
		animation-name: topscale;
		animation-fill-mode:forwards;
		animation-duration:0.5s;
		animation-timing-function:ease-out;
		animation-delay: 0s;
	}
	
	#index .pridecont{
		margin:0 0 150px 0;
		position: relative;
	}
	
	#index .pridecont .innerbox{
		width:100%;
		margin:0 auto;
		position: relative;
	}
	
	#index .pridecont .mtl{
		margin:0 0 0 5%;
		font-weight: 500;
		font-style: italic;
		font-size:4rem;
		line-height: 1;
		padding:10px 0 0 0;
		background:#fff;
		display: inline-block;
	}
	
	#index .pridecont .msub{
		font-size: 1.5rem;
		padding:5px 0 10px 0;
		position: relative;
		margin:0 0 10px 5%;
	}
	
	#index .pridecont .msub::after{
		content: "";
		width:25px;
		border-bottom:1px solid #5b7ebf;
		position:absolute;
		bottom:0;
		left:0;
	}
	
	#index .pridecont .slidecont{
		position: relative;
	}
	
	#index .pridecont .slidebox{
		position: relative;
		z-index:3;
		transition: all 1s;
		transition-delay: 0.5s;
		transition-timing-function: cubic-bezier(.09,.89,.44,1.01);
		opacity: 0;
		top:40px;
	}
	
	#index .pridecont .active .slidebox{
		top:0;
		opacity: 1;
	}
	
	#index .pridecont .slidebox .slick-list{
		position: relative;
		z-index: 2;
	}
	
	#index .pridecont .slidebox .box{ 
		position: relative;
		padding:0 0 100px 0;
		z-index:2;
	}
	
	#index .pridecont .slidecont::after{ 
		width:0;
		position: absolute;
		bottom:0;
		left:0;
		height:40vw;
		content: "";
		background:url("../images/index/repeat_bg01.png");
		background-size:4px;
		z-index:1;
		transition: all 0.5s;
		transition-delay: 0.5s;
	}
	
	#index .pridecont .slidecont.active::after{ 
		width:calc(100% - 10%);
	}
	
	#index .pridecont .slidebox .box .ph{ 
		width:calc(100% - 10%);
		z-index:2;
		transition: all 0.5s;
		transition-delay: 1s;
		overflow: hidden;
		transform: scaleX(1);
		transform-origin: right;
		background:#fff;
		position: relative;
		margin:0 0 0 10%;
		display: block;
	}
	
	/*#index .pridecont .slidebox.active .box .ph{ 
		transform: scaleX(1);
	}
	
	#index .pridecont .slidebox .box .ph img{ 
		opacity: 0;
		transition: all 0s;
		transition-delay: 1.5s;
	}
	
	#index .pridecont .slidebox.active .box .ph img{ 
		opacity: 1;
	}
	
	#index .pridecont .slidebox .box .ph::after{ 
		content: "";
		width:calc(100%);
		height:100%;
		position: absolute;
		top:0;
		right:0;
		background:#fff;
		transform: scaleX(1);
		transform-origin: left;
		transition: all 0.5s;
		transition-delay: 1.5s;
	}
	
	#index .pridecont .slidebox.active .box .ph::after{ 
		transform: scaleX(0);
	}*/
	
	#index .pridecont .slidebox .box .ph .inbox{ 
		width:auto !important;
		display: block;
		z-index:3;
	}
	
	#index .pridecont .slidebox .box .tx{ 
		width:50vw;
		position: absolute;
		top:calc(50% - 100px + 5vw);
		left:5%;
		z-index:5;
		transition: all 1s;
		transition-delay: 1.5s;
		opacity: 1;
	}
	
	#index .pridecont .slidebox .box .tx.box2{
		top:calc(50% - 100px + 4vw);
	}
	
	/*#index .pridecont .slidebox.active .box .tx{ 
		left:5%;
		opacity: 1;
	}*/
	
	#index .slick-next{
		display: none !important;
		width:35px;
		height:35px;
		top:calc(50% - 100px + 17px);
		background:url("../images/index/next.svg") no-repeat !important;
		background-size:cover !important;
		right:-30px;
		border:none;
		transform: rotate(0);
	}
	
	#index .slick-prev{
		display: none !important;
		width:35px;
		height:35px;
		top:calc(50% - 100px + 17px);
		background:url("../images/index/prev.svg") no-repeat !important;
		background-size:cover !important;
		left:-30px;
		right:auto;
		border:none;
		transform: rotate(0);
	}
	
	#index .pridecont a.link{
		color:#000;
		position: absolute;
		bottom:25px;
		right:5%;
		font-size:1.5rem;
		display: flex;
		align-items: center;
		justify-content: space-between;
		box-sizing: border-box;
		margin:0 0 0 auto;
		transition: all 0.2s;
		z-index:3;
	}
	
	#index .pridecont a.link:hover{
		opacity: 0.7;
	}
	
	#index .pridecont a.link::after{
		content: "";
		width:40px;
		height:42px;
		background:url("../images/common/movie_arrow2.svg") no-repeat;
		background-size:40px;
		margin:0 0 0 10px;
	}
	
	#index .contbox{
		margin:0 0 150px 0;
		position: relative;
	}
	
	#index .contbox .bg{
		width:90%;
		content: "";
		height:40vw;
		position: absolute;
		background:url("../images/index/repeat_bg02.png");
		background-size:4px;
		bottom:0;
		right:0;
	}
	
	#index .contbox.box2 .bg{
		width:90%;
		content: "";
		height:40vw;
		position: absolute;
		background:url("../images/index/repeat_bg01.png");
		background-size:4px;
		bottom:0;
		right:auto;
		left: 0;
	}
	
	#index .contbox .innerbox{
		width:100%;
		margin:0 auto;
		position: relative;
		display: flex;
		flex-direction: column;
	}
	
	#index .contbox .phbox{
		padding:0 10% 0 0;
		order:1;
		display: block;
	}
	
	#index .contbox.box2 .phbox{
		padding:0 0 0 10%;
	}
	
	#index .contbox .innerbox .boxbottom{
		display: flex;
		justify-content: space-between;
		align-items: flex-end;
		padding:0 0 25px 0;
	}
	
	#index .contbox .txcont{
		margin:0 0 0 5%;
	}
	
	#index .contbox .mtl{
		margin:0 0 0 0;
		font-weight: 500;
		font-style: italic;
		font-size:4rem;
		line-height: 1;
		display: inline-block;
	}
	
	#index .contbox .mtl span{
		letter-spacing: -0.1em;
	}
	
	#index .contbox .msub{
		font-size: 1.5rem;
		padding:10px 0;
		position: relative;
	}
	
	#index .contbox .msub::after{
		content: "";
		width:25px;
		border-bottom:1px solid #23aad1;
		position:absolute;
		bottom:0;
		left:0;
	}
	
	#index .contbox.box2 .msub::after{
		content: "";
		width:25px;
		border-bottom:1px solid #23aad1;
		position:absolute;
		bottom:0;
		left:0;
	}
	
	#index .contbox .mtx{
		padding:10px 0 0 0;
		font-size:1.4rem;
		line-height: 2.7rem;
	}
	
	#index .contbox a.link{
		color:#000;
		font-size:1.5rem;
		display: flex;
		align-items: center;
		justify-content: space-between;
		box-sizing: border-box;
		transition: all 0.2s;
		z-index:3;
		margin:25px 5% 25px auto;
		order:2;
	}
	
	#index .contbox a.link:hover{
		opacity: 0.7;
	}
	
	#index .contbox a.link::after{
		content: "";
		width:40px;
		height:42px;
		background:url("../images/common/movie_arrow2.svg") no-repeat;
		background-size:40px;
		margin:0 0 0 10px;
	}
	
	#index .recruitcont{
		margin:-10% 0 0 0;
		position: relative;
	}
	
	#index .recruitcont::after{
		width:calc((100% - 1000px) / 2);
		content: "";
		height:100%;
		position: absolute;
		background:#fff;
		top:0;
		left:0;
	}
	
	#index .recruitcont .innerbox{
		width:100%;
		margin:0 auto;
		position: relative;
	}
	
	#index .recruitcont .mtl{
		margin:0 0 0 0;
		font-weight: 500;
		font-style: italic;
		font-size:4rem;
		line-height: 1;
		padding:5% 45% 0 5%;
		background:#fff;
		display: inline-block;
	}
	
	#index .recruitcont .msub{
		font-size: 1.5rem;
		padding:10px 0;
		margin:0 0 0 5%;
		position: relative;
	}
	
	#index .recruitcont .msub::after{
		content: "";
		width:24px;
		border-bottom:1px solid #5b7ebf;
		position:absolute;
		bottom:0;
		left:0;
	}
	
	#index .recruitcont .iconbtnbox{
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		padding:0 0 150px 0;
	}
	
	#index .recruitcont .iconbtnbox .box{
		display: flex;
		width:250px;
		height:250px;
		justify-content: center;
		align-items: center;
		position: relative;
		flex-direction: column;
		margin:60px 0 0 0;
	}
	
	#index .recruitcont .iconbtnbox .box::after{
		content: "";
		width:100%;
		height:100%;
		background:#34aad0;
		border-radius: 50%;
		position: absolute;
		top:0;
		left:0;
		z-index:1;
		transition: all 0.2s;
		transform: scale(1);
	}
	
	#index .recruitcont .iconbtnbox .box:hover::after{
		transform: scale(0.9);
	}
	
	#index .recruitcont .iconbtnbox .box:nth-child(2)::after{
		background:#0086cc;
	}
	
	#index .recruitcont .iconbtnbox .box:nth-child(3)::after{
		background:#1647a4;
	}
	
	#index .recruitcont .iconbtnbox .box .icon{
		position: relative;
		z-index: 2;
		width:75px;
		height:80px;

	}
	
	#index .recruitcont .iconbtnbox .box:nth-child(2) .icon{
		position: relative;
		z-index: 2;
		width:55px;

	}
	
	#index .recruitcont .iconbtnbox .box .tx{
		position: relative;
		z-index: 2;
		font-size:2rem;
		color:#fff;
		text-align: center;
	}
}