@charset "UTF-8";
/*==============================================

    THEME INTERNSHIP

==============================================*/

#contents {
	background:#4cb0c2;
}
#contents .inner {
	width:90%;
	max-width:1120px;
	margin:0 auto;
	padding:40px 0;
}
.t-textarea__eng {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	justify-content: center;
	text-align:center;
	color: #ffffff;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 400;
	font-size: 50px;
	line-height: 1;
	transition:font-size 0.5s ease;
}
.t-textarea__title {
	text-align: center;
	margin: 0 0 1.5em;
	font-weight: 700;
	font-family: "ヒラギノ角ゴ Pro W3", sans-serif;
	font-size: 16px;
	line-height: 1.6;
	color:#ffffff;
	transition:font-size 0.5s ease;
}

.btnBox {
	padding-top:15px;
	text-align:center;
}
.entryBtn {
	display:inline-block;
	width:100%;
	max-width:360px;
	margin:0 auto;
	font-size:16px;
	line-height:52px;
	font-weight:600;
	color:#ffffff;
	text-align:center;
	border-radius:52px;
	background-color:#fd7823;
	background-image:url(../../internship/image/icon_arrow.png);
	background-repeat:no-repeat;
	background-position:top 50% right 15px;
	background-size:15px auto;
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.15);
}

.u-red2 { color:#ff0000 }

@media screen and (max-width: 320px) {
	.entryBtn {
		text-align:left;
		padding-left:25px;
		font-size:14px;
	}
}


@media screen and (min-width: 561px) {
	#contents .inner {
		padding:50px 0;
	}
	.t-textarea__eng {
		font-size: 58px;
		line-height: 1;
		letter-spacing:0.1em;
	}
	.t-textarea__title {
		font-size: 18px;
		line-height: 1.6;
	}
	.entryBtn {
		max-width:400px;
		font-size:18px;
		line-height:62px;
		border-radius:62px;
		background-position:top 50% right 20px;
	}
}

@media screen and (min-width: 769px) {
	#contents .inner {
		padding:60px 0;
	}
	.t-textarea__eng {
		font-size: 68px;
		line-height: 1;
		letter-spacing:0.1em;
	}
	.t-textarea__title {
		font-size: 20px;
		line-height: 1.6;
	}
	.entryBtn {
		max-width:460px;
		line-height:68px;
		border-radius:68px;
		background-position:top 50% right 25px;
	}
}



/*==============================================
    INTERNSHIP header
==============================================*/

.l-header .login_btn_box {
	display: block;
	width:100%;
	height:46px;
	margin:0 auto;
	overflow:hidden;
	box-sizing:border-box;
}
.l-header .login_btn {
	display: block;
	width:100%;
	max-width:140px;
	height:46px;
	margin:auto 0;
	padding: 5px 0 ;
	border: 2px solid #c8c8c8;
	font-size: 10px;
	line-height: 16px;
	font-weight: 700;
	letter-spacing:0;
	text-align: center;
	border-radius: 50px;
	box-sizing:border-box;
	-webkit-transition: all 0.5s ease;
	transition:all 0.5s ease;
}
.l-header .login_btn.btn1 {
	float:left;
}
.l-header .login_btn.btn2 {
	float:right;
}
.l-header .login_btn.btn3 {
	display:block;
	max-width:280px;
	font-size: 12px;
	line-height:46px;
	float:right;
	background:#ff8a18;
	border: 2px solid #ff9a18;
}
.l-header .login_btn.btn3 a {
	display:block;
	font-size: 12px;
	line-height:33px;
	color:#ffffff;
}

@media screen and (max-width: 579px) {
	.l-header .login_btn_box {
		max-width:560px;
		height:46px;
		margin:8px auto 3px;
	}
	.l-header .login_btn {
		max-width:49%;
		font-size: 10px;
		letter-spacing:0.05em;
	}
	.l-header .login_btn.btn3 {
		margin:4px auto 0;
		max-width:260px;
		height:36px;
		float:none;
	}
	.l-header .login_btn.btn3 a {
		line-height:23px;
	}
}

