@charset "UTF-8";



/* visual --------------------------------------------------------------- */
#visual,
#visual h1 {
	height: 500px;
	}

#visual {
	margin: 0 auto;
	position: relative;
	background-position: left top;
	background-size: cover;
	}
	
#visual {
	background-image: url(../../img/service/japanese/visual.jpg);
	}
	
	#visual h1 {
		font-size: 45px;
		color: #e95538;
		color: #ffffff;
		line-height: 1.8;
		position: absolute;
		left: 5%;
		top: 65%;
		}
		
		#visual h1 span {
			font-size: 35%;
			letter-spacing: 0.1em;
			}
		
		#visual h1 img {
			height: 100%;
			}

@media screen and (min-width:835px) and (max-width:1112px){
	#visual,
	#visual h1 {
		height: 350px;
		}
				
		#visual h1 {
			font-size: 40px;
			top: 60%;
			}
	}

@media screen and (min-width:401px) and (max-width:834px){
	#visual {
		height: 400px;
		background-position: center top;
		}
		
		#visual h1 {
			height: 400px;
			font-size: 40px;			
			line-height: 1.2;
			top: 55%;
			}
		
			#visual h1 span {
				line-height: 1.8;
				margin-top: 10px;
				}
	}

@media screen and (max-width:400px){
	#visual,
	#visual h1 {
		height: 50vh;
		}
	
	#visual {
		background-image: url(../../img/service/japanese/mob_visual.jpg);
		}
		
		#visual h1 {
			width: 90%;
			font-size: 24px;
			line-height: 1.3;
			z-index: 99;
			position: absolute;
			left: 5%;
			top: 45%;
			}
		
			#visual h1 span {
				font-size: 13px;
				padding-top: 10px;
				line-height: 1.5;
				letter-spacing: 0.1em;
				}
			
			#visual h1 img {
				height: 100%;
				}
	}



/* common --------------------------------------------------------------- */
p.point {
	font-size: 15px;
	line-height: 2.5;
	text-align: center;
	}
			
	p.point span {
		display: inline;
		color: #e95538;
		color: #012f81;
		color: #0891d5;
		padding-left: 3px;
		background-image: url(../../img/common/namisenB.png);
		background-position: left bottom;
		background-size: auto 2px;
		background-repeat: repeat-x;
		}
		
	p.point span.small {
		color: inherit;
		font-size: 80%;
		padding: 0;
		background-image: none;
		}

@media screen and (max-width:768px){
	p.point {
		line-height: 2;
		text-align: left;
		}
	}
		
				
	
/* japanese --------------------------------------------------------------- */
#japanese {
	margin: 0 auto;
	padding-top: 30px;
	}
	
	#japanese .outline {
		margin: 0 auto;
		padding: 70px 0;
		}
	
	#japanese .outline:first-child {
		padding: 0 0 70px 0;
		}
		
	#japanese .outline:nth-child(even){
		background-color: #f9f9f9;
		}
		
	#japanese .outline:last-child {
		margin: 0 auto;
		}
		
	#japanese h2.image {
		width: 400px;
		}
		
		#japanese h2.image span {
			width: 150px;
			}
			
	#japanese h2 {
		margin-bottom: 50px;
		}
		
	#japanese p {
		width: 90%;
		margin: 0 auto 70px auto;
		}
	
	#japanese p.image {
		width: 900px;
		margin: 0 auto;
		}
		
	#japanese ul {
		text-align: center;
		}
			
		#japanese ul li {
			width: 280px;
			height: 280px;
			display: inline-block;
			margin: 0 50px;
			padding: 20px 10px 0 10px;
			vertical-align: top;
			box-sizing: border-box;
			border: solid 0.5px;
			border-color: #0891d5 !important;
			border-radius: 140px;
			}
			
		#japanese ul li:first-child,			
		#japanese ul li:last-child {
			margin: 0 auto;
			}
			
			#japanese ul li p {
				font-size: 13px;
				line-height: 1.7;
				text-align: center;
				margin-bottom: 0;
				padding: 0 10px;
				}
				
				#japanese ul li span {
					font-size: 15px;			
					display: inline-block;
					color: #0891d5;
					text-align: center;
					margin: 0 auto 15px auto;
					padding: 15px 0 0 0;
					background-image: url(../../img/common/namisenB.png);
					background-position: left bottom;
					background-size: auto 2px;
					background-repeat: repeat-x;
					}

@media screen and (min-width:835px) and (max-width:1112px){
		#japanese ul li {
			margin: 0 20px;
			}
	}

