@charset "UTF-8";
/*--------------------------------------------------
**************************************************
  PC用
**************************************************
--------------------------------------------------*/
@media screen and (min-width: 768px) {
	
	#page_title{
		background: url(../images/service/service_h1_bg.jpg) no-repeat center;
		background-size: cover;
	}	

/* ----------------------------------------
	simulation
---------------------------------------- */

	section h2 {
		font-size: 18px;
		padding: 12px 15px 10px 30px;
		position: relative;
		color: white;
		background-color: #e71e29;
		border-bottom: 3px solid #c00;
	}
	section h2::after {
		 position: absolute;
		 top: 50%;
		 left:0;
		 transform:translateY(-50%);
		 content: '';
		 width: 18px;
		 height:4px;
		 background-color:white;
	}
	.service_box {
		width: 100%;
		align-items: center;
		position: relative;
		padding: 20px;
		box-sizing: border-box;
		border: 2px solid #e83928;
		border-radius: 20px;
	}
	.service_box img {
		width: 30%;
		height: auto;
		display: block;
		border-radius: 10px
	}
	.service_box .text_box {
		width: 65%;
	}
	.service_box .text_box .title {
		font-size: 20px;
		padding-bottom: 10px;
		margin-bottom: 20px;
		border-bottom: 1px solid #e83928;
		font-weight: bold;
	}
	.service_box a {
		position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-indent:-99999px;
		z-index: 2;
	}
	.service_box a:hover {
		background: rgba(255,255,255,.25);
	}
	
	
}/* End PC */



/*--------------------------------------------------
**************************************************
  SP用
**************************************************
--------------------------------------------------*/
@media screen and (max-width: 767px) {
	
	#page_title{
		background: url(../images/service/service_h1_bg.jpg) no-repeat right 70%;
		background-size: cover;
	}	

/* ----------------------------------------
	simulation
---------------------------------------- */

	section h2 {
		font-size: 3vw;
		padding: 2vw 3vw 1.5vw 5vw;
		position: relative;
		color: white;
		background-color: #e71e29;
		border-bottom: 3px solid #c00;
	}
	section h2::after {
		 position: absolute;
		 top: 50%;
		 left:0;
		 transform:translateY(-50%);
		 content: '';
		 width: 3vw;
		 height:4px;
		 background-color:white;
	}
	section h2 {
		font-size: 18px;
		padding: 12px 15px 10px 30px;
		position: relative;
		color: white;
		background-color: #e71e29;
		border-bottom: 3px solid #c00;
	}
	section h2::after {
		 position: absolute;
		 top: 50%;
		 left:0;
		 transform:translateY(-50%);
		 content: '';
		 width: 18px;
		 height:4px;
		 background-color:white;
	}
	.service_box {
		width: 100%;
		align-items: center;
		position: relative;
		padding: 20px 5vw;
		box-sizing: border-box;
		border: 2px solid #e83928;
		border-radius: 10px;
	}
	.service_box img {
		width: 100%;
		height: auto;
		display: block;
		border-radius: 10px
	}
	.service_box .text_box {
		width: 100%;
		margin-top: 20px;
	}
	.service_box .text_box .title {
		font-size: 4.5vw;
		padding-bottom: 10px;
		margin-bottom: 20px;
		border-bottom: 1px solid #e83928;
		font-weight: bold;
		text-align: center;
	}
	.service_box a {
		position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-indent:-99999px;
		z-index: 2;
	}
	.service_box a:hover {
		background: rgba(255,255,255,.25);
	}




}/* End SP */