@media screen and (min-width: 580px) {

	.l-header .login_btn_box {
		max-width:305px;
		height:46px;
		margin:auto 0;
		position: absolute;
		top:0;
		bottom:0;
		right:2%;
		z-index:10;
	}
	.l-header .login_btn {
		max-width:150px;
		font-size: 10px;
		letter-spacing:0.1em;
	}
}
@media screen and (min-width: 768px) {

	.l-header .login_btn_box {
		max-width:410px;
		height:46px;
		margin:auto 0;
		position: absolute;
		top:0;
		bottom:0;
		right:2%;
		z-index:10;
	}
	.l-header .login_btn {
		max-width:200px;
		font-size: 10px;
		letter-spacing:0.1em;
	}
	.l-header .login_btn.btn3 {
		display:block;
		max-width:280px;
		font-size: 12px;
		line-height:46px;
	}
	.l-header .login_btn.btn3 a{
		display:block;
		font-size: 12px;
		line-height:34px;
	}
}
@media screen and (min-width: 769px) {

	.l-header .login_btn {
		font-size: 12px;
	}
}



/*==============================================
    INTERNSHIP movie
==============================================*/
.t-movie{
	position:relative;
}
.t-movie .playicon {
	content: '';
	display:none;
	width: 100%;
	height: 100%;
	margin:auto;
	background: url(../../internship/image/icon_play.png) no-repeat 50% 50% ;
	background-size:36px auto;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index:10;
}
.t-movie.off .playicon {
	display:block;
}
.t-movie video{
	width:100%;
	margin:0;
	padding:0;
	outline: none;
	line-height: 100%;
	vertical-align:bottom;
}
#mainMovie {
	margin-bottom:25px;
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.15);
}
#mainMovie .t-movie .playicon {
	background: url(../../internship/image/icon_play_l.png) no-repeat 50% 50% ;
	background-size:147px auto;
}

@media screen and (min-width: 561px) {
	.t-movie .playicon {
		background-size:72px auto;
	}
	#mainMovie {
		margin-bottom:45px;
	}
	#mainMovie .t-movie .playicon {
		background-size:184px auto;
	}
}

@media screen and (min-width: 769px) {
	#mainMovie {
		margin-bottom:60px;
	}
	#mainMovie .t-movie .playicon {
		background-size:294px auto;
	}
}



/*==============================================
    INTERNSHIP infoBox
==============================================*/

.infoBox {
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.15);
}
.infoBox dt {
	padding:10px 10px 10px 40px;
	font-size:16px;
	line-height:24px;
	font-weight:600;
	color:#ffffff;
	background:#333333;
	position:relative;
	cursor:pointer;
}
.infoBox dt .subTxt {
	font-size:0.86em;
	display:inline-block;
}
.infoBox dt .plus {
	display:block;
	width:30px;
	height:100%;
	background:#111111;
	position: absolute;
	top:0;
	bottom:0;
	left:0;
	z-index:5;
	transition:all 0.5s ease;
}
.infoBox dt .dummy {
	display:block;
	width:40px;
	height:100%;
	background:#111111;
	position: absolute;
	top:0;
	bottom:0;
	left:0;
	z-index:5;
	transition:all 0.5s ease;
}
.infoBox dt .plus::before,
.infoBox dt .plus::after {
	content: '';
	display:block;
	margin:auto;
	background:#ffffff;
	position: absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	z-index:2;
	transition:all 0.5s ease;
}
.infoBox dt .plus::before {
	width:18px;
	height:2px;
}
.infoBox dt .plus::after {
	width:2px;
	height:18px;
}
.infoBox.open dt .plus::after{
	transform: rotate(180deg);
	opacity:0;
}
.infoBox.open dt .plus::before{
	transform: rotate(180deg);
}
.infoBox dd {
	display:none;
	padding:15px;
	background:#ffffff;
	position:relative;
}
.infoBox dd::before {
	content: "";
	display: block;
	width: 20px;
	height: 11px;
	margin:0;
	padding:0;
	border-top: 11px solid #333333;
	border-right: 10px solid transparent;
	border-left: 10px solid transparent;
	position:absolute;
	top:0;
	left:50px;
	box-sizing:border-box;
}
.infoBox dd.view {
	display:block;
}
.infoBox dd > section {
	padding-top:20px;
}
.infoBox dd > section:first-child {
	padding-top:0;
}
.infoBox dd .infoTTL {
	padding:10px 10px 10px 25px;
	font-size:14px;
	line-height:1.5em;
	font-weight:600;
	color:#111111;
	background:#dddddd;
	position:relative;
}
.infoBox dd .infoTTL::before {
	content: '';
	display:block;
	width:10px;
	height:100%;
	border-right:2px solid #ffffff;
	background:#39a2b5;
	position: absolute;
	top:0;
	left:0;
	z-index:2;
	transition:all 0.5s ease;
}
.infoBox dd .movieL {
	margin-bottom:15px;
}
.infoBox dd .contents {
	padding:15px 10px;
}
.infoBox dd .contents .txtBox > p{
	margin-top:1em;
	line-height:1.8em;
}
.infoBox dd .contents .txtBox > p:first-child{
	margin-top:0;
}