@media screen and (max-width:834px){
	#japanese {
		margin: 0 auto;
		padding-top: 30px;
		}
		
		#japanese .outline {
			margin: 0 auto;
			padding: 50px 0;
			}
		
		#japanese .outline:first-child {
			padding: 0 0 50px 0;
			}
			
		#japanese h2.image {
			width: 300px;
			}
				
		#japanese h2 {
			margin-bottom: 30px;
			}
			
		#japanese p {
			width: 90%;
			margin: 0 auto 50px auto;
			}
		
		#japanese p.image {
			width: 90%;
			margin: 0 auto;
			}
				
			#japanese ul li {
				margin: 10px 10px 0 10px;
				}
				
			#japanese ul li:first-child {
				margin: 10px 10px 0 10px;
				}
			
			#japanese ul li:last-child {
				margin: 0 10px;
				}
				
				#japanese ul li p {
					font-size: 14px;
					}
	}

	#japanese ol {
		width: 90%;
		max-width: 1100px;
		margin: 0 auto;
		overflow: hidden;
		}
		
		#japanese ol li {
			float: left;
			width: 350px;
			height: auto;
			margin-right: 25px;
			}
		
		#japanese ol li:last-child {
			margin-right: 0;
			}
			
			#japanese ol li h3 {
				margin-bottom: 30px;
				padding-bottom: 0;
				background-image: none;
				font-size: 15px;
				font-weight: normal;
				}
			
			#japanese ol li p {
				height: auto;
				font-size: 13px;
				line-height: 1.7;
				margin: 0 auto;
				}
				
				#japanese ol li p span {
					display: block;
					color: #0891d5;
					font-size: 14px;
					text-align: center;
					letter-spacing: 1.5px;
					margin-bottom: 10px;
					padding: 20px 0;
					border: solid 0.5px;
					border-color: #0891d5;
					background-image: none;
					}

@media screen and (min-width:835px) and (max-width:1112px){
	#japanese ol {
		}
		
		#japanese ol li {
			width: 32%;
			margin-right: 2%;
			}
	}

@media screen and (max-width:834px){
	#japanese ol {
		}
		
		#japanese ol li {
			float: none;
			width: 100%;
			height: auto;
			margin-right: 0;
			margin-bottom: 30px;
			}
			
		#japanese ol li:last-child {
			margin-right: 0;
			}
			
			#japanese ol li h3 {
				margin-bottom: 30px;
				padding-bottom: 0;
				background-image: none;
				font-size: 15px;
				font-weight: normal;
				}
				
				#japanese ol li p span {
					display: block;
					color: #0891d5;
					font-size: 14px;
					text-align: center;
					letter-spacing: 1.5px;
					margin-bottom: 10px;
					padding: 20px 0;
					border: solid 0.5px;
					border-color: #0891d5;
					background-image: none;
					}
	}



/* case --------------------------------------------------------------- */
#case {
	margin: 0 auto;
	padding: 70px 0;
	background-color: #f9f9f9;
	}
	
	#case ul {
		width: 90%;
		max-width: 1100px;
		margin: 0 auto 30px auto;
		display: flex;
		flex-wrap: wrap;
		
		background-image: url(../../img/common/arrowG.png);
		background-position: center center;
		background-size: 20px auto;
		}
	
	#case ul:last-child {
		margin: 0 auto;
		}
		
		#case ul h3 {
			color: #0891d5;
			display: inline-block;
			font-size: 15px;
			font-weight: normal;
			text-align: center;
			margin: 0 auto;
			padding-bottom: 3px;
			margin-bottom: 10px;
			letter-spacing: 0.15em;
			
			background-image: url(../../img/common/namisenB.png);
			background-position: left bottom;
			background-repeat: repeat-x;
			background-size: auto 3px;
			}
			
		#case ul li:last-child h3 {
			color: #e95538;
			background-image: url(../../img/common/namisenR.png);
			background-position: left bottom;
			background-repeat: repeat-x;
			background-size: auto 3px;
			}
			
		#case ul li {
			width: 500px;
			padding: 15px 30px 30px 30px;
			box-sizing: border-box;
			border-radius: 10px;
			background-color: #ffffff;
			background-position: left top, right bottom;
			background-size: 18px auto, 18px auto;
			}
			
		#case ul li:first-child {
			margin-right: 100px;
			background-image: url(../../img/service/common/kadai_left.jpg), url(../../img/service/common/kadai_right.jpg);
			}
				
		#case ul li:last-child {
			background-image: url(../../img/service/common/kaiketsu_left.jpg), url(../../img/service/common/kaiketsu_right.jpg);
			}

@media screen and (min-width:835px) and (max-width:1112px){
	#case ul {
		margin: 0 auto 20px auto;
		display: block;
		flex-wrap: no-wrap;
		overflow: hidden;
		}
		
		#case ul li {
			width: 48%;
			}
			
		#case ul li:first-child {
			float: left;
			margin-right: 0;
			}
				
		#case ul li:last-child {
			float: right;
			}
	}

@media screen and (max-width:834px){
	#case {
		padding: 50px 0;
		}
		
		#case ul {
			margin: 0 auto 40px auto;
			display: block;
			flex-wrap: no-wrap;
			background-image: none;
			}
		
		#case ul:last-child {
			margin: 0 auto;
			}
				
			#case ul li {
				width: 100%;
				padding: 15px 20px 20px 20px;
				}
				
			#case ul li:first-child {
				margin-right: 0;
				margin: 0 0 5px 0;
				}
	}
	
	
			
/* 申し込み --------------------------------------------------------------- */	
#moshikomi {
	padding: 150px 0;
	background-image: url(../../img/service/common/moshikomi.jpg);
	background-position: center center;
	background-size: cover;
	}

	#moshikomi .more {
		width: 350px;
		margin: 0 auto;
		}
	
		#moshikomi .more a {
			font-size: 16px;
			padding: 25px 0;
			color: #ffffff;
			border-color: #ffffff !important;
			background-image: url(../../img/common/arrowW.png);
			}

@media screen and (max-width:768px){
#moshikomi {
	padding: 50px 0;
	}
	
	#moshikomi .more {
		width: 90%;
		}
		
		#moshikomi .more a {
			font-size: 15px;
			}
	}