/*--------------------------------------------------------
　PC
--------------------------------------------------------*/

@media print, screen and (min-width: 768px){
	
	header div.header_inner nav ul li:nth-child(6) div.over a,
	header div.header_inner nav ul li:nth-child(6) div.over a::after{
		color: #1B519F;
	}
	
	div.page_title {
		background: url("../images/room/page_title_bg.jpg") no-repeat;
		background-position: center;
		background-size: cover;
	}
	
	/*合格体験記*/

	ul.top_interview{
    	list-style:none;
		width: 100%;
		display: flex;
		flex-wrap: wrap;
	}
	
	ul.top_interview li{
		width:240px;
		margin-top: 30px;
		display: flex;
		flex-flow: column;
		justify-content:space-between;
		margin-left:5px;
		margin-right:5px;
	}

	ul.top_interview li div.tn{
		width:100%;
		background:#F2F2F2;
		padding:15px;
	}

	ul.top_interview li div.tn .title{
		font-size: 15px;
		font-size: 1.5rem;
		line-height: 1.4;
		font-weight: 700;
		text-align:center;
		color: #1B519F;
		margin-bottom:5px;
	}

	ul.top_interview li div.tn .name{
		font-size: 15px;
		font-size: 1.5rem;
		line-height: 1.4;
		font-weight: 700;
		text-align:center;
		color: #000;
	}

	ul.top_interview li a img{
		display:block;
		margin:0;
		padding:0;
	}

	ul.top_interview li div.det .text1{
		border:none;
		padding:0;
		margin:0;
		font-size: 13px;
		font-size: 1.3rem;
		line-height: 1.4;
		font-weight: 500;
		text-align:center;
		color: #D4145A;
		margin-top:10px;

	}	

	ul.top_interview li div.det .text2{
		border:none;
		padding:0;
		margin:0;
		font-size: 12px;
		font-size: 1.2rem;
		line-height: 1.4;
		font-weight: 500;
		text-align:center;
		color: #666;
		margin-top:10px;
	}	
	
	ul.top_interview li .btn_interview {
	  display: inline-block;
	  background: linear-gradient(to right, #fff 50%, #1B519F 50%);
	  background-size: 200% auto;
	  border: 1px solid #1B519F;
	  box-sizing: border-box;
	  padding: 6px 25px 6px 25px;
	  width:100%;
	  min-width:auto;
	  letter-spacing:1px;
	  color: #1B519F;
	  font-size: 14px;
	  font-size: 1.4rem;
	  font-weight:600;
	  text-align: center;
	  text-decoration: none;
	  position: relative;
	  transition: .3s;
	  margin-top:15px;
	}
	
	ul.top_interview li .btn_interview:hover {
	  background-position: -100% 0;
	  border: 1px solid #1B519F;
	  color: #fff;
	  opacity: 1
	}
	
	ul.top_interview li .btn_interview:after {
	  content: '';
	  width: 6px;
	  height: 6px;
	  border: 0;
	  border-top: 2px solid #1B519F;
	  border-right: 2px solid #1B519F;
	  transform: rotate(45deg);
	  position: absolute;
	  top: 50%;
	  left: 12px;
	  margin-top: -3px
	}
	
	ul.top_interview li .btn_interview:hover:after {
	  border-top: 2px solid #fff;
	  border-right: 2px solid #fff
	}

	
	/*アーカイブ*/

	section#interview_list h4{
		font-size: 24px;
		font-size: 2.4rem;
		line-height: 1.3;
		font-weight: 700;
		position: relative;
		padding-left: 68px;
		color: #1B519F;
	}
	
	section#interview_list h4 span{
		display: block;
		font-size: 18px;
		font-size: 1.8rem;
		font-weight: 700;
		color: #333;
	}
	
	section#interview_list h4 span.icon{
		width: 58px;
		position: absolute;
		top: 2px;
		left: 0;
	}

	section#interview_list{
		margin-bottom:100px;
	}

	section#interview_list ul{
    	list-style:none;
		width: 100%;
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	
	section#interview_list ul li{
		width:480px;
		margin-top: 60px;
		display: flex;
		flex-flow: column;
	}

	section#interview_list ul li div.tn{
		width:100%;
		background:#F2F2F2;
		padding:15px;
	}

	section#interview_list ul li div.tn .title{
		font-size: 24px;
		font-size: 2.4rem;
		line-height: 1.4;
		font-weight: 700;
		text-align:center;
		color: #1B519F;
		margin-bottom:5px;
	}

	section#interview_list ul li div.tn .name{
		font-size: 18px;
		font-size: 1.8rem;
		line-height: 1.4;
		font-weight: 700;
		text-align:center;
		color: #000;
	}

	section#interview_list ul li div.det .text1{
		border:none;
		padding:0;
		margin:0;
		font-size: 14px;
		font-size: 1.4rem;
		line-height: 1.4;
		font-weight: 500;
		text-align:center;
		color: #D4145A;
		margin-top:10px;

	}	

	section#interview_list ul li div.det .text2{
		border:none;
		padding:0;
		margin:0;
		font-size: 14px;
		font-size: 1.4rem;
		line-height: 1.4;
		font-weight: 500;
		text-align:center;
		color: #666;
		margin-top:10px;
	}	
	
	.btn_interview {
	  display: inline-block;
	  background: linear-gradient(to right, #fff 50%, #1B519F 50%);
	  background-size: 200% auto;
	  border: 1px solid #1B519F;
	  box-sizing: border-box;
	  padding: 10px 35px 10px 35px;
	  width:100%;
	  min-width:300px;
	  letter-spacing:1px;
	  color: #1B519F;
	  font-size: 18px;
	  font-weight:600;
	  text-align: center;
	  text-decoration: none;
	  position: relative;
	  transition: .3s;
	  margin-top:20px;
	}
	
	.btn_interview:hover {
	  background-position: -100% 0;
	  border: 1px solid #1B519F;
	  color: #fff;
	  opacity: 1
	}
	
	.btn_interview:after {
	  content: '';
	  width: 6px;
	  height: 6px;
	  border: 0;
	  border-top: 2px solid #1B519F;
	  border-right: 2px solid #1B519F;
	  transform: rotate(45deg);
	  position: absolute;
	  top: 50%;
	  left: 12px;
	  margin-top: -3px
	}
	
	.btn_interview:hover:after {
	  border-top: 2px solid #fff;
	  border-right: 2px solid #fff
	}

	/*シングル*/

	section#interview{
		margin-bottom:100px;
	}

	section#interview .title{
		font-size: 33px;
		font-size: 3.3rem;
		line-height: 1.4;
		font-weight: 700;
		text-align:center;
		color: #1B519F;
		margin-top:50px;
	}

	section#interview .interview_det{
		display:flex;
		flex-flow: column;
		border:solid 1px #CCC;
		padding:0 20px 15px;
	}

	section#interview .interview_det .name{
		font-size: 22px;
		font-size: 2.2rem;
		line-height: 1.4;
		font-weight: 700;
		text-align:center;
		color: #000;
		margin-top:15px;
	}	

	section#interview .interview_det .text1{
		border:none;
		padding:0;
		margin:0;
		font-size: 22px;
		font-size: 2.2rem;
		line-height: 1.4;
		font-weight: 700;
		text-align:center;
		color: #D4145A;
		margin-top:15px;

	}	

	section#interview .interview_det .text2{
		border:none;
		padding:0;
		margin:0;
		font-size: 16px;
		font-size: 1.6rem;
		line-height: 1.4;
		font-weight: 700;
		text-align:center;
		color: #666;
		margin-top:15px;
	}	
	
	section#interview ul{
    	list-style:none;
		width: 100%;
		display:flex;
		flex-flow: column;
	}
	
	section#interview ul li{
		width:1000px;
		margin-top: 40px;
		display: flex;
		justify-content: space-between;
	}

	section#interview ul li div.i_img{
		flex-shrink: 0;
		width:480px;
	}

	section#interview ul li div.i_img img{
		width:100%;
		margin:0;
		padding:0;
	}

	section#interview ul li div.i_text{
		flex-grow: 1;
	}

	section#interview ul li div.i_text h3{
		margin:0;
		padding:0;
		border:none;
		display:flex;
		align-items: center;
		font-size: 18px;
		font-size: 1.8rem;
		line-height: 1.4;
		font-weight: 500;
		color:#000;
		border:solid 1px #CCC;
		padding:15px 20px 15px;
		margin-bottom:20px;
	}

	section#interview ul li div.i_text h3 span{
		margin:0;
		padding:0;
		font-size: 32px;
		font-size: 3.2rem;
		line-height: 1.4;
		font-weight: 700;
		color: #1B519F;
		margin-right:20px;
		margin-top:-4px;
	}	

	section#interview ul li div.i_text p{
		margin:0;
		padding:0;
		border:none;
		align-items: center;
		font-size: 15px;
		font-size: 1.5rem;
		line-height: 1.8;
		font-weight: normal;
		padding:18px 25px;
		background:#ECF5FF;
	}

	.rr { 
		flex-direction: row-reverse;
	}
	
	.ml-40 { 
		margin-left:40px;
	}

	.mr-40 { 
		margin-right:40px;
	}

	footer {
		margin-top: 15px;
	}
	
}

