@charset "utf-8";

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

#head nav ul li.m0 a{
	background-color:#FFF;
	color:#232323;
	border-bottom:1px solid #4C4C4C;
	}
}
header{
	min-height:660px;
	overflow:hidden;
	zoom:1;
	}
header .youtubelink{
	position:absolute;
	left:4%;
	bottom:5%;
	z-index:10;
	}
header .youtubelink img{
	width:180px;
	height:auto;
	}
#moviebg{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	}
#moviebg video{
	position:absolute;
	}
#moviebg .mv{
	position:absolute;
	right:0;
	bottom:0;
	width:100%;
	height:100%;
	background:url(../img/home/bx_loader.gif) no-repeat center 48%;
	}
#moviebg .mv img{
	height:48%;
	width:auto;
	z-index:2;
	position:absolute;
	top:52%;
	left:50%;
	transform:translateY(-50%) translateX(-50%);
	-webkit-transform:translateY(-50%) translateX(-50%);
	opacity:0;
	margin-top:50px;
	transition:all 2s;
	}
#moviebg .mv#mv1 img{
	height:58%;
	}
#moviebg .mv#mv2 img{
	height:54%;
	}
#slidesp{
	display:none;
	}
#newsbg{
	background-color:#E6F4F2;
	padding:70px 40px 70px 40px;
	overflow:hidden;
	zoom:1;
	}
.newsb{
	max-width:1100px;
	margin:0 auto;
	padding-bottom:60px;
	background-color:#FFF;
	}
.newsb.impor{
	margin-top:80px;
	}
.newsb h2{
	padding:30px 100px 24px 100px;
	background:url(../img/home/newsicon.png) no-repeat 50px center;
	-webkit-background-size:80px auto;
	background-size:80px auto;
	background-color:#CAE7E3;
	text-align:center;
	}
.newsb h2 strong{
	font-size:28px;
	color:#028F7B;
	letter-spacing:0.15em;
	}
.newsb h2 strong span{
	font-size:23px;
	display:block;
	font-family:"Lato", sans-serif;
	font-weight:bold;
	margin-bottom:8px;
	letter-spacing:0.1em;
	}
.newsb article{
	position:relative;
	padding:30px 20px 30px 185px;
	margin:0 30px;
	border-bottom:1px solid #028F7B;
	}
.newsb article time{
	font-size:20px;
	font-family:"Lato", sans-serif;
	font-weight:normal;
	position:absolute;
	left:30px;
	top:32px;
	}
.newsb article h3{
	font-size:20px;
	font-weight:normal;
	line-height:1.4;
	}
.newsb article h3 .newicon{
	display:inline-block;
	padding:2px 10px 1px 10px;
	color:#FFF;
	background-color:#72B862;
	line-height:1.3;
	margin-left:18px;
	font-size:15px;
	font-family:"Lato", sans-serif;
	font-weight:normal;
	vertical-align:1px;
	border-radius:4px;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	-o-border-radius:4px;
	-ms-border-radius:4px;
	}
.newsb h4{
	text-align:center;
	padding-top:40px;
	}
.newsb h4.linkto a{
	font-size:21px;
	font-weight:bold;
	border-color:#028F7B;
	color:#028F7B;
	letter-spacing:0.15em;
	}
.newsb h4.linkto a:after{
	background-color:#028F7B;
	}
.newsb h4.linkto a:before{
	background-color:#028F7B;
	}
.newsb h4.linkto a:hover{
	text-decoration:none;
	filter:alpha(opacity=80);
	-moz-opacity:0.8;
	opacity:0.8;
	}
#sec1{
	overflow:hidden;
	zoom:1;
	padding:60px 0 0 0;
	max-width:1000px;
	margin:0 auto;
	}
#sec1 #slidebg{
	position:relative;
	width:100%;
	height:1000px;
	}
#sec1 #slidebg #slide{
	position:absolute;
	left:22%;
	top:22%;
	width:56%;
	z-index:1;
	overflow:hidden;
	zoom:1;
	}