@media screen and (min-width: 561px) {
	.infoBox {
		margin-bottom:25px;
	}
	.infoBox dt {
		padding:18px 18px 18px 80px;
		font-size:18px;
		line-height:28px;
	}
	.infoBox dt .plus {
		width:62px;
	}
	.infoBox dt .dummy {
		width:62px;
	}
	.infoBox dt .plus::before {
		width:25px;
		height:3px;
	}
	.infoBox dt .plus::after {
		width:3px;
		height:25px;
	}
	.infoBox dd {
		padding:30px;
	}
	.infoBox dd::before {
		width: 28px;
		height: 16px;
		border-top: 16px solid #333333;
		border-right: 14px solid transparent;
		border-left: 14px solid transparent;
		left:90px;
	}
	.infoBox dd .infoTTL {
		padding:10px 10px 10px 25px;
		font-size:18px;
		line-height:1.5em;
	}
	.infoBox dd > section {
		padding-top:20px;
	}
	.infoBox dd .movieL {
		margin-bottom:25px;
	}
	.infoBox dd .contents {
		padding:25px 20px;
	}
}

@media screen and (min-width: 769px) {
	.infoBox {
		margin-bottom:30px;
	}
	.infoBox dt {
		padding:25px 25px 25px 100px;
		font-size:22px;
		line-height:28px;
	}
	.infoBox dt .plus {
		width:75px;
	}
	.infoBox dt .dummy {
		width:75px;
	}
	.infoBox dt .plus::before {
		width:30px;
		height:4px;
	}
	.infoBox dt .plus::after {
		width:4px;
		height:30px;
	}
	.infoBox dd {
		padding:50px;
	}
	.infoBox dd::before {
		width: 36px;
		height: 19px;
		border-top: 19px solid #333333;
		border-right: 18px solid transparent;
		border-left: 18px solid transparent;
		left:100px;
	}
	.infoBox dd > section {
		padding-top:25px;
	}
	.infoBox dd .infoTTL {
		padding:15px 15px 15px 30px;
		font-size:20px;
		line-height:1.5em;
	}
	.infoBox dd .movieL {
		margin-bottom:40px;
	}
	.infoBox dd .contents {
		padding:30px 25px;
	}
}



.infoBox_link {
	display:block;
	margin-top:20px;
}
.infoBox_link a {
	display:block;
	padding:10px 10px 10px 55px;
	font-size:16px;
	line-height:24px;
	font-weight:600;
	color:#ffffff;
	background:#333333;
	position:relative;
	cursor:pointer;
}
.infoBox_link a::before {
	display:block;
	content:"";
	height:0;
	margin:auto 0;
	border-top: 6px solid transparent;
	border-bottom: 6px solid transparent;
	border-left: 10px solid #fff;
	position:absolute;
	top:0;
	bottom:0;
	left:16px;
	z-index:10;
}
.infoBox_link a::after {
	display:block;
	content:"";
	width:40px;
	height:100%;
	background:#111111;
	transition:all 0.5s ease;
	position:absolute;
	top:0;
	left:0;
	z-index:5;
}

