
/*pc_css*/
@media screen and (min-width:751px){
	
	#index{
		width:100%;
		position: relative;
	}

	
	#index .rightbox{
		width:50%;
		position: fixed;
		height:100%;
		background:url("../images/index/index_img01.jpg") 50% top no-repeat;
		background-size:cover;
		top:0;
		right:0;
	}
	
	#index .rightbox .titlebox{
		width:100%;
		padding:0 20% 0 20%;
		box-sizing: border-box;
		position: relative;
		top:25%;
		
	}
	
	#index .rightbox .titlebox img{
		width:100%;
		height: auto;
		
	}
	
	#index .leftbox{
		width:50%;
		margin:0 50% 0 0 ;
	}
	
	#index .leftbox .innerbox{
		padding:80px 14% 90px 14%;
		width:100%;
		box-sizing: border-box;
	}
	
	#index .leftbox .logobox{
		width:200px;
		margin:0 auto 20px;
	}
	
	#index .leftbox .subtx01{
		margin:0 0 45px 0;
		font-size:1.7em;
		line-height: 1.5em;
	}

	#index .leftbox .subtx01{
		margin:0 0 45px 0;
		font-size:1.7em;
		line-height: 1.5em;
	}
	
	#index .leftbox .selectbtn{
		border:1px solid #2b2b2b;
		padding:5px 0;
		box-sizing: border-box;
		margin:0 0 60px 0;
	}
	
	#index .leftbox .selectbtn .inbtn{
		display: block;
		float: left;
		width:50%;
		box-sizing: border-box;
		border-right:1px solid #2b2b2b;
		padding:0 5px;
	}
	
	#index .leftbox .selectbtn .inbtn:last-child{
		border-right:none;
	}
	
	#index .leftbox .selectbtn .inbtn a{
		text-align: center;
		padding:15px 0;
		display: block;
		text-decoration: none;
		color:#2b2b2b;
		opacity:1;
    	transition:all 0.3s;
	}
	
	#index .leftbox .selectbtn .inbtn a:hover{
		background:#2b2b2b;
		color:#f6f6f6;
	}
	
	#index .leftbox .textbox{
		width:100%;
		background:#fff;
		border-bottom:2px solid #eaeaea;
		padding:25px 10px 10px 10px;
		box-sizing: border-box;
		text-align: center;
	}
	
	#index .leftbox .textbox .tl{
		font-family: 'Raleway', sans-serif;
		font-weight: 300;
		font-size:2em;
		display: inline-block;
		padding:0 0 10px 0;
		margin:0 0 20px 0;
		border-bottom:1px solid #2b2b2b;
	}
	
	#index .leftbox .textbox .tx{
		line-height: 2em;
		margin:0 0 50px 0;
		text-align: left;
		padding:0 30px;
		font-size:0.95em;
	}
	
	#index .leftbox .textbox .selectbtn2{
		width:100%;
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn{
 		width: 50%;
		padding:0 5px 0 0;
		box-sizing: border-box;
		float: left;
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn:last-child{
 		width: 50%;
		padding:0 0 0 5px;
		box-sizing: border-box;
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn .inbox{
		padding-top: 66.66%;
		position: relative;
		background:#b76e29;
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn .inbox .intx{
		text-align: center;
		font-weight: bold;
		font-size:1.4em;
		position: absolute;
		top:50%;
		margin:-0.3em 0 0 0;
		width:100%;
		box-sizing: border-box;
		background:url("../images/index/arrow.png") no-repeat;
		background-size:11px;
		background-position: right 10px top 50%;
	}

	/*.intx2 {
		text-align: center;
		font-weight: bold;
		font-size:1.4em;
		position: absolute;
		top:50%;
		margin:-0.3em 0 0 0;
		width:100%;
		box-sizing: border-box;
		background:url("../images/index/arrow.png") no-repeat;
		background-size:11px;
		background-position: left 10px top 50%;
	}*/
	
	#index .leftbox .textbox .selectbtn2 .inbtn .inbox a{
		width:100%;
		height:100%;
		display: block;
		position: absolute;
		top:0;
		left:0;
		overflow: hidden;
		text-decoration: none;
		color:#fff;
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn .inbox a img{
		-moz-transition: -moz-transform 0.5s ease-out;
    	-webkit-transition: -webkit-transform 0.5s ease-out;
    	-o-transition: -o-transform 0.5s ease-out;
    	-ms-transition: -ms-transform 0.5s ease-out;
    	transition: transform 0.5s ease-out,opacity 0.5s;
		opacity:1;
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn .inbox:hover a img{
		-webkit-transform: scale(1.1);
    	-moz-transform: scale(1.1);
    	-o-transform: scale(1.1);
    	-ms-transform: scale(1.1);
    	transform: scale(1.1);
		opacity:0.8;
	}
	
	#index .leftbox .footer{
		border-top:1px solid #2b2b2b;
		padding:25px 0;
		text-align: center;
		font-size:0.85em;
		background:#f6f6f6;
	}

	
}

@media screen and (max-width:750px){
	#index{
		width:100%;
		position: relative;
	}

	
	#index .rightbox{
		width:90%;
		height:480px;
		position: relative;
		background:url("../images/index/index_img01.jpg") 50% top no-repeat;
		background-size:cover;
		margin:5% auto 0;
	}
	
	#index .rightbox .subtx01{
		font-size:1.1em;
		color:#fff;
		line-height: 1.5em;
		padding:20px 0 50px 0;
		
	}
	
	#index .rightbox .titlebox{
		width:240px;
		padding:20px 0 0 0;
		margin:0 auto;
		
	}
	
	#index .rightbox .titlebox img{
		width:100%;
		height: auto;
		
	}
	
	#index .leftbox{
		width:100%;
		margin:0 0 0 0 ;
		position: relative;
		z-index:1000;
	}
	
	#index .leftbox .innerbox{
		padding:5% 5% 50px 5%;
		width:100%;
		box-sizing: border-box;
	}
	
	#index .leftbox .logobox{
		width:140px;
		margin:0 auto 20px;
	}
	
	#index .leftbox .subtx01{
		margin:0 0 30px 0;
		font-size:1.1em;
		line-height: 1.5em;
	}
	
	#index .leftbox .selectbtn{
		border:1px solid #2b2b2b;
		padding:5px 0;
		box-sizing: border-box;
		margin:0 0 40px 0;
	}
	
	#index .leftbox .selectbtn .inbtn{
		display: block;
		float: left;
		width:50%;
		box-sizing: border-box;
		border-right:1px solid #2b2b2b;
		padding:0 5px;
	}
	
	#index .leftbox .selectbtn .inbtn:last-child{
		border-right:none;
	}
	
	#index .leftbox .selectbtn .inbtn a{
		text-align: center;
		padding:15px 0;
		display: block;
		text-decoration: none;
		color:#2b2b2b;
		opacity:1;
    	transition:all 0.3s;
	}
	
	#index .leftbox .selectbtn .inbtn a:hover{
		background:#2b2b2b;
		color:#f6f6f6;
	}
	
	#index .leftbox .textbox{
		width:100%;
		background:#fff;
		border-bottom:2px solid #eaeaea;
		padding:25px 10px 10px 10px;
		box-sizing: border-box;
		text-align: center;
	}
	
	#index .leftbox .textbox .tl{
		font-family: 'Raleway', sans-serif;
		font-weight: 300;
		font-size:2em;
		display: inline-block;
		padding:0 0 10px 0;
		margin:0 0 20px 0;
		border-bottom:1px solid #2b2b2b;
	}
	
	#index .leftbox .textbox .tx{
		line-height: 2em;
		margin:0 0 40px 0;
		text-align: left;
		padding:0 0;
		font-size:0.95em;
	}
	
	#index .leftbox .textbox .selectbtn2{
		width:100%;
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn{
 		width: 50%;
		padding:0 5px 0 0;
		box-sizing: border-box;
		float: left;
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn:last-child{
 		width: 50%;
		padding:0 0 0 5px;
		box-sizing: border-box;
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn .inbox{
		padding-top: 86.66%;
		position: relative;
		background:#b76e29;
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn .inbox .intx{
		text-align: center;
		font-weight: bold;
		font-size:1.4em;
		position: absolute;
		top:50%;
		margin:-0.3em 0 0 0;
		width:100%;
		box-sizing: border-box;
		background:url("../images/index/arrow.png") no-repeat;
		background-size:11px;
		background-position: right 10px top 50%;
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn .inbox a{
		width:100%;
		height:100%;
		display: block;
		position: absolute;
		top:0;
		left:0;
		overflow: hidden;
		text-decoration: none;
		color:#fff;
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn .inbox a img{
		-moz-transition: -moz-transform 0.5s ease-out;
    	-webkit-transition: -webkit-transform 0.5s ease-out;
    	-o-transition: -o-transform 0.5s ease-out;
    	-ms-transition: -ms-transform 0.5s ease-out;
    	transition: transform 0.5s ease-out,opacity 0.5s;
		opacity:1;
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn .inbox:hover a img{
		-webkit-transform: scale(1.1);
    	-moz-transform: scale(1.1);
    	-o-transform: scale(1.1);
    	-ms-transform: scale(1.1);
    	transform: scale(1.1);
		opacity:0.8;
	}
	
	#index .leftbox .footer{
		border-top:1px solid #2b2b2b;
		padding:25px 0;
		text-align: center;
		font-size:0.85em;
		background:#f6f6f6;
	}
}
	