/*--------------------------------------------------------
　SP
--------------------------------------------------------*/

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


	div.page_title {
		background: url("../images/room/page_title_bg.jpg") no-repeat;
		background-position: center;
		background-size: cover;
	}


	/*合格体験記*/

	ul.top_interview{
    	list-style:none;
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		flex-flow: column;
	}
	
	ul.top_interview li{
		width: 100%;
		margin-top: 20px;
		display: flex;
		flex-flow: column;
	}

	ul.top_interview li div.tn{
		width:100%;
		background:#F2F2F2;
		padding:15px;
	}

	ul.top_interview li div.tn .title{
		font-size: 15px;
		font-size: 1.5rem;
		line-height: 1.4;
		font-weight: 700;
		text-align:center;
		color: #1B519F;
		margin-bottom:5px;
	}

	ul.top_interview li div.tn .name{
		font-size: 15px;
		font-size: 1.5rem;
		line-height: 1.4;
		font-weight: 700;
		text-align:center;
		color: #000;
	}

	ul.top_interview li a img{
		display:block;
		margin:0;
		padding:0;
	}

	ul.top_interview li div.det .text1{
		border:none;
		padding:0;
		margin:0;
		font-size: 13px;
		font-size: 1.3rem;
		line-height: 1.4;
		font-weight: 500;
		text-align:center;
		color: #D4145A;
		margin-top:10px;

	}	

	ul.top_interview li div.det .text2{
		border:none;
		padding:0;
		margin:0;
		font-size: 12px;
		font-size: 1.2rem;
		line-height: 1.4;
		font-weight: 500;
		text-align:center;
		color: #666;
		margin-top:10px;
	}	
	
	ul.top_interview li .btn_interview {
	  display: inline-block;
	  background: linear-gradient(to right, #fff 50%, #1B519F 50%);
	  background-size: 200% auto;
	  border: 1px solid #1B519F;
	  box-sizing: border-box;
	  padding: 6px 25px 6px 25px;
	  width:100%;
	  min-width:auto;
	  letter-spacing:1px;
	  color: #1B519F;
	  font-size: 14px;
	  font-size: 1.4rem;
	  font-weight:600;
	  text-align: center;
	  text-decoration: none;
	  position: relative;
	  transition: .3s;
	  margin-top:15px;
	}
	
	ul.top_interview li .btn_interview:hover {
	  background-position: -100% 0;
	  border: 1px solid #1B519F;
	  color: #fff;
	  opacity: 1
	}
	
	ul.top_interview li .btn_interview:after {
	  content: '';
	  width: 6px;
	  height: 6px;
	  border: 0;
	  border-top: 2px solid #1B519F;
	  border-right: 2px solid #1B519F;
	  transform: rotate(45deg);
	  position: absolute;
	  top: 50%;
	  left: 12px;
	  margin-top: -3px
	}
	
	ul.top_interview li .btn_interview:hover:after {
	  border-top: 2px solid #fff;
	  border-right: 2px solid #fff
	}


	section#interview_list h4{
		font-size: 18px;
		font-size: 1.8rem;
		line-height: 1.3;
		font-weight: 700;
		position: relative;
		padding-left: 54px;
		color: #1B519F;
		margin-bottom: 0;
		border-left:none;
		padding-top:0px;
	}
	
	section#interview_list h4 span{
		display: block;
		font-size: 14px;
		font-size: 1.4rem;
		font-weight: 700;
		color: #333;
	}
	
	section#interview_list h4 span.icon{
		width: 45px;
		position: absolute;
		top: 2px;
		left: 0;
	}

	section#interview_list{
		margin-bottom:100px;
	}

	section#interview_list ul{
    	list-style:none;
		width: 100%;
		display: flex;
		flex-flow: column;
	}
	
	section#interview_list ul li{
		width:100%;
		margin-top: 30px;
		display: flex;
		flex-flow: column;
	}

	section#interview_list ul li div.tn{
		width:100%;
		background:#F2F2F2;
		padding:15px;
	}

	section#interview_list ul li div.tn .title{
		font-size: 20px;
		font-size: 2.0rem;
		line-height: 1.4;
		font-weight: 700;
		text-align:center;
		color: #1B519F;
		margin-bottom:5px;
	}

	section#interview_list ul li div.tn .name{
		font-size: 16px;
		font-size: 1.6rem;
		line-height: 1.4;
		font-weight: 700;
		text-align:center;
		color: #000;
	}

	section#interview_list ul li div.det .text1{
		border:none;
		padding:0;
		margin:0;
		font-size: 12px;
		font-size: 1.2rem;
		line-height: 1.4;
		font-weight: 500;
		text-align:center;
		color: #D4145A;
		margin-top:10px;

	}	

	section#interview_list ul li div.det .text2{
		border:none;
		padding:0;
		margin:0;
		font-size: 13px;
		font-size: 1.3rem;
		line-height: 1.4;
		font-weight: 500;
		text-align:center;
		color: #666;
		margin-top:10px;
	}	
	
	.btn_interview {
	  display: inline-block;
	  background: linear-gradient(to right, #fff 50%, #1B519F 50%);
	  background-size: 200% auto;
	  border: 1px solid #1B519F;
	  box-sizing: border-box;
	  padding: 10px 35px 10px 35px;
	  width:100%;
	  min-width:300px;
	  letter-spacing:1px;
	  color: #1B519F;
	  font-size: 16px;
	  font-weight:600;
	  text-align: center;
	  text-decoration: none;
	  position: relative;
	  transition: .3s;
	  margin-top:20px;
	}
	
	.btn_interview:hover {
	  background-position: -100% 0;
	  border: 1px solid #1B519F;
	  color: #fff;
	  opacity: 1
	}
	
	.btn_interview:after {
	  content: '';
	  width: 6px;
	  height: 6px;
	  border: 0;
	  border-top: 2px solid #1B519F;
	  border-right: 2px solid #1B519F;
	  transform: rotate(45deg);
	  position: absolute;
	  top: 50%;
	  left: 12px;
	  margin-top: -3px
	}
	
	.btn_interview:hover:after {
	  border-top: 2px solid #fff;
	  border-right: 2px solid #fff
	}

	/*シングル*/

	section#interview{
		margin-bottom:60px;
	}

	section#interview .title{
		font-size: 26px;
		font-size: 2.6rem;
		line-height: 1.4;
		font-weight: 700;
		text-align:center;
		color: #1B519F;
		margin-top:30px;
	}

	section#interview .interview_det{
		display:flex;
		flex-flow: column;
		border:solid 1px #CCC;
		padding:0 20px 15px;
	}

	section#interview .interview_det .name{
		font-size: 18px;
		font-size: 1.8rem;
		line-height: 1.4;
		font-weight: 700;
		text-align:center;
		color: #000;
		margin-top:15px;
	}	

	section#interview .interview_det .text1{
		border:none;
		padding:0;
		margin:0;
		font-size: 20px;
		font-size: 2.0rem;
		line-height: 1.4;
		font-weight: 700;
		text-align:center;
		color: #D4145A;
		margin-top:15px;

	}	

	section#interview .interview_det .text2{
		border:none;
		padding:0;
		margin:0;
		font-size: 14px;
		font-size: 1.4rem;
		line-height: 1.4;
		font-weight: 700;
		text-align:center;
		color: #666;
		margin-top:15px;
	}	
	
	section#interview ul{
    	list-style:none;
		width: 100%;
		display:flex;
		flex-flow: column;
	}
	
	section#interview ul li{
		width:100%;
		margin-top: 30px;
		display: flex;
		flex-flow: column;
	}

	section#interview ul li div.i_img{
		width:100%;
		margin-bottom:20px;
	}

	section#interview ul li div.i_img img{
		width:100%;
		margin:0;
		padding:0;
	}

	section#interview ul li div.i_text{
		flex-grow: 1;
	}

	section#interview ul li div.i_text h3{
		margin:0;
		padding:0;
		border:none;
		display:flex;
		align-items: center;
		font-size: 18px;
		font-size: 1.8rem;
		line-height: 1.4;
		font-weight: 500;
		color:#000;
		border:solid 1px #CCC;
		padding:15px 20px 15px;
		margin-bottom:20px;
	}

	section#interview ul li div.i_text h3 span{
		margin:0;
		padding:0;
		font-size: 28px;
		font-size: 2.8rem;
		line-height: 1.4;
		font-weight: 700;
		color: #1B519F;
		margin-right:20px;
		margin-top:-4px;
	}	

	section#interview ul li div.i_text p{
		margin:0;
		padding:0;
		border:none;
		align-items: center;
		font-size: 15px;
		font-size: 1.5rem;
		line-height: 1.8;
		font-weight: normal;
		padding:18px 25px;
		background:#ECF5FF;
	}

	.rr { 
	}

	.ml-40 { 
		margin-left:0;
	}

	.mr-40 { 
		margin-right:0;
	}
	
	footer {
		margin-top: 15px;
	}
	
}