@media screen and (min-width: 561px) {
	.infoBox_link a {
		padding:18px 18px 18px 80px;
		font-size:18px;
		line-height:28px;
	}
	.infoBox_link a::before {
		border-top: 10px solid transparent;
		border-bottom: 10px solid transparent;
		border-left: 15px solid #fff;
		left:25px;
	}
	.infoBox_link a::after {
		width:62px;
	}
}

@media screen and (min-width: 769px) {
	.infoBox_link a {
		padding:25px 25px 25px 100px;
		font-size:22px;
		line-height:28px;
	}
	.infoBox_link a::before {
		border-top: 10px solid transparent;
		border-bottom: 10px solid transparent;
		border-left: 15px solid #fff;
		left:30px;
	}
	.infoBox_link a::after {
		width:75px;
	}
}


/*==============================================
    INTERNSHIP flowimg
==============================================*/

.isFlow {
	width:100%;
	max-width:860px;
	margin:25px auto;
}
.isFlow img{
	width:100%;
}

@media screen and (max-width: 768px) {

	.isFlow {
		max-width:320px;
	}

}

/*==============================================
    INTERNSHIP flowList
==============================================*/

.infoBox dd .waku {
	border:2px solid #ccc;
}
.infoBox dd .flowList {
	list-style:none;
}
.infoBox dd .flowList li{
	position:relative;
}
.infoBox dd .flowList li::before{
	content: '';
	display:block;
	margin:auto 0;
	font-weight:600;
	text-align:center;
	color:#ffffff;
	letter-spacing:0;
	font-family: 'Roboto Condensed', sans-serif;
	border-radius:36px;
	background:#6abfa0;
	position: absolute;
	top:0;
	bottom:0;
	left:0;
	z-index:2;
	transition:all 0.5s ease;
}

.infoBox dd .flowList li p{
	line-height:1.5;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	-webkit- transform: translateY(-50%);
}

.infoBox dd .flowList li:nth-child(1)::before{ content: '1'; }
.infoBox dd .flowList li:nth-child(2)::before{ content: '2'; }
.infoBox dd .flowList li:nth-child(3)::before{ content: '3'; }
.infoBox dd .flowList li:nth-child(4)::before{ content: '4'; }
.infoBox dd .flowList li:nth-child(5)::before{ content: '5'; }
.infoBox dd .flowList li:nth-child(6)::before{ content: '6'; }
.infoBox dd .flowList li:nth-child(7)::before{ content: '7'; }
.infoBox dd .flowList li:nth-child(8)::before{ content: '8'; }
.infoBox dd .flowList li:nth-child(9)::before{ content: '9'; }
.infoBox dd .flowList li:nth-child(10)::before{ content: '10'; }


@media screen and (max-width: 768px) {
	
	.infoBox dd .flowList {
		width:100%;
		max-width:300px;
		margin:0 auto;
		padding:0 ;
	}
	.infoBox dd .flowList li{
		min-height:48px;
		margin-top:10px;
		padding:0 0 0 50px;
	}
	.infoBox dd .flowList li p{
		width: calc(100% - 50px);
		font-size:12px;
	}
	.infoBox dd .flowList li::before{
		width:38px;
		height:38px;
		font-size:18px;
		line-height:38px;
	}
	.infoBox dd .flowList li::after{
		content: '';
		display:block;
		width:0;
		height:0;
		border-top: 10px solid #97dcc3;
		border-left: 6px solid transparent;
		border-right: 6px solid transparent;
		position: absolute;
		left:13px;
		bottom:-10px;
		z-index:2;
	}
	.infoBox dd .flowList li:first-child{
		margin-top:0;
	}
	.infoBox dd .flowList li:last-child::after{
		display:none;
	}
}