#sec1 #slidebg #slide ul li img{
	max-width:100%;
	height:auto;
	border:14px solid #DBDBDB;
	border-radius:400px;
	-webkit-border-radius:400px;
	-moz-border-radius:400px;
	-o-border-radius:400px;
	-ms-border-radius:400px;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-o-box-sizing:border-box;
	-ms-box-sizing:border-box;
	}
#sec1 #slidebg #slide h2{
	font-size:42px;
	font-weight:normal;
	line-height:1.5;
	-webkit-writing-mode:vertical-rl;
	-ms-writing-mode:tb-rl;
	writing-mode:vertical-rl;
	color:#FFF;
	position:absolute;
	left:50%;
	top:50%;
	margin:-220px 0 0 -40px;
	z-index:2;
	text-shadow:-2px 2px 4px rgba(30,30,30,0.5);
	}
#sec1 #slidebg #slide h3{
	font-size:22px;
	line-height:1.5;
	-webkit-writing-mode:vertical-rl;
	-ms-writing-mode:tb-rl;
	writing-mode:vertical-rl;
	color:#FFF;
	position:absolute;
	left:22%;
	top:50%;
	margin-top:-110px;
	z-index:2;
	text-shadow:-2px 2px 4px rgba(30,30,30,0.5);
	}
#sec1 #slidebg #slide h4{
	font-size:18px;
	letter-spacing:0.3em;
	font-family:"Lato", sans-serif;
	line-height:1.5;
	-webkit-writing-mode:vertical-rl;
	-ms-writing-mode:tb-rl;
	writing-mode:vertical-rl;
	color:#FFF;
	position:absolute;
	left:12%;
	top:50%;
	margin-top:-70px;
	z-index:2;
	text-shadow:-2px 2px 4px rgba(30,30,30,0.5);
	}
#sec1 #slidebg #slide:after{
	content:"";
	display:block;
	width:2px;
	height:40%;
	background-color:#FFF;
	position:absolute;
	left:19%;
	top:30%;
	z-index:2;
	}
#sec1 #slidebg #sum{
	position:relative;
	z-index:4;
	}
#sec1 #slidebg #sum ul li{
	position:absolute;
	left:39%;
	top:0;
	width:22%;
	z-index:4;
	}
#sec1 #slidebg #sum ul li:nth-of-type(2){
	left:58.5%;
	margin-top:5.5%;
	}
#sec1 #slidebg #sum ul li:nth-of-type(3){
	left:73%;
	margin-top:19.5%;
	}
#sec1 #slidebg #sum ul li:nth-of-type(4){
	left:78%;
	margin-top:39%;
	}
#sec1 #slidebg #sum ul li:nth-of-type(5){
	left:73%;
	margin-top:58.5%;
	}
#sec1 #slidebg #sum ul li:nth-of-type(6){
	left:58.5%;
	margin-top:72.5%;
	}
#sec1 #slidebg #sum ul li:nth-of-type(7){
	margin-top:78%;
	}
#sec1 #slidebg #sum ul li:nth-of-type(8){
	left:19.5%;
	margin-top:72.5%;
	}
#sec1 #slidebg #sum ul li:nth-of-type(9){
	left:5%;
	margin-top:58.5%;
	}
#sec1 #slidebg #sum ul li:nth-of-type(10){
	left:0%;
	margin-top:39%;
	}
#sec1 #slidebg #sum ul li:nth-of-type(11){
	left:5%;
	margin-top:19.5%;
	}
#sec1 #slidebg #sum ul li:nth-of-type(12){
	left:19.5%;
	margin-top:5.5%;
	}
#sec1 #slidebg #sum ul li img{
	width:100%;
	height:auto;
	}
#sec1 #slidebg #sum ul li h3{
	font-size:28px;
	line-height:1.3;
	color:#FFF;
	position:absolute;
	left:10%;
	width:80%;
	top:50%;
	margin-top:-35px;
	z-index:2;
	text-shadow:-2px 2px 4px rgba(30,30,30,0.5);
	text-align:center;
	}
