@charset "utf-8";

*{
	margin:0px;
	padding:0px;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
}
body{
	font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro";
	text-align:left;
	color:#000000;
	font-size:15px;
	background:#EEFFFF;
}
.clear{clear:both;}

a{ text-decoration:underline; color:#0000FF; }
a:visited{ text-decoration:underline; color:#0000FF; }
a:hover{ text-decoration:none; color:#770077; }
a:active{ text-decoration:none; color:#FF0000; }


.header{
	width:100%;
	background:#FFFFFF;
	padding-top:20px;
	border-top:3px solid #87cefa;
	box-shadow:0px 0px 3px 0px #999999;
}
.subtitle{
	color:#555555;
	font-size:16px;
	letter-spacing:3px;
}
.title{
	display:flex;
    -webkit-align-items: center;
	align-items: center;
	margin-top:2px;
	margin-bottom:4px;
}
img.title_icon{
	height:50px;
	padding-right:10px;
}
h1{
	font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;;
	color:#555555;
	font-weight:900;
	font-size:30px;
	letter-spacing:3px;
}
.header hr{
	border:0;
	width:100%;
	height:1px;
	background:#CDCDCD;
}
.continer{
	width:75%;
	margin-left:auto;
	margin-right:auto;
}
.menu{
	padding-top:10px;
	padding-bottom:10px;
}
.menu ul{
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
    list-style-type:none;
}
.menu ul li{
	padding-right:60px;
	padding-top:0.3em;
	padding-bottom:0.3em;
	padding-left:1.0em;
	position:relative;
}
.menu ul li:before {
	position:absolute;
	content:'';
	top: 0.5em;
	left: 0em;
	height:0;
	width:0;
	border-style: solid;
	border-width: 6px 0 6px 9px;
	border-color: transparent transparent transparent #3F51B5;
}
.footer{
	padding-top:50px;
	padding-bottom:50px;
	margin-top:30px;
	background:#444444;
	color:#EEEEEE;
}
h2{
	font-size:20px;
	border-top:3px solid #87cefa;
	padding:15px;
	color:#444444;
	background:#c7e6fd;
}
.wrap_box{
	margin-top:30px;
}
.contents{
	padding-top:20px;
	background:#FFFFFF;
	border-bottom:1px solid #DFDFDF;
	border-left:1px solid #DFDFDF;
	border-right:1px solid #DFDFDF;
}
p{
	line-height: 2.0;
	padding-right:15px;
	padding-left:15px;
	padding-bottom:15px;
}
.box{
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
    margin-top:20px;
	margin-left:auto;
	margin-right:auto;
	width:100%;
	border-bottom:2px dotted #DDDDDD;
}
h3{
	display:block;
	padding: 0.5em 1em;
	margin-bottom:20px;
	background: #FFFFFF;
	border-left: solid 6px #87cefa;
	box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.33);
	color:#87cefa;
	font-size:20px;
	font-weight:900;
}
.left{
	width:60%;
	padding-right:15px;
}
.right{
	width:40%;
	display:flex;
    -webkit-align-items: center;
	align-items: center;
	 -webkit-justify-content: center;
	 padding-left:15px;
}
.right img{
	display:block;
	width:100%;
}
.social{
	width:100%;
	display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
    padding:5px;
}
.social a{
	width:33%;
	padding:10px;
}
.social a img{
	width:100%;
	height:auto;
}

/* #########スマホ########### */
@media screen and (max-width: 900px){

	.wrapper{ width:100%; padding-left:10px;padding-right:10px;}
	.continer{ width: 100%;}
	.menu ul{ display:block;}
	.menu ul li { padding-right:0;}
	.header{ padding-left:10px;}
	.left{width:100%;}
	.right{ margin-left:auto;margin-right:auto;}
	.right img{ width: 350px ;}
	.box{padding-bottom:20px;}
	h4{ width:100%;}
}