/*pc_css*/
@media screen and (min-width:751px){
	.main{
		width:100%;
		height:100vh;
		position: relative;
	}
	
	.main .potx{
		position: absolute;
		width:100%;
		height: 100%;
		top:0;
		left:0;
		z-index:2;
	}
	
	.main .potx .in{
		position: relative;
  		top: 50%;
  		-webkit-transform: translateY(-50%);
  		-ms-transform: translateY(-50%);
  		transform: translateY(-50%);
		width:1040px;
		margin:0 auto;
		color:#fff;
		font-size:2.3em;
		letter-spacing: 0.1em;
	}
	
	.header ul li.home a {
  		position: relative;
  		display: inline-block;
  		text-decoration: none;
		padding:0 3px;
		color:#fff;
		opacity:1 !important;
	}
	
	.header ul li.home a::after {
  		position: absolute;
  		bottom: -6px;
 		left: 0;
  		content: '';
  		width: 100%;
  		height: 1px;
  		background: #fff;
  		transform: scale(1, 1);
  		transform-origin: right top;
  		transition: transform .3s;
	}
	
	.header .innerbox2 ul li.home a {
  		position: relative;
  		display: inline-block;
  		text-decoration: none;
		padding:0 3px;
		color:#333;
		opacity:1 !important;
	}
	
	.header .innerbox2 ul li.home a::after {
  		position: absolute;
  		bottom: -6px;
 		left: 0;
  		content: '';
  		width: 100%;
  		height: 1px;
  		background: #333;
  		transform: scale(1, 1);
  		transform-origin: right top;
  		transition: transform .3s;
	}
	
	.cont1{
		margin:-65px 0 0 0;
		position: relative;
		z-index:1;
	}
	
	.cont1 .innerbox{
		width:1040px;
		margin:0 auto 190px;
		padding:0 60px 0 60px;
		box-sizing: border-box;
		background:#f1f1f1;
	}
	
	.cont1 .txcont{
		position: relative;
		padding:0 0 60px 0;
		width:50%;
	}
	
	.cont1 .txcont .phbox{
		position: absolute;
		top:0;
		left:100%;
		height:calc(100% + 75px);
	}
	
	.cont1 .arrowbox{
		height:65px;
		with:1040px;
		margin:0 auto;
		background:url("/images/index/arrow.png") no-repeat;
		background-size:13px;
		background-position: 50% 50%;
	}
	
	.cont1 .tl02{
		font-size:2em;
		letter-spacing: 0.05em;
		margin:0 0 40px 0;
	}
	
	.cont1 .tx{
		line-height: 2.5em;
	}
	
	.cont2{
		padding:80px 0;
		background:#f1f1f1;
	}
	
	.cont2 .innerbox{
		width:1040px;
		margin:0 auto;
	}
	
	.cont2 .innerbox .tl01{
		float: left;
		margin:0 120px 0 0;
	}
	
	.cont2 .innerbox .headcont{
		margin:0 0 50px 0;
	}
	
	.cont2 .innerbox .headcont ul{
		float: left;
		list-style: none;
		padding:20px 0 0 0;
	}
	
	.cont2 .innerbox .headcont ul li{
		float: left;
		margin:0 55px 0 0;
		cursor: pointer;
		transition: opacity 0.3s;
		opacity: 0.5;
	}
	
	.cont2 .innerbox .headcont ul li.active{
		opacity: 1;
	}
	
	.cont2 .innerbox .headcont ul li:hover{
		opacity: 1;
	}
	
	.cont2 .innerbox ul.listbox{
		width:calc(100% + 15px);
		margin:0 0 0 -15px;
		list-style: none;
	}
	
	.cont2 .innerbox ul.listbox li{
		width:calc(25% - 15px);
		margin:0 0 15px 15px;
		float: left;
	}
	
	.cont2 .innerbox ul.listbox li a{
		display: block;
		overflow: hidden;
		height:160px;
		width:100%;
		line-height: 0;
	}
	
	.cont2 .innerbox ul.listbox li a img{
		transition: all 1s;
	}
	
	.cont2 .innerbox ul.listbox li a:hover img{
		transform: scale(1.1);
	}
	
	.cont3{
		padding:80px 0;
		background:#fff;
	}
	
	.cont3 .innerbox{
		width:1040px;
		margin:0 auto;
	}
	
	.cont3 .innerbox .tl01{
		margin:0 0 50px 0;
	}
	
	.cont3 .innerbox .floatbox{
		margin:0 0 50px 0;
	}
	
	.cont3 .innerbox .leftbox{
		float:left;
	}
	
	.cont3 .innerbox .rightbox{
		float:right;
	}
	
	.cont3 .innerbox a{
		display: block;
		line-height: 0;
		width:510px;
		height:310px;
		position: relative;
		overflow: hidden;
	}
	
	.cont3 .innerbox a img{
		transition: all 1s;
	}
	
	.cont3 .innerbox a:hover img{
		transform: scale(1.1);
	}
	
	.cont3 .innerbox a span{
		position: absolute;
		left:15px;
		bottom:15px;
		color:#fff;
		display: block;
		line-height: 1;
	}
	
	.cont4{
		padding:80px 0;
		background:#f1f1f1;
	}
	
	.cont4 .innerbox{
		width:1040px;
		margin:0 auto;
	}
	
	.cont4 .innerbox .tl01{
		margin:0 0 50px 0;
	}
	
	.cont4 .innerbox .instabox a{
		display: block;
		overflow: hidden;
		height:160px !important;
		width:100%;
		line-height: 0;
	}
	
	.cont4 .innerbox .instabox a img{
		transition: all 1s;
	}
	
	.cont4 .innerbox .instabox a:hover img{
		transform: scale(1.1);
	}
	
	iframe .figure {
    position: relative;
    overflow: hidden;
  	height:200px !important;
	}
	
	.tl01{
		font-size:2.3em;
		letter-spacing: 0.1em;
		position: relative;
		padding:0 0 20px 0;
		line-height: 1.5em;
		margin:0 0 50px 0;
	}
	
	.tl01:after{
		content: "";
		width:55px;
		border-bottom:1px solid #333;
		position: absolute;
		bottom:0;
		left:0;
	}
	
	a.linkbtn{
		line-height: 2.5em;
		position: relative;
		display: inline-block;
		pdding:0 0 10px 0;
		color:#333;
		text-decoration: none;
		transition: opacity 0.3s;
		font-size:1.1em;
		margin:50px 0 0 0;
	}
	
	a.linkbtn:hover{
		opacity: 0.8;
	}
	
	a.linkbtn:after{
		content: "";
		width:100%;
		border-bottom:1px solid #333;
		position: absolute;
		bottom:0;
		left:0;
	}
}