#sec1 #slidebg #sum ul li:nth-of-type(11) h3{
	margin-top:-55px;
	}
#sec1 #slidebg #sum ul li h3 strong{
	display:block;
	font-size:17px;
	font-family:"Lato", sans-serif;
	margin-top:15px;
	}
#sec1 #slidebg #sum ul li h3 a{
	color:#FFF;
	}
#sec1 #slidebg #sum ul li a:after{
	content:"";
	display:block;
	width:50%;
	height:2px;
	background-color:#FFF;
	position:absolute;
	left:25%;
	top:53%;
	z-index:2;
	}
#sec1 #slidebg #sum ul li:nth-of-type(11) a:after{
	top:60%;
	}
#sec2{
	padding:80px 0 60px 0;
	overflow:hidden;
	zoom:1;
	max-width:1100px;
	margin:0 auto;
	}
#sec2 ul{
	background-color:#FFF;
	overflow:hidden;
	zoom:1;
	padding:0 0 10px 10px
	}
#sec2 ul li{
	float:left;
	width:25%;
	padding:10px 10px 0 0;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-o-box-sizing:border-box;
	-ms-box-sizing:border-box;
	position:relative;
	}
#sec2 ul li:nth-of-type(5),#sec2 ul li:nth-of-type(6),#sec2 ul li:nth-of-type(7){
	width:33.3333%;
	}
#sec2 ul li a{
	position:relative;
	display:block;
	}
#sec2 ul li a:after{
	background-color:#000;
	content:"";
	display:block;
	width:100%;
	height:100%;
	left:0;
	top:0;
	position:absolute;
	z-index:3;
	filter:alpha(opacity=40);
	-moz-opacity:0.4;
	opacity:0.4;
	}
#sec2 ul li a:hover:after{
	display:none;
	}
#sec2 ul li a:hover img{
	filter:alpha(opacity=100);
	-moz-opacity:1;
	opacity:1;
	}
#sec2 ul li img{
	width:100%;
	height:auto;
	position:relative;
	z-index:1;
	}
#sec2 ul li div{
	position:absolute;
	z-index:4;
	border:1px solid #FFF;
	width:68%;
	height:70%;
	left:14%;
	top:15%;
	text-align:center;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-o-box-sizing:border-box;
	-ms-box-sizing:border-box;
	}
#sec2 ul li:nth-of-type(5) div,#sec2 ul li:nth-of-type(6) div,#sec2 ul li:nth-of-type(7) div{
	height:50%;
	top:25%;
	}
#sec2 ul li div h3{
	font-size:16px;
	background-color:#FFF;
	padding:7px 0px 5px 2px;
	text-align:center;
	line-height:1.3;
	}
#sec2 ul li div h4{
	position:absolute;
	top:50%;
	left:50%;
	transform:translateY(-50%) translateX(-50%);
	-webkit- transform:translateY(-50%) translateX(-50%);
	text-align:left;
	padding-top:60px;
	min-height:100%;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	font-size:26px;
	font-weight:normal;
	text-align:left;
	color:#FFF;
	display:inline-block;
	line-height:1.4;
	-webkit-writing-mode:vertical-rl;
	-ms-writing-mode:tb-rl;
	writing-mode:vertical-rl;
	text-shadow:-2px 2px 4px rgba(30,30,30,0.5);
	}
#sec3{
	max-width:1600px;
	margin:0 auto;
	background:url(../img/home/sec3bg.jpg) no-repeat center center;
	display:block;
	height:700px;
	-webkit-background-size:cover;
	background-size:cover;
	overflow:hidden;
	zoom:1;
	text-align:center;
	}
#sec3 a{
	display:block;
	width:100%;
	height:100%;
	position:relative;
	}
#sec3 a:hover{
	text-decoration:none;
	}
