@charset "UTF-8";
/* CSS Document */

/*リセットCSS*/
html,body,h1,h2,h3,p,ul,li,a{
margin:0;
padding:0;
line-height: 1.0;
 "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
color:#4c4b4c;
}
ul{
	list-style: none;
}
a{
	text-decoration: none;
}
img{
	vertical-align: bottom;
}

/*PC*/
header{
	width:100%;
	height: 80px;
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	justify-content: center;
	position: relative;
}
header::before{
	height:60px;
	content:"";
	background: url(../img/tree.svg) no-repeat center center/contain;
	position:absolute;
	bottom:0;
	left:0;
	right:170px;
}
header::after{
	content:"";
	width:100%;
	height:5px;
	background: url(../img/wave.svg) repeat-x center bottom;
	position: absolute;
	bottom:0;
	left:0;
}
header>p{
	margin:0 auto;
	width:100px;
	text-align: center;
	font-size:10px;
}
h1{
	margin: 0 auto;
	width:100px;
	background: url(../img/jima_logo.svg) no-repeat center center/contain;
	white-space: nowrap;
	text-indent: 100%;
	overflow: hidden;
}
main{
	width:960px;
	margin:50px auto;
}
.main-header{
	margin:0 auto 50px;
	text-align: center;
}
.main-header>p{
	margin:4px auto;
	text-align: center;
	width:200px;
	border-top:#4c4b4c solid 1px;
	padding-top:4px;
}
.container{
	margin:0 0 50px;
	width:100%;
	display: flex;
	flex-wrap:wrap;
	justify-content: space-around;
}
.container_set{
	margin:20px 10px;
	width:300px;
	flex-wrap:wrap;
}
.container_set img{
	max-width:300px;
}
h3,h4{
	text-align: center;
	margin:40px 0 10px;
}
.soft{
	display:flex;
	flex-wrap:wrap;
}
.soft>li{
	background: #6FC0EE;
	border-radius: 20px;
	padding:4px 16px;
	margin:6px 4px;
	color:#fff;
	text-shadow: 1px 2px 2px rgba(0,0,0,0.3);
}
.function{
	list-style-type: disc;
}
.function>li{
	margin:4px 0;
}
footer{
	width:100%;
	height:60px;
	background:#fddd5d;
}
footer>p{
	text-align: center;
	line-height: 60px;
	margin:0 auto;
}

@media screen and (max-width: 960px){
main{
	width:100%;
	}
}