@media screen and (min-width: 769px) {
	
	.infoBox dd .flowList {
		width:400px;
		margin:0 auto;
	}
	.infoBox dd .flowList li{
		min-height:66px;
		margin-top:10px;
		padding:0 0 0 60px;
		font-size:1.15em;
	}
	.infoBox dd .flowList li p{
		width: calc(100% - 60px);
		font-size:16px;
	}
	.infoBox dd .flowList li::before{
		width:48px;
		height:48px;
		font-size:24px;
		line-height:48px;
	}
	.infoBox dd .flowList li:first-child{
		margin-top:0;
	}
	.infoBox dd .flowList li::after{
		content: '';
		display:block;
		width:0;
		height:0;
		border-top: 12px solid #97dcc3;
		border-left: 8px solid transparent;
		border-right: 8px solid transparent;
		position: absolute;
		left:16px;
		bottom:-11px;
		z-index:2;
	}
	.infoBox dd .flowList li:last-child::after{
		display:none;
	}
}



/*==============================================
    INTERNSHIP inMovieBox
==============================================*/

.infoBox dd .contents .inMovieBox {
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.infoBox dd .contents .inMovieBox .movieBox{
	width:100%;
}
.infoBox dd .contents .inMovieBox .txtBox{
	width:100%;
}

@media screen and (max-width: 560px) {

	.infoBox dd .contents .inMovieBox .movieBox{
		margin-bottom:20px;
	}

}

@media screen and (min-width: 561px) {

	.infoBox dd .contents .inMovieBox .movieBox{
		width:40%;
	}
	.infoBox dd .contents .inMovieBox .txtBox{
		width:55%;
	}

}

@media screen and (min-width: 769px) {

	.infoBox dd .contents .inMovieBox .movieBox{
		width:35%;
	}
	.infoBox dd .contents .inMovieBox .txtBox{
		width:60%;
	}

}



/*==============================================
    INTERNSHIP etcContents
==============================================*/

#etcContents {
	padding:25px 0;
	background:#00869e;
}
#etcContents ul {
	width:90%;
	max-width:1260px;
	margin:0 auto;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
#etcContents ul li {
	width:50%;
	position:relative;
}
#etcContents ul li::after {
	content: '';
	width: 20px;
	height: 20px;
	right: 10px;
	bottom: 10px;
	background: transparent url(../../image/arrow_more.png) no-repeat scroll center center;
	background-size: cover;
	position: absolute;
}
#etcContents ul li a:hover {
	opacity:1!important;
}
#etcContents ul li .contentsName {
	padding:12px;
	font-size:14px;
	line-height:1.5;
	font-weight:600;
	color:#ffffff;
	text-shadow: 0px 0px 15px #555555;
	position:absolute;
	z-index:2;
}
#etcContents ul li .image{
	overflow:hidden;
	background:#111111;
}
#etcContents ul li .image img{
	transition:all 0.5s ease;
}

#etcContents ul li .image:hover img{
	opacity:0.8;
	transform:scale(1.1,1.1);
}

#etcContents ul.c3 {
	max-width:1120px;
}
#etcContents ul.c3 li {
	width:50%;
	position:relative;
}
#etcContents ul.c3 li a {
	display:block;
	position:relative;
}
#etcContents ul.c3 li::after {
	background: none;
}
#etcContents ul.c3 li .contentsName {
	margin:0;
	padding:10px 0 0;
	font-size:12px;
	line-height:1.5;
	font-weight:normal;
	text-align:center;
	color:#ffffff;
	text-shadow: none;
	position:static;
}


@media screen and (min-width: 561px) {
	#etcContents {
		padding:40px 0;
	}
	#etcContents ul li {
		width:25%;
	}
	#etcContents ul li .contentsName {
		padding:18px;
		font-size:16px;
		line-height:1.5em;
	}
	#etcContents ul li::after {
		width: 24px;
		height: 24px;
		right: 15px;
		bottom: 15px;
	}
	#etcContents ul.c3 li {
		width:33.33%;
	}
	#etcContents ul.c3 li .contentsName {
		font-size:14px;
	}
}

@media screen and (min-width: 769px) {
	#etcContents {
		padding:60px 0 50px;
	}
	#etcContents ul li .contentsName {
		padding:18px 18px;
		font-size:18px;
		line-height:1.5em;
	}
}