#sec3 a:hover:after{
	content:"";
	background-color:#FFF;
	filter:alpha(opacity=20);
	-moz-opacity:0.2;
	opacity:0.2;
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	}
#sec3 h2{
	display:inline-block;
	font-weight:normal;
	font-size:45px;
	line-height:1.8;
	padding-top:60px;
	-webkit-writing-mode:vertical-rl;
	-ms-writing-mode:tb-rl;
	writing-mode:vertical-rl;
	color:#FFF;
	text-shadow:-2px 2px 4px rgba(30,30,30,0.5);
	margin-left:10px;
	}
#sec3 h3{
	display:block;
	font-weight:normal;
	font-size:28px;
	line-height:1.3;
	width:150px;
	height:150px;
	padding-top:60px;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-o-box-sizing:border-box;
	-ms-box-sizing:border-box;
	margin:20px auto 0 auto;
	color:#FFF;
	text-shadow:-2px 2px 4px rgba(30,30,30,0.5);
	background:url(../img/home/sec3-circle.png) no-repeat center center;
	-webkit-background-size:150px auto;
	background-size:150px auto;
	}
#baner-sdgs{
	display:block;
	margin:0 auto 70px auto;
	width:1100px;
	max-width:100%;
	}
#baner-sdgs img{
	height:auto;
	max-width:100%;
	border:1px solid #CCC;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	}
#baner-sdgs img.sp{
	display:none;
	}
.newsclipbaner{
	width:860px;
	margin:0 auto;
	padding:70px 40px 70px 40px;
	max-width:100%;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-o-box-sizing:border-box;
	-ms-box-sizing:border-box;
	}
.newsclipbaner img{
	max-width:100%;
	height:auto;
	}
@media screen and (max-width:1050px){
#sec1 #slidebg #slide h2{
	font-size:34px;
	margin:-180px 0 0 -50px;
	}
#sec1 #slidebg #slide h3{
	font-size:18px;
	left:22%;
	margin-top:-90px;
	}
#sec1 #slidebg #slide h4{
	font-size:16px;
	left:12%;
	margin-top:-60px;
	}
#sec1 #slidebg #sum ul li h3{
	font-size:22px;
	margin-top:-30px;
	}
#sec1 #slidebg #sum ul li:nth-of-type(11) h3{
	margin-top:-45px;
	}
#sec1 #slidebg #sum ul li h3 strong{
	font-size:15px;
	margin-top:20px;
	}
}
@media screen and (max-width:940px){
header{
	min-height:100%;
	}
#newsbg{
	padding:50px 6% 50px 6%;
	}
.newsb{
	padding-bottom:50px;
	}
.newsb.impor{
	margin-top:40px;
	}
.newsb h2{
	padding:30px 6% 24px 110px;
	background-position:20px center;
	-webkit-background-size:70px auto;
	background-size:70px auto;
	text-align:left;
	}
.newsb h2 strong{
	font-size:23px;
	letter-spacing:0.1em;
	}
.newsb h2 strong span{
	font-size:18px;
	margin-bottom:6px;
	}
.newsb article{
	padding:30px 0 30px 0;
	margin:0 6%;
	}
.newsb article time{
	font-size:17px;
	letter-spacing:0.1em;
	position:relative;
	left:auto;
	top:auto;
	display:block;
	margin-bottom:8px;
	}
.newsb article h3{
	font-size:19px;
	line-height:1.7;
	}
.newsb article h3 .newicon{
	padding:2px 8px 1px 8px;
	margin-left:12px;
	}
.newsb h4{
	padding-top:35px;
	}
.newsb h4.linkto a{
	font-size:20px;
	}
#sec1{
	padding:60px 0 0 0;
	}
#sec1 p{
	padding:150px 0 40px 0;
	background:url(../img/home/hokkaido.png) no-repeat center top;
	-webkit-background-size:180px auto;
	background-size:180px auto;
	}
#sec1 #slidebg{
	height:auto !important;
	}
