@charset "UTF-8";
/* CSS Document */
html, body, div, span, iframe,
h1, h2, h3, h4, h5, h6, p, a, font, img, strong, 
dl, dt, dd, ol, ul, li, table, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align: baseline;
	font-family: inherit;
	font-style: inherit;
	font-weight: inherit;
}
h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
}
ol, ul {
	list-style: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
th, td {
	font-weight: normal;
	text-align: left;
	vertical-align: top;
}
a:link,a:visited,a:active,a:hover {
    color: #333;
    text-decoration: none;
}

/* 共通 */
body {
	font-family: "游ゴシック",YuGothic,"メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "ＭＳ Ｐゴシック", "MS P Gothic", Verdana, Arial, Helvetica, sans-serif;
	font-size: 15px;
	line-height: 1.6em;
	text-align: center;
	color: #333;
	background: #fff;
}

/* ヘッダー */
header ul {
    font-size: 13px;
    text-align: right;
    background: #ddd;
    margin: 0 auto;
    padding: 4px 10px;
}
header li {
    margin-left: 15px;
    display: inline;
}
header li:nth-of-type(2) a {
	background: url("../common/mail.gif") no-repeat left center;
	background-size: 16px;
    padding: 0 0 0 18px;
}
header img {
    width: 100px;
    vertical-align: bottom;
    margin: 15px 0;
}
/* ナビ */
#navi {
    width: 100%;
    max-width: 820px;
    margin: 0 auto;
	padding: 0 5px;
    box-sizing: border-box;
}
#navi ul {
    font-size: 0;
    padding: 0 0 15px 0;
}
#navi ul li {
    font-size: 13px;
    font-weight: bold;
    line-height: 1.5em;
    width: 25%;
    vertical-align: top;
    padding: 0 5px 2px 5px;
    box-sizing: border-box;
    display: inline-block;
}
#navi ul li a {
    color: #fff;
    background: #7fbe41 no-repeat center top;
    width: 100%;
    border-radius: 10px;
	padding: 70px 0 4px 0;
	display: block;
}
#navi ul li:nth-of-type(1) a {
	background-image: url("../common/navi_01.png");
	background-size: auto 65px;
    padding: 55px 0 0 0;
}
#navi ul li:nth-of-type(2) a {
	background-image: url("../common/navi_02.png");
	background-size: auto 65px;
}
#navi ul li:nth-of-type(3) a {
	background-image: url("../common/navi_03.png");
	background-size: auto 65px;
}
#navi ul li:nth-of-type(4) a {
	background-image: url("../common/navi_04.png");
	background-size: auto 65px;
}

.title {
    text-align: left;
	font-size: 16px;
	font-weight: bold;
    width: 100%;
	max-width: 820px;
	margin: 0 auto;
	padding: 0 10px;
    box-sizing: border-box;
}
.title h1 {
    background: url("../common/sq01.gif") no-repeat left center;
    background-size: 14px;
	padding: 0 0 0 18px;
}
/* コンテンツ */
.contents {
    text-align: left;
	width: 100%;
	max-width: 600px;
	margin: 0 auto;
	padding: 10px 10px 30px 10px;
	box-sizing: border-box;
}
.contents img {
	vertical-align: bottom;
}
.contents .main img {
    width: 100%;
}
.contents .btn {
    width: 100%;
    max-width: 480px;
    margin: 0 auto;
}
.contents .btn a {
    text-align: center;
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 2px;
    color: #fff;
    background: #ef8337;
    width: 100%;
    border-radius: 10px;
	padding: 15px 0;
	display: block;
}

.contents > h2 {
	font-size: 16px;
	font-weight: bold;
    border-bottom: #73c6c7 solid 2px;
	padding: 15px 0 5px 0;
}

.contents > dl > dt {
	font-size: 16px;
	font-weight: bold;
    border-bottom: #73c6c7 solid 2px;
	padding: 0 0 5px 0;
}
.contents > dl > dd {
	padding: 5px 0 0 0;
}

.top {
    padding: 0 0 20px 0;
}
.top img {
	width: 100%;
    max-width: 800px;
    vertical-align: bottom;
}

/* フッター */
#footer {
    border-top: #aaa solid thin;
	padding: 0 0 10px 0;
}
#footer p {
	color: #555;
	font-size: 12px;
    padding: 5px 0 0 0;
}
/* フッターナビ */
#footer .menu {
    font-size: 12px;
	padding: 15px 0;
	position: relative;
	overflow: hidden;
}
#footer .menu ul {
	position: relative;
	left: 50%;
	float: left;
}
#footer .menu ul li {
	line-height: 1.2em;
	border-right: #333 thin solid;
	position: relative;
	left: -50%;
	float: left;
	padding: 0 15px;
}
#footer .menu ul li:last-of-type {
	border-right: none;
}
#footer .menu ul:after {
	content: "";
	clear: both;
	display: block;
}

/* トップに戻る */
.btn_top {
	cursor: pointer;
	display: inline-block;
}
.arrow {
	background: url("../common/btn_top.png") no-repeat center top 12px;
	background-size: 20px; 
	width: 40px;
	height: 40px;
	border: #555 thin solid;
	border-radius: 20px;
}

@media only screen and (max-width: 780px) {
	/* フッターナビ */
	#footer .menu {
        font-size: 14px;
		padding: 0;
		position: static;
		overflow: visible;
	}
	#footer .menu ul {
		position: static;
		left: auto;
		float: none;
        padding: 0 0 20px 0;
	}
	#footer .menu ul li {
		border-right: none;
		border-bottom: #aaa thin solid;
		position: static;
		left: auto;
		float: none;
		padding: 0;
	}
	#footer .menu ul li a {
        background: #eee;
		padding: 12px 0;
		display: block;
	}
}
@media only screen and (max-width: 600px) {
    #navi ul li {
        padding: 0 3px 2px 3px;
    }
}
@media only screen and (max-width: 350px) {
    #navi ul li {
        font-size: 12px;
    }
    #navi ul li a {
        padding: 70px 0 3px 0;
    }
}
@media only screen and (max-width: 319px) {
    #navi ul li {
        font-size: 11px;
    }
    #navi ul li a {
        padding: 70px 0 2px 0;
    }
}
@media only screen and (max-width: 310px) {
	/* ナビ */
	#navi {
        padding: 0 0 20px 0;  
    }
    #navi ul {
        border-top: #7fbe41 solid thin;
        border-bottom: #7fbe41 solid thin;
        padding: 10px 0;
    }
    #navi ul li {
        font-size: 12px;
        vertical-align: middle;
        width: auto;
        padding: 0 10px 0 0;
    }
    #navi ul li:last-of-type {
        padding: 0;
    }
    #navi ul li a {
        color: #7fbe41;
        background: #fff;
        width: 100%;
        border-radius: 0;
        padding: 0;
    }
    #navi ul li:nth-of-type(1) a {
        background-image: none;
        padding: 0;
    }
    #navi ul li:nth-of-type(2) a {
	    background-image: none;
    }
    #navi ul li:nth-of-type(3) a {
	    background-image: none;
    }
    #navi ul li:nth-of-type(4) a {
	    background-image: none;
    }
}