/*==============================================
    youtubeMovie
==============================================*/

.youtubeMovie {
	width:100%;
	margin:0 auto;
}
.youtubeMovie div{
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
}

.youtubeMovie iframe{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border:0;
}


/*==============================================
    inMovie
==============================================*/

.infoBox dd .contents.inMovie {
	padding:10px;
	background:#eeeeee;
}
.icon_play_yt {
	position:relative;
}
.icon_play_yt::after {
	content: '';
	display:block;
	width:68px;
	height:48px;
	margin:auto;
	background:url(/recruit/shinsotsu/internship/image/icon_play_yt.png) no-repeat 50% 50%;
	background-size:100% auto;
	position: absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	z-index:5;
	pointer-events: none;
	transition:all 0.5s ease;
}
.icon_play_yt:hover::after {
	background:url(/recruit/shinsotsu/internship/image/icon_play_yt_ac.png) no-repeat 50% 50%;
	background-size:100% auto;
}

.infoBox dd .contents.inMovie .txtBox{
	padding:20px 5px 5px;
}

@media screen and (min-width: 769px) {

	.infoBox dd .contents.inMovie {
		display:-webkit-box;
		display:-ms-flexbox;
		display:flex;
		-webkit-box-pack: space-between;
		-ms-flex-pack: space-between;
		justify-content: space-between;
		padding:20px;
	}
	.infoBox dd .contents.inMovie .imgBox{
		width:380px;
	}
	.infoBox dd .contents.inMovie .txtBox{
		width: calc(100% - 400px);
		padding:0px;
		display:-webkit-box;
		display:-ms-flexbox;
		display:flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
	}

}


/*----------------------------------------------------------

	modal
	
----------------------------------------------------------*/

/*----------------------------------------------------------
	Display：common  ＋　pc
----------------------------------------------------------*/

#overray {
	width:100%;
	height:120%;
	background:rgba(255,255,255,0.7);
	position:fixed !important;
	position:absolute;
	top:0px;
	right:0px;
	bottom:0px;
	left:0px;
	z-index:999;
	display:none;
}
#modalBox{
	display:none;
}

#modalMovie{
	width:840px;
	height:472px;
	margin:auto;
	background:#ffffff;
	border:none;
	box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
	position:fixed;
	top:0;
	left:0;
	right:0;
	bottom:0;
	z-index:1000;
}
#modalMovie #if{
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}

#modalMovie .close{
	width:40px;
	height:40px;
	position:absolute;
	top:-5px;
	right:-5px;
	z-index:1001;
	cursor:pointer;
	background:#ffffff;
}
#modalMovie .close img{
	-webkit-transition: all 0.3s;
}
#modalMovie #close:hover img{
	opacity:0.5;
}
#modalMovie iframe{
	width: 100% !important;
	height: 100% !important;
	margin:0;
	padding:0;
	border:none;
	background:#000000;
	position: absolute;
	top: 0;
	right: 0;
}
#movieClose{
	width:50px;
	height:50px;
	position:fixed;
	top:20px;
	right:20px;
	z-index:1001;
	cursor:pointer;
	-webkit-transition: all 0.3s;
}
#movieClose span {
	display:block;
	height: 2px;
	margin:auto;
	background: #000000;
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	-webkit-transition: 0.5s ease-in-out;
	-moz-transition: 0.5s ease-in-out;
	transition: 0.3s ease-in-out;	
}
#movieClose span:nth-child(1) {
	-webkit-transform: rotate(315deg);
	-moz-transform: rotate(315deg);
	transform: rotate(315deg);
}
#movieClose span:nth-child(2) {
	-webkit-transform: rotate(-315deg);
	-moz-transform: rotate(-315deg);
	transform: rotate(-315deg);
}
#movieClose:hover{
	opacity:0.6;
}
#movieClose:hover span:nth-child(1) {
	-webkit-transform: rotate(405deg);
	-moz-transform: rotate(405deg);
	transform: rotate(405deg);
}
#movieClose:hover span:nth-child(2) {
	-webkit-transform: rotate(-225deg);
	-moz-transform: rotate(-225deg);
	transform: rotate(-225deg);
}