#sec1 #slidebg #slide{
	position:relative;
	left:auto;
	top:auto;
	width:460px;
	max-width:100%;
	margin:0 auto;
	}
#sec1 #slidebg #slide ul li img{
	border:6px solid #DBDBDB;
	}
#sec1 #slidebg #slide h2{
	display:none;
	}
#sec1 #slidebg #slide h3{
	font-size:22px;
	left:55%;
	margin-top:-110px;
	}
#sec1 #slidebg #slide h4{
	font-size:18px;
	left:35%;
	margin-top:-70px;
	}
#sec1 #slidebg #slide:after{
	left:50%;
	}
#sec1 #slidebg #sum ul li{
	position:relative;
	left:auto;
	top:auto;
	width:33%;
	float:left;
	margin:10px 0.5% 0 0;
	}
#sec1 #slidebg #sum ul li:nth-of-type(2){
	left:auto;
	margin-top:10px;
	}
#sec1 #slidebg #sum ul li:nth-of-type(3){
	left:auto;
	margin:10px 0 0 0;
	}
#sec1 #slidebg #sum ul li:nth-of-type(4){
	left:auto;
	margin-top:10px;
	}
#sec1 #slidebg #sum ul li:nth-of-type(5){
	left:auto;
	margin-top:10px;
	}
#sec1 #slidebg #sum ul li:nth-of-type(6){
	left:auto;
	margin:10px 0 0 0;
	}
#sec1 #slidebg #sum ul li:nth-of-type(7){
	margin-top:10px;
	}
#sec1 #slidebg #sum ul li:nth-of-type(8){
	left:auto;
	margin-top:10px;
	}
#sec1 #slidebg #sum ul li:nth-of-type(9){
	left:auto;
	margin:10px 0 0 0;
	}
#sec1 #slidebg #sum ul li:nth-of-type(10){
	left:auto;
	margin-top:10px;
	}
#sec1 #slidebg #sum ul li:nth-of-type(11){
	left:auto;
	margin-top:10px;
	}
#sec1 #slidebg #sum ul li:nth-of-type(12){
	left:auto;
	margin:10px 0 0 0;
	}
#sec1 #slidebg #sum ul li h3{
	font-size:19px;
	top:50%;
	left:50%;
	transform:translateY(-50%) translateX(-50%);
	-webkit- transform:translateY(-50%) translateX(-50%);
	margin:0;
	}
#sec1 #slidebg #sum ul li:nth-of-type(11) h3{
	margin:0;
	}
#sec1 #slidebg #sum ul li h3 strong{
	display:none;
	}
#sec1 #slidebg #sum ul li h3 span{
	display:block;
	}
#sec1 #slidebg #sum ul li a:after{
	display:none;
	}
#sec2{
	padding:50px 0 50px 0;
	max-width:500px;
	}
#sec2 ul li{
	width:50%;
	}
#sec2 ul li:nth-of-type(5),#sec2 ul li:nth-of-type(6),#sec2 ul li:nth-of-type(7){
	width:100%;
	overflow:hidden;
	zoom:1;
	margin-top:5px;
	}
#sec2 ul li:nth-of-type(5) img,#sec2 ul li:nth-of-type(6) img,#sec2 ul li:nth-of-type(7) img{
	margin-top:-50%;
	}
#sec2 ul li div{
	width:84%;
	height:90%;
	left:8%;
	top:5%;
	}
#sec2 ul li:nth-of-type(5) div,#sec2 ul li:nth-of-type(6) div,#sec2 ul li:nth-of-type(7) div{
	height:52%;
	top:44%;
	}
#sec2 ul li div h3{
	font-size:16px;
	}
#sec2 ul li div h4{
	font-size:20px;
	}
#sec3{
	height:400px;
	}
#sec3 h2{
	font-size:28px;
	line-height:1.6;
	padding-top:30px;
	margin-left:-10px;
	}