@media screen and (max-width:750px){
	.main{
		width:100%;
		height:35vh;
		position: relative;
		margin:55px 0 0 0;
	}
	
	.main .potx{
		position: absolute;
		width:100%;
		height: 100%;
		top:0;
		left:0;
		z-index:2;
	}
	
	.main .potx .in{
		position: relative;
  		top: 50%;
  		-webkit-transform: translateY(-50%);
  		-ms-transform: translateY(-50%);
  		transform: translateY(-50%);
		width:80%;
		margin:0 auto;
		color:#fff;
		font-size:1.8em;
		letter-spacing: 0.1em;
	}
	
	.header ul li.home a {
  		position: relative;
  		display: inline-block;
  		text-decoration: none;
		padding:0 3px;
		color:#fff;
		opacity:1 !important;
	}
	
	.header ul li.home a::after {
  		position: absolute;
  		bottom: -6px;
 		left: 0;
  		content: '';
  		width: 100%;
  		height: 1px;
  		background: #fff;
  		transform: scale(1, 1);
  		transform-origin: right top;
  		transition: transform .3s;
	}
	
	.header .innerbox2 ul li.home a {
  		position: relative;
  		display: inline-block;
  		text-decoration: none;
		padding:0 3px;
		color:#333;
		opacity:1 !important;
	}
	
	.header .innerbox2 ul li.home a::after {
  		position: absolute;
  		bottom: -6px;
 		left: 0;
  		content: '';
  		width: 100%;
  		height: 1px;
  		background: #333;
  		transform: scale(1, 1);
  		transform-origin: right top;
  		transition: transform .3s;
	}
	
	.cont1{
		margin:0 0 0 0;
		position: relative;
		z-index:1;
	}
	
	.cont1 .innerbox{
		width:100%;
		margin:0 auto 0;
		padding:60px 5% 0 ;
		box-sizing: border-box;
		background:#f1f1f1;
	}
	
	.cont1 .txcont{
		position: relative;
		padding:0 0 0 0;
		width:100%;
	}
	
	.cont1 .txcont .phbox{
		position: relative;
		width:110% !important;
		margin:40px 0 0 -5%;
	}
	
	.cont1 .arrowbox{
		height:65px;
		with:1040px;
		margin:0 auto;
		background:url("/images/index/arrow.png") no-repeat;
		background-size:13px;
		background-position: 50% 50%;
		display:none;
	}
	
	.cont1 .tl02{
		font-size:1.8em;
		letter-spacing: 0.05em;
		margin:0 0 40px 0;
	}
	
	.cont1 .tx{
		line-height: 2.5em;
	}
	
	.cont2{
		padding:60px 0;
		background:#f1f1f1;
	}
	
	.cont2 .innerbox{
		margin:0 auto;
		padding:0 5%;
	}
	
	.cont2 .innerbox .tl01{
		float: left;
		margin:0 120px 0 0;
	}
	
	.cont2 .innerbox .headcont{
		margin:0 0 40px 0;
	}
	
	.cont2 .innerbox .headcont ul{
		float: left;
		list-style: none;
		padding:20px 0 0 0;
	}
	
	.cont2 .innerbox .headcont ul li{
		float: left;
		margin:0 15px 0 0;
		cursor: pointer;
		transition: opacity 0.3s;
		opacity: 0.5;
	}
	
	.cont2 .innerbox .headcont ul li.active{
		opacity: 1;
	}
	
	.cont2 .innerbox .headcont ul li:hover{
		opacity: 1;
	}
	
	.cont2 .innerbox ul.listbox{
		width:calc(100% + 10px);
		margin:0 0 0 -10px;
		list-style: none;
	}
	
	.cont2 .innerbox ul.listbox li{
		width:calc(50% - 10px);
		margin:0 0 10px 10px;
		float: left;
	}
	
	.cont2 .innerbox ul.listbox li a{
		display: block;
		overflow: hidden;
		height:17vh;
		width:100%;
		line-height: 0;
	}
	
	.cont2 .innerbox ul.listbox li a img{
		transition: all 1s;
	}
	
	.cont2 .innerbox ul.listbox li a:hover img{
		transform: scale(1.1);
	}
	
	.cont3{
		padding:60px 0 20px 0;
		background:#fff;
	}
	
	.cont3 .innerbox{
		padding:0 5%;
		margin:0 auto;
	}
	
	.cont3 .innerbox .tl01{
		margin:0 0 30px 0;
	}
	
	.cont3 .innerbox .floatbox{
		margin:0 0 50px 0;
	}
	
	.cont3 .innerbox .leftbox{
		float:left;
		margin:0 0 40px 0;
	}
	
	.cont3 .innerbox .rightbox{
		float:right;
	}
	
	.cont3 .innerbox a{
		display: block;
		line-height: 0;
		width:100%;
		height:30vh;
		position: relative;
		overflow: hidden;
	}
	
	.cont3 .innerbox a img{
		transition: all 1s;
	}
	
	.cont3 .innerbox a:hover img{
		transform: scale(1.1);
	}
	
	.cont3 .innerbox a span{
		position: absolute;
		left:15px;
		bottom:15px;
		color:#fff;
		display: block;
		line-height: 1;
	}
	
	.cont4{
		padding:80px 0;
		background:#f1f1f1;
	}
	
	.cont4 .innerbox{
		width:1040px;
		margin:0 auto;
	}
	
	.cont4 .innerbox .tl01{
		margin:0 0 50px 0;
	}
	
	.cont4 .innerbox .instabox a{
		display: block;
		overflow: hidden;
		height:160px !important;
		width:100%;
		line-height: 0;
	}
	
	.cont4 .innerbox .instabox a img{
		transition: all 1s;
	}
	
	.cont4 .innerbox .instabox a:hover img{
		transform: scale(1.1);
	}
	
	iframe .figure {
    position: relative;
    overflow: hidden;
  	height:200px !important;
	}
	
	.tl01{
		font-size:2.1em;
		letter-spacing: 0.1em;
		position: relative;
		padding:0 0 20px 0;
		line-height: 1.5em;
		margin:0 0 30px 0;
	}
	
	.tl01:after{
		content: "";
		width:55px;
		border-bottom:1px solid #333;
		position: absolute;
		bottom:0;
		left:0;
	}
	
	a.linkbtn{
		line-height: 2.5em;
		position: relative;
		display: inline-block;
		pdding:0 0 10px 0;
		color:#333;
		text-decoration: none;
		transition: opacity 0.3s;
		font-size:1.1em;
		margin:30px 0 0 0;
	}
	
	a.linkbtn:hover{
		opacity: 0.8;
	}
	
	a.linkbtn:after{
		content: "";
		width:100%;
		border-bottom:1px solid #333;
		position: absolute;
		bottom:0;
		left:0;
	}
}