/*----------------------------------------------------------
	Display：320px → 768px（ sp ）
----------------------------------------------------------*/

@media screen and (max-width: 768px) {

	#modalMovie{
		width:100%;
		max-width:640px;
		height:360px;
	}

}

@media screen and (max-width: 680px) {

	#modalMovie{
		width:100%;
		max-width:480px;
		height:270px;
	}

}

@media screen and (max-width: 480px) {

	#modalMovie{
		width:100%;
		max-width:360px;
		height:202px;
	}

}

@media screen and (max-width: 360px) {

	#modalMovie{
		width:100%;
		max-width:310px;
		height:174px;
	}

}



/*----------------------------------------------------------

	btnInsta
	
----------------------------------------------------------*/

.btnInsta {
	display:block;
	width:90%;
	max-width:320px;
	margin:0 auto;
	text-align:center;
	border-radius:31px;
	background:#ffffff;
	border:3px solid #eeeeee;
}
.btnInsta span{
	display:inline-block;
	padding-left:50px;
	font-size:16px;
	line-height:56px;
	font-weight:600;
	background:url(/recruit/shinsotsu/internship/image/icon_insta.png) no-repeat top 50% left 0px;
	background-size:40px auto;
}
.btnN {
	display:block;
	width:90%;
	max-width:320px;
	margin:0 auto;
	text-align:center;
	border-radius:31px;
	background:#ffffff;
	border:3px solid #eeeeee;
}
.btnN span{
	display:inline-block;
	font-size:16px;
	line-height:56px;
	font-weight:600;
}


/*----------------------------------------------------------

	modal
	
----------------------------------------------------------*/

/*----------------------------------------------------------
	Display：common  ＋　pc
----------------------------------------------------------*/

.leadTxt {
	line-height:2.0;
	font-weight:600;
	text-align:center;
}

@media screen and (max-width: 768px) {

	.leadTxt.textLsp {
		text-align:left;
	}

}

@media screen and (min-width: 769px) {

	.leadTxt {
		font-size:1.15em;
	}

}



/*==============================================
    INTERNSHIP movie
==============================================*/

#mainQa {
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.15);
}

.qaBox {
	display:block;
	margin:30px 0;
	padding:30px;
	border-radius:12px;
	background:#fff;
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.10);
}
.qaBox dt,
.qaBox dd {
	font-weight:bold;
	position:relative;
}
.qaBox dt::before,
.qaBox dd::before {
	display:block;
	text-align:center;
	text-indent:2px;
	color:#fff;
	font-weight:bold;
	font-family:arial;
	border-radius:50vh;
	background:#000;
	position:absolute;
	top:0;
	left:0;
}
.qaBox dt::before {
	content:"Ｑ";
	color:#fff;
	background:#ec8fb5;
}
.qaBox dd::before {
	content:"Ａ";
	color:#fff;
	background:#75c4d5;
}
.coutionTxt {
	padding-left:1em;
	text-indent:-1em;
}

@media screen and (max-width: 768px) {
	#mainQa {
		margin-bottom:30px;
	}
	.qaBox {
		margin:15px 0;
		padding:18px;
	}
	.qaBox dt,
	.qaBox dd {
		min-height:40px;
		padding:10px 0 0 50px;
		font-size:14px;
	}
	.qaBox dd {
		margin-top:5px;
		margin-left:0;
	}
	.qaBox dt::before,
	.qaBox dd::before {
		display:block;
		width:40px;
		height:40px;
		font-size:24px;
		line-height:40px;
	}
}

@media screen and (min-width: 769px) {
	#mainQa {
		margin-bottom:50px;
	}
	.qaBox {
		margin:30px 0;
		padding:30px 30px;
	}
	.qaBox dt,
	.qaBox dd {
		min-height:50px;
		padding:13px 0 0 70px;
		font-size:16px;
	}
	.qaBox dd {
		margin-top:10px;
		margin-left:25px;
	}
	.qaBox dt::before,
	.qaBox dd::before {
		display:block;
		width:50px;
		height:50px;
		font-size:26px;
		line-height:50px;
	}
}