#sec3 h3{
	font-size:18px;
	width:100px;
	height:100px;
	padding-top:40px;
	margin:-5px auto 0 auto;
	-webkit-background-size:100px auto;
	background-size:100px auto;
	}
#baner-sdgs{
	margin:0 6% 55px 6%;
	max-width:88%;
	}
#baner-sdgs img{
	display:none;
	}
#baner-sdgs img.sp{
	display:block;
	margin:0 auto;
	}
}
@media screen and (max-width:500px){
header{
	overflow:visible;
	}
header .youtubelink{
	left:2%;
	bottom:8%;
	}
header .youtubelink img{
	width:110px;
	}
.bx-wrapper{
	position:relative;
	margin:0 auto 0px;
	padding:0;
	*zoom:1;
	}
.bx-wrapper img{
	max-width:100%;
	display:block;
	}
.bx-wrapper .bx-pager{
	position:absolute;
	bottom:35px;
	width:100%;
	}
.bx-wrapper .bx-loading{
	min-height:50px;
	background:url(../img/home/bx_loader.gif) center center no-repeat #fff;
	height:100%;
	width:100%;
	position:absolute;
	top:0;
	left:0;
	z-index:20;
	}
.bx-wrapper .bx-pager{
	text-align:center;
	font-size:.85em;
	font-family:Arial;
	font-weight:bold;
	color:#E6E6E6;
	z-index:4;
	}
.bx-wrapper .bx-pager .bx-pager-item{
	display:inline-block;
	*zoom:1;
	*display:inline;
	}
.bx-wrapper .bx-pager.bx-default-pager a{
	background:#E6E6E6;
	text-indent:-9999px;
	display:block;
	width:10px;
	height:10px;
	margin:0 10px;
	outline:0;
	border-radius:400px;
	-webkit-border-radius:400px;
	-moz-border-radius:400px;
	-o-border-radius:400px;
	-ms-border-radius:400px;
	}
.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active{
	background:#232323;
	}
.bx-wrapper .bx-prev:hover,.bx-wrapper .bx-next:hover{
	filter:alpha(opacity=70);
	-moz-opacity:0.7;
	opacity:0.7;
	}
#moviebg{
	display:none;
	}
#slidesp{
	display:block;
	height:100%;
	-webkit-background-size:cover;
	background-size:cover;
	overflow:hidden;
	zoom:1;
	position:absolute;
	top:0;
	left:0;
	min-width:100%;
	min-height:100%;
	}
#slidesp ul li{
	display:block;
	width:100%;
	height:100px;
	overflow:hidden;
	zoom:1;
	}
#slidesp ul li.slidesp1{
	background:url(../img/home/slide1sp.jpg) no-repeat center center;
	-webkit-background-size:cover;
	background-size:cover;
	}
#slidesp ul li.slidesp2{
	background:url(../img/home/slide2sp.jpg) no-repeat center center;
	-webkit-background-size:cover;
	background-size:cover;
	}
#slidesp ul li.slidesp3{
	background:url(../img/home/slide3sp.jpg) no-repeat center center;
	-webkit-background-size:cover;
	background-size:cover;
	}
#slidesp ul li.slidesp4{
	background:url(../img/home/slide4sp.jpg) no-repeat center center;
	-webkit-background-size:cover;
	background-size:cover;
	}
#slidesp ul li img{
	height:40%;
	width:auto;
	margin:42% auto 0 auto;
	}
#slidesp ul li.slidesp4 img{
	height:70%;
	margin:24% auto 0 auto;
	}
#slidesp ul li.slidesp3 img{
	height:42%;
	margin:36% auto 0 auto;
	}
#slidesp ul li.slidesp1 img{
	height:46%;
	margin:38% auto 0 auto;
	}
#sec2 ul{
	padding:0 0 5px 5px
	}
#sec2 ul li{
	padding:5px 5px 0 0;
	}
#sec2 ul li div h3{
	font-size:13px;
	padding:5px 0px 5px 0px;
	}
.newsclipbaner{
	padding:40px 6% 50px 6%;
	}
}