/*==============================================
    programTable
==============================================*/

.programTable {
	width:100%;
	border-collapse : collapse
	border:1px solid #ccc;
}
.programTable th,
.programTable td{
	padding:10px;
	border:1px solid #ccc;
	box-sizing:border-box;
}
.programTable th {
	width:20%;
	text-align:center;
	vertical-align:middle;
}
.programTable thead th {
	font-weight:bold;
	background:#78c0cf;
}
.programTable thead td {
	font-weight:bold;
	text-align:center;
	background:#e1f6fa;
}
.programTable tbody th {
	font-weight:bold;
	background:#eee;
}

@media screen and (max-width: 768px) {
	.programTable.viewPc {
		display:none;
	}
	.programTable.viewSp {
		display:table;
	}
	.programTable tr th,
	.programTable tr td {
		padding:10px 5px;
		line-height:1.5;
	}
	.programTable tr th {
		width:15%;
	}
	.programTable tr td {
		width:85%;
		vertical-align:middle;
	}
}

@media screen and (min-width: 769px) {
	.programTable.viewPc {
		display:table;
	}
	.programTable.viewSp {
		display:none;
	}
	.programTable th:nth-child(3) {
		display:none;
	}
	.programTable.c3 td {
		width: calc(80% / 2);
	}
	.programTable.c2 td {
		width: calc(80% / 1);
	}
}


/*==============================================
    noteList
==============================================*/

.noteList li {
	margin-top:5px;
	padding-left:1em;
	text-indent:-1em;
}
.noteList li:nth-child(1) {
	margin-top:0;
}

/*==============================================
    flowBox
==============================================*/

.flowBox {
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-pack: wrap;
	flex-wrap: wrap;
	margin-top:40px;
	border:1px solid #ccc;
	position:relative;
}
.flowBox:nth-child(1) {
	margin-top:0;
}
.flowBox::before {
	display:block;
	content:"";
	width: 0;
	height: 0;
	margin:0 auto;
	border-left: 15px solid transparent;
	border-right: 15px solid transparent;
	border-top: 15px solid #2b8da2;
	position:absolute;
	top:-27px;
	left:0;
	right:0;
}
.flowBox:nth-child(1)::before {
	display:none;
}

.flowBox > div {
	box-sizing:border-box;
}
.flowBox > div:nth-child(1) {
	font-weight:bold;
	background:#e1f6fa;
}
.flowBox > div p {
	width:100%;
}
.flowBox.c1 > div p{
	text-align:center;
}

@media screen and (max-width: 768px) {

	.flowBox > div {
		width:100%;
		padding:15px 10px;
	}
	.flowBox > div:nth-child(1) {
		text-align:center;
	}
	.flowBox > div:nth-child(2) {
		border-top:1px dotted #ccc;
	}
	.flowBox.c3 > div:nth-child(2) {
		text-align:center;
	}
	.flowBox > div:nth-child(3) {
		border-top:1px dotted #ccc;
	}

}

@media screen and (min-width: 769px) {
	.flowBox > div {
		display:-webkit-box;
		display:-ms-flexbox;
		display:flex;
		-webkit-flex-wrap: wrap;
		-ms-flex-pack: wrap;
		flex-wrap: wrap;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		padding:20px;
	}
	.flowBox > div:nth-child(1) {
		width:25%;
	}
	.flowBox > div:nth-child(2) {
		border-left:1px dotted #ccc;
	}
	.flowBox > div:nth-child(3) {
		border-left:1px dotted #ccc;
	}
	.flowBox.c3 > div:nth-child(2) {
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		width:30%;
		text-align:center;
	}
	.flowBox.c3 > div:nth-child(3) {
		width:45%;
	}
	.flowBox.c2 > div:nth-child(2) {
		width:75%;
	}
	.flowBox.c1 > div:nth-child(1) {
		width:100%;
	}
}